diff --git a/packages/calcite-components/src/components/combobox/combobox.e2e.ts b/packages/calcite-components/src/components/combobox/combobox.e2e.ts index 6b195d744a7..ca51eed1981 100644 --- a/packages/calcite-components/src/components/combobox/combobox.e2e.ts +++ b/packages/calcite-components/src/components/combobox/combobox.e2e.ts @@ -875,7 +875,7 @@ describe("calcite-combobox", () => { await input.press("Enter"); await page.waitForChanges(); - const item = await page.find("calcite-combobox-item:last-child"); + const item = await page.find("calcite-combobox-item:first-child"); expect(await item.getProperty("textLabel")).toBe("K"); const combobox = await page.find("calcite-combobox"); @@ -902,14 +902,14 @@ describe("calcite-combobox", () => { await input.press("Enter"); await page.waitForChanges(); + const customValue = await page.find("calcite-combobox-item:first-child"); const item1 = await page.find("calcite-combobox-item#one"); - const item2 = await page.find("calcite-combobox-item:last-child"); - expect(await item2.getProperty("textLabel")).toBe("K"); + expect(await customValue.getProperty("textLabel")).toBe("K"); expect((await combobox.getProperty("selectedItems")).length).toBe(1); + expect(await customValue.getProperty("selected")).toBe(true); expect(await item1.getProperty("selected")).toBe(false); - expect(await item2.getProperty("selected")).toBe(true); }); it("should auto-select new custom values in multiple selection mode", async () => { @@ -930,16 +930,16 @@ describe("calcite-combobox", () => { await input.press("Escape"); await page.waitForChanges(); + const customValue = await page.find("calcite-combobox-item:first-child"); const item1 = await page.find("calcite-combobox-item#one"); const item2 = await page.find("calcite-combobox-item#two"); - const item3 = await page.find("calcite-combobox-item:last-child"); const chips = await page.findAll("calcite-combobox >>> calcite-chip"); expect((await combobox.getProperty("selectedItems")).length).toBe(3); expect(chips[2].textContent).toBe("K"); + expect(await customValue.getProperty("selected")).toBe(true); expect(await item1.getProperty("selected")).toBe(true); expect(await item2.getProperty("selected")).toBe(true); - expect(await item3.getProperty("selected")).toBe(true); }); }); diff --git a/packages/calcite-components/src/components/combobox/combobox.tsx b/packages/calcite-components/src/components/combobox/combobox.tsx index 8c7506bf9a2..b6843a74149 100644 --- a/packages/calcite-components/src/components/combobox/combobox.tsx +++ b/packages/calcite-components/src/components/combobox/combobox.tsx @@ -1292,7 +1292,7 @@ export class Combobox item.value = value; item.textLabel = value; item.selected = true; - this.el.appendChild(item); + this.el.prepend(item); this.resetText(); if (focus) { this.setFocus();