diff --git a/packages/calcite-components/src/components/combobox-item/combobox-item.e2e.ts b/packages/calcite-components/src/components/combobox-item/combobox-item.e2e.ts
index c601131b6f1..93ab1a303be 100644
--- a/packages/calcite-components/src/components/combobox-item/combobox-item.e2e.ts
+++ b/packages/calcite-components/src/components/combobox-item/combobox-item.e2e.ts
@@ -1,5 +1,4 @@
-import { describe, it, expect } from "vitest";
-import { newE2EPage } from "@arcgis/lumina-compiler/puppeteerTesting";
+import { describe } from "vitest";
import { defaults, disabled, hidden, reflects, renders, slots } from "../../tests/commonTests";
import { SLOTS } from "./resources";
@@ -47,43 +46,4 @@ describe("calcite-combobox-item", () => {
describe("disabled", () => {
disabled("calcite-combobox-item", { focusTarget: "none" });
});
-
- it("should emit calciteInternalComboboxItemChange", async () => {
- const page = await newE2EPage();
-
- await page.setContent("");
-
- const element = await page.find("calcite-combobox-item");
-
- const eventSpy = await element.spyOnEvent("calciteInternalComboboxItemChange");
-
- await page.waitForChanges();
-
- expect(eventSpy).not.toHaveReceivedEvent();
-
- element.setProperty("selected", true);
- await page.waitForChanges();
-
- expect(eventSpy).toHaveReceivedEventTimes(1);
-
- element.setProperty("textLabel", "hello");
- await page.waitForChanges();
-
- expect(eventSpy).toHaveReceivedEventTimes(2);
-
- element.setProperty("heading", "hello");
- await page.waitForChanges();
-
- expect(eventSpy).toHaveReceivedEventTimes(3);
-
- element.setProperty("label", "hello");
- await page.waitForChanges();
-
- expect(eventSpy).toHaveReceivedEventTimes(4);
-
- element.setProperty("disabled", true);
- await page.waitForChanges();
-
- expect(eventSpy).toHaveReceivedEventTimes(5);
- });
});
diff --git a/packages/calcite-components/src/components/combobox/combobox.e2e.ts b/packages/calcite-components/src/components/combobox/combobox.e2e.ts
index 87e0957d53c..d1c7495cc06 100644
--- a/packages/calcite-components/src/components/combobox/combobox.e2e.ts
+++ b/packages/calcite-components/src/components/combobox/combobox.e2e.ts
@@ -731,6 +731,62 @@ describe("calcite-combobox", () => {
});
});
+ it("should update screen reader list items", async () => {
+ const page = await newE2EPage();
+
+ await page.setContent(
+ html`
+
+ `,
+ );
+
+ const item = await page.find("calcite-combobox-item");
+ let a11yItem = await page.find(`calcite-combobox >>> ul.${CSS.screenReadersOnly} li`);
+
+ expect(a11yItem).not.toBeNull();
+ expect(await a11yItem.getProperty("ariaSelected")).toBe("false");
+ expect(await a11yItem.getProperty("ariaLabel")).toBe(null);
+ expect(await a11yItem.getProperty("textContent")).toBe("");
+
+ item.setProperty("selected", true);
+ await page.waitForChanges();
+ await page.waitForTimeout(DEBOUNCE.nextTick);
+ a11yItem = await page.find(`calcite-combobox >>> ul.${CSS.screenReadersOnly} li`);
+
+ expect(await a11yItem.getProperty("ariaSelected")).toBe("true");
+
+ const label = "label";
+ item.setProperty("label", label);
+ await page.waitForChanges();
+ await page.waitForTimeout(DEBOUNCE.nextTick);
+ a11yItem = await page.find(`calcite-combobox >>> ul.${CSS.screenReadersOnly} li`);
+
+ expect(await a11yItem.getProperty("ariaLabel")).toBe(label);
+
+ const textLabel = "textLabel";
+ item.setProperty("textLabel", textLabel);
+ await page.waitForChanges();
+ await page.waitForTimeout(DEBOUNCE.nextTick);
+ a11yItem = await page.find(`calcite-combobox >>> ul.${CSS.screenReadersOnly} li`);
+
+ expect(await a11yItem.getProperty("textContent")).toBe(textLabel);
+
+ const heading = "heading";
+ item.setProperty("heading", heading);
+ await page.waitForChanges();
+ await page.waitForTimeout(DEBOUNCE.nextTick);
+ a11yItem = await page.find(`calcite-combobox >>> ul.${CSS.screenReadersOnly} li`);
+
+ expect(await a11yItem.getProperty("textContent")).toBe(heading);
+
+ item.setProperty("disabled", true);
+ await page.waitForChanges();
+ await page.waitForTimeout(DEBOUNCE.nextTick);
+ a11yItem = await page.find(`calcite-combobox >>> ul.${CSS.screenReadersOnly} li`);
+
+ expect(a11yItem).toBeNull();
+ });
+
it("should control max items displayed", async () => {
const maxItems = 7;
const page = await newE2EPage();
diff --git a/packages/calcite-components/src/components/combobox/combobox.tsx b/packages/calcite-components/src/components/combobox/combobox.tsx
index cb09774c20c..c4abe0d66de 100644
--- a/packages/calcite-components/src/components/combobox/combobox.tsx
+++ b/packages/calcite-components/src/components/combobox/combobox.tsx
@@ -1785,7 +1785,7 @@ export class Combobox
this.renderAllSelectedIndicatorChipCompact(),
]}