diff --git a/src/components/MultiSuggestField/MultiSuggestField.stories.tsx b/src/components/MultiSuggestField/MultiSuggestField.stories.tsx index eb66659b..370d87b7 100644 --- a/src/components/MultiSuggestField/MultiSuggestField.stories.tsx +++ b/src/components/MultiSuggestField/MultiSuggestField.stories.tsx @@ -8,7 +8,7 @@ import { MultiSuggestField, MultiSuggestFieldSelectionProps, SimpleDialog } from const testLabels = loremIpsum({ p: 1, - avgSentencesPerParagraph: 100, + avgSentencesPerParagraph: 50, avgWordsPerSentence: 1, startWithLoremIpsum: false, random: false, @@ -17,9 +17,9 @@ const testLabels = loremIpsum({ .split(".") .map((item) => item.trim()); -const items = new Array(100).fill(undefined).map((_, id) => { - const testLabel = testLabels[id]; - return { testLabel, testId: `${testLabel}-${id}` }; +const items = new Array(50).fill(undefined).map((_, id) => { + const testLabel = `${testLabels[id]}${id + 1}`; + return { testLabel, testId: `${testLabel}-id` }; }); export default { diff --git a/src/components/MultiSuggestField/tests/MultiSuggestField.test.tsx b/src/components/MultiSuggestField/tests/MultiSuggestField.test.tsx index 94fdf8a6..c01e1b52 100644 --- a/src/components/MultiSuggestField/tests/MultiSuggestField.test.tsx +++ b/src/components/MultiSuggestField/tests/MultiSuggestField.test.tsx @@ -6,10 +6,10 @@ import "@testing-library/jest-dom"; import { MultiSuggestField } from "../../../../index"; import { CustomSearch, Default, dropdownOnFocus, predefinedNotControlledValues } from "../MultiSuggestField.stories"; -const testLabels = ["label1", "label2", "label3", "label4", "label5"]; +//const testLabels = ["label1", "label2", "label3", "label4", "label5"]; -const items = new Array(5).fill(undefined).map((_, id) => { - const testLabel = testLabels[id]; +const items = new Array(50).fill(undefined).map((_, id) => { + const testLabel = `label${id + 1}`; return { testLabel, testId: `${testLabel}-id` }; }); @@ -108,7 +108,7 @@ describe("MultiSuggestField", () => { expect(menuItems.length).toBe(dropdownOnFocus.args.items.length); }); - fireEvent.change(input, { target: { value: "ex" } }); + fireEvent.change(input, { target: { value: "cras" } }); await waitFor(() => { const listbox = screen.getByRole("listbox"); @@ -277,7 +277,7 @@ describe("MultiSuggestField", () => { expect(menuItems.length).toBe(CustomSearch.args.items.length); }); - fireEvent.change(input, { target: { value: "label1" } }); + fireEvent.change(input, { target: { value: "label11" } }); await waitFor(() => { const listbox = screen.getByRole("listbox"); @@ -289,10 +289,10 @@ describe("MultiSuggestField", () => { const item = menuItems[0]; const [div] = item.getElementsByTagName("div"); - expect(div.textContent).toBe("label1"); + expect(div.textContent).toBe("label11"); }); - fireEvent.change(input, { target: { value: "label1-id" } }); + fireEvent.change(input, { target: { value: "label11-id" } }); await waitFor(() => { const listbox = screen.getByRole("listbox"); @@ -304,10 +304,10 @@ describe("MultiSuggestField", () => { const item = menuItems[0]; const [div] = item.getElementsByTagName("div"); - expect(div.textContent).toBe("label1"); + expect(div.textContent).toBe("label11"); }); - fireEvent.change(input, { target: { value: "label1-id-other" } }); + fireEvent.change(input, { target: { value: "label11-id-other" } }); await waitFor(() => { const listbox = screen.getByRole("listbox");