Skip to content

Commit bfe86be

Browse files
committed
test(combo-box): more unit tests
1 parent 50b4761 commit bfe86be

File tree

1 file changed

+72
-0
lines changed

1 file changed

+72
-0
lines changed

tests/ComboBox/ComboBox.test.ts

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -294,4 +294,76 @@ describe("ComboBox", () => {
294294
await user.keyboard("{Escape}");
295295
expect(dropdown).not.toBeVisible();
296296
});
297+
298+
it("should use custom shouldFilterItem function", async () => {
299+
render(ComboBoxCustom, {
300+
props: {
301+
items: [
302+
{ id: "1", text: "Apple" },
303+
{ id: "2", text: "Banana" },
304+
{ id: "3", text: "Cherry" },
305+
],
306+
shouldFilterItem: (item: { text: string }, value: string) =>
307+
item.text.startsWith(value),
308+
},
309+
});
310+
const input = screen.getByRole("textbox");
311+
await user.click(input);
312+
await user.type(input, "B");
313+
const options = screen.getAllByRole("option");
314+
expect(options).toHaveLength(1);
315+
expect(options[0]).toHaveTextContent("Banana");
316+
});
317+
318+
it("should use custom itemToString function", async () => {
319+
render(ComboBoxCustom, {
320+
props: {
321+
items: [
322+
{ id: "1", text: "Apple" },
323+
{ id: "2", text: "Banana" },
324+
],
325+
itemToString: (item: { text: string }) => `Item ${item.text}`,
326+
},
327+
});
328+
const input = screen.getByRole("textbox");
329+
await user.click(input);
330+
const options = screen.getAllByRole("option");
331+
expect(options[0]).toHaveTextContent("Item Apple");
332+
await user.click(options[1]);
333+
expect(input).toHaveValue("Item Banana");
334+
});
335+
336+
it("should open menu if open prop is true on mount", () => {
337+
render(ComboBox, { props: { open: true } });
338+
const dropdown = screen.getAllByRole("listbox")[1];
339+
expect(dropdown).toBeVisible();
340+
});
341+
342+
it("should skip disabled items during keyboard navigation", async () => {
343+
render(ComboBoxCustom, {
344+
props: {
345+
items: [
346+
{ id: "1", text: "A" },
347+
{ id: "2", text: "B", disabled: true },
348+
{ id: "3", text: "C" },
349+
],
350+
},
351+
});
352+
const input = screen.getByRole("textbox");
353+
await user.click(input);
354+
await user.keyboard("{ArrowDown}"); // should highlight A
355+
await user.keyboard("{ArrowDown}"); // should skip B and highlight C
356+
await user.keyboard("{Enter}");
357+
expect(input).toHaveValue("C");
358+
});
359+
360+
it("should not show helper text if warn is true", () => {
361+
render(ComboBox, { props: { helperText: "Help", warn: true } });
362+
expect(screen.queryByText("Help")).not.toBeInTheDocument();
363+
});
364+
365+
it("should not show helper text if invalid is true", () => {
366+
render(ComboBox, { props: { helperText: "Help", invalid: true } });
367+
expect(screen.queryByText("Help")).not.toBeInTheDocument();
368+
});
297369
});

0 commit comments

Comments
 (0)