diff --git a/packages/fiori/src/NotificationListGroupItem.ts b/packages/fiori/src/NotificationListGroupItem.ts index a97dedcd3abb..9a2b8900cce1 100644 --- a/packages/fiori/src/NotificationListGroupItem.ts +++ b/packages/fiori/src/NotificationListGroupItem.ts @@ -10,6 +10,7 @@ import BusyIndicator from "@ui5/webcomponents/dist/BusyIndicator.js"; import Icon from "@ui5/webcomponents/dist/Icon.js"; import NotificationListGroupList from "./NotificationListGroupList.js"; import NotificationListItemBase from "./NotificationListItemBase.js"; +import type NotificationListItem from "./NotificationListItem.js"; // Icons import "@ui5/webcomponents-icons/dist/navigation-right-arrow.js"; @@ -103,10 +104,15 @@ class NotificationListGroupItem extends NotificationListItemBase { * @public */ @slot({ type: HTMLElement, "default": true }) - items!: Array + items!: Array onBeforeRendering() { super.onBeforeRendering(); + + this.items.forEach(item => { + item._ariaLevel = "2"; + }); + if (this.loading) { this.clearChildBusyIndicator(); } diff --git a/packages/fiori/src/NotificationListItem.hbs b/packages/fiori/src/NotificationListItem.hbs index 9ced3eeb07e4..cc50248acd13 100644 --- a/packages/fiori/src/NotificationListItem.hbs +++ b/packages/fiori/src/NotificationListItem.hbs @@ -6,7 +6,7 @@ @click="{{_onclick}}" tabindex="{{forcedTabIndex}}" aria-labelledby="{{ariaLabelledBy}}" - aria-level="2" + aria-level="{{_ariaLevel}}" > {{#if loading}} {{loadingText}} diff --git a/packages/fiori/src/NotificationListItem.ts b/packages/fiori/src/NotificationListItem.ts index 585120ddf80e..1d219e31657b 100644 --- a/packages/fiori/src/NotificationListItem.ts +++ b/packages/fiori/src/NotificationListItem.ts @@ -261,6 +261,8 @@ class NotificationListItem extends NotificationListItemBase { _descOverflowHeight: number; _onResizeBound: ResizeObserverCallback; + _ariaLevel : string | undefined; + constructor() { super(); diff --git a/packages/fiori/test/specs/NotificationList.spec.js b/packages/fiori/test/specs/NotificationList.spec.js index 9a171df0a3a6..45df4730345d 100644 --- a/packages/fiori/test/specs/NotificationList.spec.js +++ b/packages/fiori/test/specs/NotificationList.spec.js @@ -518,3 +518,16 @@ describe("Keyboard navigation", () => { }); }); +describe("Notification List Item Without a Group", () => { + before(async () => { + await browser.url(`test/pages/NotificationListItem.html`); + }); + + it("ACC", async () => { + const item1 = await browser.$("#notificationListWithMenu [ui5-li-notification]"); + const item1Root = await item1.shadow$(".ui5-nli-root"); + + assert.notOk(await item1Root.getAttribute("aria-level"), "aria-level is not set"); + }); +}); +