diff --git a/packages/calcite-components/src/components/action-menu/action-menu.e2e.ts b/packages/calcite-components/src/components/action-menu/action-menu.e2e.ts
index 95f6ab55811..772c1b60644 100755
--- a/packages/calcite-components/src/components/action-menu/action-menu.e2e.ts
+++ b/packages/calcite-components/src/components/action-menu/action-menu.e2e.ts
@@ -252,6 +252,46 @@ describe("calcite-action-menu", () => {
expect(actions[2].getAttribute(activeAttr)).toBe(null);
});
+ it("should handle ArrowDown navigation with disabled/hidden items", async () => {
+ const page = await newE2EPage({
+ html: html`
+
+
+
+
+ `,
+ });
+
+ await page.waitForChanges();
+
+ const actionMenu = await page.find("calcite-action-menu");
+ const actions = await page.findAll("calcite-action");
+ const trigger = await page.find(`calcite-action-menu >>> .${CSS.defaultTrigger}`);
+
+ expect(await actionMenu.getProperty("open")).toBe(false);
+
+ await actionMenu.callMethod("setFocus");
+ await page.waitForChanges();
+
+ await page.keyboard.press("ArrowDown");
+ await page.waitForChanges();
+
+ expect(await trigger.getProperty("active")).toBe(true);
+ expect(await actionMenu.getProperty("open")).toBe(true);
+ expect(actions[0].getAttribute(activeAttr)).toBe(null);
+ expect(actions[1].getAttribute(activeAttr)).toBe(null);
+ expect(actions[2].getAttribute(activeAttr)).toBe("");
+ expect(actions[3].getAttribute(activeAttr)).toBe(null);
+
+ await page.keyboard.press("ArrowDown");
+ await page.waitForChanges();
+
+ expect(actions[0].getAttribute(activeAttr)).toBe(null);
+ expect(actions[1].getAttribute(activeAttr)).toBe(null);
+ expect(actions[2].getAttribute(activeAttr)).toBe(null);
+ expect(actions[3].getAttribute(activeAttr)).toBe("");
+ });
+
it("should handle ArrowUp navigation", async () => {
const page = await newE2EPage({
html: html`
diff --git a/packages/calcite-components/src/components/action-menu/action-menu.tsx b/packages/calcite-components/src/components/action-menu/action-menu.tsx
index 368663e2b47..d24fd9f4ddd 100755
--- a/packages/calcite-components/src/components/action-menu/action-menu.tsx
+++ b/packages/calcite-components/src/components/action-menu/action-menu.tsx
@@ -419,7 +419,7 @@ export class ActionMenu implements LoadableComponent {
[]
);
- this.actionElements = actions;
+ this.actionElements = actions.filter((action) => !action.disabled && !action.hidden);
};
isValidKey(key: string, supportedKeys: string[]): boolean {