dimsum-e2e-tests 3.70.0-next.6 → 3.70.0-next.60

package/ds-card/detail-slots/DSCard.detail-slots.func.spec.js

@@ -0,0 +1,72 @@
+/* eslint-disable max-statements */
+// Tests for the fix introduced in PUI-15889 (DetailCard selectable/expandable slots).
+// Verifies consumer slot function props thread aria-label / data-testid / lang through
+// to each DetailCard slot, including the checkbox (SELECTABLE) and chevron
+// (EXPAND_CONTENT_BUTTON) sub-components that previously could not be addressed.
+import DSCardCO from '../DSCardCO';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-18689 - Card:: DetailCard slot attribute injection - Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCardCO.detailSlotsTest.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should have custom aria-label for each slot', async () => {
+      await (await DSCardCO.getDetailContainerSlot()).waitForDisplayed();
+      await expect(await DSCardCO.getDetailContainerSlot()).toHaveAttribute('aria-label', 'container aria');
+      await expect(await DSCardCO.getDetailTitleSlot()).toHaveAttribute('aria-label', 'title aria');
+      await expect(await DSCardCO.getDetailDescriptionSlot()).toHaveAttribute('aria-label', 'description aria');
+      await expect(await DSCardCO.getDetailSelectableSlot()).toHaveAttribute('aria-label', 'selectable aria');
+      await expect(await DSCardCO.getDetailExpandContentButtonSlot()).toHaveAttribute(
+        'aria-label',
+        'expand content button aria',
+      );
+      await expect(await DSCardCO.getDetailExpandContentSlot()).toHaveAttribute('aria-label', 'expand content aria');
+      await expect(await DSCardCO.getDetailSeparatorSlot()).toHaveAttribute('aria-label', 'separator aria');
+      await expect(await DSCardCO.getDetailRightAddonSlot()).toHaveAttribute('aria-label', 'right addon aria');
+      await expect(await DSCardCO.getDetailRightDescriptionSlot()).toHaveAttribute(
+        'aria-label',
+        'right description aria',
+      );
+      await expect(await DSCardCO.getDetailRightValueSlot()).toHaveAttribute('aria-label', 'right value aria');
+    });
+
+    it('02: should have custom data-testid for each slot', async () => {
+      await expect(await DSCardCO.getDetailContainerSlot()).toHaveAttribute('data-testid', 'container data');
+      await expect(await DSCardCO.getDetailTitleSlot()).toHaveAttribute('data-testid', 'title data');
+      await expect(await DSCardCO.getDetailDescriptionSlot()).toHaveAttribute('data-testid', 'description data');
+      await expect(await DSCardCO.getDetailSelectableSlot()).toHaveAttribute('data-testid', 'selectable data');
+      await expect(await DSCardCO.getDetailExpandContentButtonSlot()).toHaveAttribute(
+        'data-testid',
+        'expand content button data',
+      );
+      await expect(await DSCardCO.getDetailExpandContentSlot()).toHaveAttribute('data-testid', 'expand content data');
+      await expect(await DSCardCO.getDetailSeparatorSlot()).toHaveAttribute('data-testid', 'separator data');
+      await expect(await DSCardCO.getDetailRightAddonSlot()).toHaveAttribute('data-testid', 'right addon data');
+      await expect(await DSCardCO.getDetailRightDescriptionSlot()).toHaveAttribute(
+        'data-testid',
+        'right description data',
+      );
+      await expect(await DSCardCO.getDetailRightValueSlot()).toHaveAttribute('data-testid', 'right value data');
+    });
+
+    it('03: should have custom lang for each slot', async () => {
+      await expect(await DSCardCO.getDetailContainerSlot()).toHaveAttribute('lang', 'es');
+      await expect(await DSCardCO.getDetailTitleSlot()).toHaveAttribute('lang', 'fr');
+      await expect(await DSCardCO.getDetailDescriptionSlot()).toHaveAttribute('lang', 'de');
+      await expect(await DSCardCO.getDetailSelectableSlot()).toHaveAttribute('lang', 'it');
+      await expect(await DSCardCO.getDetailExpandContentButtonSlot()).toHaveAttribute('lang', 'pt');
+      await expect(await DSCardCO.getDetailExpandContentSlot()).toHaveAttribute('lang', 'ja');
+      await expect(await DSCardCO.getDetailSeparatorSlot()).toHaveAttribute('lang', 'nl');
+      await expect(await DSCardCO.getDetailRightAddonSlot()).toHaveAttribute('lang', 'sv');
+      await expect(await DSCardCO.getDetailRightDescriptionSlot()).toHaveAttribute('lang', 'ko');
+      await expect(await DSCardCO.getDetailRightValueSlot()).toHaveAttribute('lang', 'en');
+    });
+  });
+}

package/ds-card/detail-slots/DSCard.detail-slots.visual.spec.js

@@ -0,0 +1,19 @@
+// Tests for the fix introduced in PUI-15889 (DetailCard selectable/expandable slots).
+// Snapshots the DetailCard with per-slot styleOverrides applied via ThemeProvider,
+// exercising the slot theming API end to end.
+import DSCardCO from '../DSCardCO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-18690 - Card:: DetailCard slot theming - Visual', () => {
+    before(async () => {
+      const errorOnGo = await DSCardCO.detailSlotsTest.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should display the detail card with slot theming overrides', async () => {
+      await (await DSCardCO.getDetailContainerSlot()).waitForDisplayed();
+      const snapshot = await browser.percyCheckScreenshot(DSCardCO.snapshotPath('detail-slot-theming'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/ds-card-v3/DSCardV3CO.js

@@ -7,13 +7,17 @@ export default class DSCardV3CO extends PageObject {
   // URL's
   static accordionURL = new Urlbuilder(PATH_E2E_CARD_V3, 'accordion-test');
 
+  static accordionAriaURL = new Urlbuilder(PATH_E2E_CARD_V3, 'accordion-aria-test');
+
   static actionURL = new Urlbuilder(PATH_E2E_CARD_V3, 'action-test');
 
   static disabledURL = new Urlbuilder(PATH_E2E_CARD_V3, 'disabled-test');
 
   static dragAndDropURL = new Urlbuilder(PATH_E2E_CARD_V3, 'drag-and-drop-test');
 
-  static multiActionURL = new Urlbuilder(PATH_E2E_CARD_V3, 'multi-action-test');
+  static multiActionURL = new Urlbuilder(PATH_E2E_CARD_V3, 'multiple-action-test');
+
+  static multipleControlURL = new Urlbuilder(PATH_E2E_CARD_V3, 'multiple-control-test');
 
   static multiSelectURL = new Urlbuilder(PATH_E2E_CARD_V3, 'multi-select-test');
 
@@ -29,6 +33,12 @@ export default class DSCardV3CO extends PageObject {
 
   static globalAttributesURL = new Urlbuilder(PATH_E2E_CARD_V3, 'global-attributes-test');
 
+  static variantDisabledURL = new Urlbuilder(PATH_E2E_CARD_V3, 'variant-disabled-test');
+
+  static variantAccentURL = new Urlbuilder(PATH_E2E_CARD_V3, 'variant-accented-test');
+
+  static variantAccentedDisabledURL = new Urlbuilder(PATH_E2E_CARD_V3, 'variant-accented-disabled-test');
+
   // selectors
   static async getActionAreaByIndex(index = 0) {
     return $$('[data-testid="ds-cardv3-action-area"]')[index];
@@ -90,6 +100,18 @@ export default class DSCardV3CO extends PageObject {
     return $('[data-testid="ds-button"][aria-label="Expand Card Content"]');
   }
 
+  static async getAccordionButton() {
+    return $('button[aria-expanded]');
+  }
+
+  static async getGroupContainer() {
+    return $('[role="group"]');
+  }
+
+  static async getRadioGroupContainer() {
+    return $('[role="radiogroup"]');
+  }
+
   static async getCardHandlerByIndex(index) {
     return $$('button[aria-label="drag and drop gripper"]')[index];
   }
@@ -116,4 +138,74 @@ export default class DSCardV3CO extends PageObject {
   static snapshotPath(example = 'basic') {
     return PageObject.getSnapshotPathBuilder('card-v3', example);
   }
+
+  static async getButtonByIndex(index) {
+    return $$('[data-testid="ds-button"]')[index];
+  }
+
+  static async getCardCheckBoxByIndex(index) {
+    return $$('[data-testid="ds-checkbox"]')[index];
+  }
+
+  static async getByRole() {
+    return $('div[role="img"][aria-label="3 new notifications"]');
+  }
+
+  static async getElement(index) {
+    return $$('[data-testid="ds-typography-element"]')[index];
+  }
+
+  static async getRadioButtonByIndex(index) {
+    return $$('[data-testid="ds-radio"]')[index];
+  }
+
+  static async getDnDLiveRegion() {
+    return $('[id^="DndLiveRegion"]');
+  }
+
+  static async getDnDInstructions() {
+    return $('[id^="DndDescribedBy"]');
+  }
+
+  static async getDnDLists() {
+    return $$('[role="list"]');
+  }
+
+  static async getDnDListByIndex(index = 0) {
+    return $$('[role="list"]')[index];
+  }
+
+  static async getDnDListItems() {
+    return $$('[role="listitem"]');
+  }
+
+  static async getElementById(id) {
+    return $(`#${id}`);
+  }
+
+  static async getCardByDataId(id) {
+    return $(`[data-id="${id}"]`);
+  }
+
+  static async getCardDataIdsByListIndex(index = 0) {
+    const list = await DSCardV3CO.getDnDListByIndex(index);
+    const cards = await list.$$('[data-id]');
+    return cards.map((card) => card.getAttribute('data-id'));
+  }
+
+  static async expectCardOrderInList(index, expectedOrder) {
+    let actualOrder = [];
+    await browser.waitUntil(
+      async () => {
+        actualOrder = await DSCardV3CO.getCardDataIdsByListIndex(index);
+        return JSON.stringify(actualOrder) === JSON.stringify(expectedOrder);
+      },
+      {
+        timeout: 5000,
+        timeoutMsg: `Expected list ${index} to be ordered ${JSON.stringify(expectedOrder)} but was ${JSON.stringify(
+          actualOrder,
+        )}`,
+      },
+    );
+  }
 }

package/ds-card-v3/accordion/DSCardV3.accordion-aria-structure.func.spec.js

@@ -0,0 +1,41 @@
+import DSCardV3CO from '../DSCardV3CO';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  // Tests for the fix introduced in PUI-17887 (accordion heading/button/panel ARIA relationship)
+  describe('PUI-18597 - DSCardV3:: accordion ARIA structure - Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCardV3CO.accordionAriaURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: button and panel have correct ARIA relationship (controls, labelledby, region, h3 container)', async () => {
+      const button = await DSCardV3CO.getAccordionButton();
+      const panelId = await button.getAttribute('aria-controls');
+      expect(panelId).toBeTruthy();
+      const panel = await $(`#${panelId}`);
+      await expect(panel).toBeExisting();
+      const labelId = await button.getAttribute('aria-labelledby');
+      expect(labelId).toBeTruthy();
+      const title = await $(`#${labelId}`);
+      await expect(title).toBeExisting();
+      await expect(panel).toHaveAttribute('role', 'region');
+      const buttonId = await button.getAttribute('id');
+      await expect(panel).toHaveAttribute('aria-labelledby', buttonId);
+      const h3 = await $('h3');
+      const buttonInsideH3 = await h3.$('button');
+      await expect(buttonInsideH3).toBeExisting();
+    });
+
+    it('02: aria-expanded toggles from false to true after clicking the button', async () => {
+      const button = await DSCardV3CO.getAccordionButton();
+      await expect(button).toHaveAttribute('aria-expanded', 'false');
+      await button.click();
+      await expect(button).toHaveAttribute('aria-expanded', 'true');
+    });
+  });
+}

package/ds-card-v3/accordion/DSCardV3.accordion-aria.keyboard.func.spec.js

@@ -0,0 +1,49 @@
+import { Key } from 'webdriverio';
+import DSCardV3CO from '../DSCardV3CO';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-18823 - DSCardV3:: accordion ARIA keyboard operation - Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCardV3CO.accordionAriaURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should move focus to the accordion trigger as the first tab stop - [TAB]', async () => {
+      const trigger = await DSCardV3CO.getAccordionButton();
+      await trigger.waitForDisplayed();
+      await browser.keys(Key.Tab);
+
+      await expect(trigger).toBeFocused();
+      await expect(trigger).toHaveAttribute('aria-expanded', 'false');
+    });
+
+    it('02: should expand the panel and keep focus on the trigger - [ENTER]', async () => {
+      const trigger = await DSCardV3CO.getAccordionButton();
+      await browser.keys(Key.Enter);
+
+      await expect(trigger).toHaveAttribute('aria-expanded', 'true');
+      await expect(trigger).toBeFocused();
+    });
+
+    it('03: should collapse the panel and keep focus on the trigger - [SPACE]', async () => {
+      const trigger = await DSCardV3CO.getAccordionButton();
+      await browser.keys(Key.Space);
+
+      await expect(trigger).toHaveAttribute('aria-expanded', 'false');
+      await expect(trigger).toBeFocused();
+    });
+
+    it('04: should move focus from the trigger to the card actions button - [TAB]', async () => {
+      await browser.keys(Key.Tab);
+      const cardActions = await DSCardV3CO.getButtonByIndex(1);
+
+      await expect(cardActions).toBeFocused();
+      await expect(cardActions).toHaveAttribute('aria-label', 'Card actions');
+    });
+  });
+}

package/ds-card-v3/accordion/DSCardV3.accordion.axe-core.func.spec.js

@@ -0,0 +1,28 @@
+import DSCardV3CO from '../DSCardV3CO';
+import { axeCoreCheck } from '../../helpers';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'Chrome') ||
+  browser.capabilities.browserName === 'chrome'
+) {
+  describe('PUI-18713 - Accordion, basic -AxeCore', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCardV3CO.accordionURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should display the accordion closed and pass axecore test', async () => {
+      await (await DSCardV3CO.getAccordionButton()).waitForDisplayed();
+      const result = await axeCoreCheck();
+      await expect(result).toHaveLength(0);
+    });
+    it('02: should open the accordion and pass axecore test', async () => {
+      await (await DSCardV3CO.getAccordionButton()).click();
+      const getAccordionFirstElement = await DSCardV3CO.getElement(2);
+      await getAccordionFirstElement.waitForDisplayed();
+      const result = await axeCoreCheck();
+      await expect(result).toHaveLength(0);
+    });
+  });
+}

package/ds-card-v3/accordion/DSCardV3.accordion.visual.spec.js

@@ -7,15 +7,13 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       if (errorOnGo) throw errorOnGo;
     });
     it('01: should display accordion card-v3 closed', async () => {
-      await browser.eyesOpen();
-      const snapshot = await browser.eyesCheckSnapshot(DSCardV3CO.snapshotPath('card-v3-closed'));
+      const snapshot = await browser.percyCheckScreenshot();
       await expect(snapshot).toEqual(0);
     });
     it('02: should display accordion card-v3 expanded', async () => {
-      await browser.eyesOpen();
-      const expandContentButton = await DSCardV3CO.getExpandContentButton();
-      await expandContentButton.click();
-      const snapshot = await browser.eyesCheckSnapshot(DSCardV3CO.snapshotPath('card-v3-expanded'));
+      const accordionButton = await DSCardV3CO.getAccordionButton();
+      await accordionButton.click();
+      const snapshot = await browser.percyCheckScreenshot();
       await expect(snapshot).toEqual(0);
     });
   });

package/ds-card-v3/action/DSCardV3.action.axe-core.func.spec.js

@@ -0,0 +1,24 @@
+import DSCardV3CO from '../DSCardV3CO';
+import { axeCoreCheck } from '../../helpers';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-18803 - DSCardV3:: action button card accessibility - Axe-Core', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCardV3CO.actionURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should have no accessibility violations', async () => {
+      const card = await DSCardV3CO.getCardContainer();
+      await card.waitForDisplayed();
+
+      const result = await axeCoreCheck();
+      await expect(result).toHaveLength(0);
+    });
+  });
+}

package/ds-card-v3/action/DSCardV3.action.func.spec.js

@@ -0,0 +1,53 @@
+import { Key } from 'webdriverio';
+import DSCardV3CO from '../DSCardV3CO';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-18802 - DSCardV3:: action button structure and keyboard focus - Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCardV3CO.actionURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should render the card root, header, title, subtitle and a single action button', async () => {
+      const card = await DSCardV3CO.getCardContainer();
+      await card.waitForDisplayed();
+
+      const header = await DSCardV3CO.getCardHeader();
+      await expect(header).toBeDisplayed();
+
+      const title = await DSCardV3CO.getElement(0);
+      await expect(title).toBeDisplayed();
+      await expect(title).toHaveText('Card Title');
+      await expect(await title.getTagName()).toBe('h3');
+
+      const subtitle = await DSCardV3CO.getElement(1);
+      await expect(subtitle).toBeDisplayed();
+      await expect(subtitle).toHaveText('Card Subtitle');
+
+      const deleteAction = await DSCardV3CO.getButtonByIndex(0);
+      await expect(deleteAction).toBeDisplayed();
+      await expect(deleteAction).toHaveAttribute('aria-label', 'Delete Action');
+      await expect(deleteAction).toHaveAttribute('type', 'button');
+
+      const actionButtons = await $$('[data-testid="ds-button"]');
+      await expect(actionButtons).toBeElementsArrayOfSize(1);
+    });
+
+    it('02: should move focus to the action button - [TAB]', async () => {
+      await browser.keys(Key.Tab);
+      const deleteAction = await DSCardV3CO.getButtonByIndex(0);
+      await expect(deleteAction).toBeFocused();
+    });
+
+    it('03: should move focus away from the action button - [SHIFT+TAB]', async () => {
+      await browser.keys([Key.Shift, Key.Tab]);
+      const deleteAction = await DSCardV3CO.getButtonByIndex(0);
+      await expect(deleteAction).not.toBeFocused();
+    });
+  });
+}

package/ds-card-v3/action/DSCardV3.action.visual.spec.js

@@ -0,0 +1,28 @@
+import { Key } from 'webdriverio';
+import DSCardV3CO from '../DSCardV3CO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-18801 - DSCardV3:: action button card default and focus states - Visual', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCardV3CO.actionURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should display the card with a single action button in the header', async () => {
+      const card = await DSCardV3CO.getCardContainer();
+      await card.waitForDisplayed();
+
+      const snapshot = await browser.percyCheckScreenshot();
+      await expect(snapshot).toEqual(0);
+    });
+
+    it('02: should display the action button with its focus ring - [TAB]', async () => {
+      await browser.keys(Key.Tab);
+      const deleteAction = await DSCardV3CO.getButtonByIndex(0);
+      await expect(deleteAction).toBeFocused();
+
+      const snapshot = await browser.percyCheckScreenshot();
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/ds-card-v3/drag-n-drop/DSCardV3.DnD.axe-core.func.spec.js

@@ -0,0 +1,42 @@
+import { Key } from 'webdriverio';
+import DSCardV3CO from '../DSCardV3CO';
+import { axeCoreCheck } from '../../helpers';
+
+// axe-core coverage for the PUI-17889 accessibility fix on the CardV3 Drag and Drop example.
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-18732 - DSCardV3:: Drag and Drop accessibility - axe-core', () => {
+    beforeEach('loading page', async () => {
+      const errorOnGo = await DSCardV3CO.dragAndDropURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should pass axe-core in the idle (resting) state', async () => {
+      const result = await axeCoreCheck();
+      await expect(result).toHaveLength(0);
+    });
+
+    it('02: should pass axe-core while an item is being dragged and cancelled - [TAB][ENTER][ESC]', async () => {
+      await browser.keys(Key.Tab);
+      const handle = await DSCardV3CO.getCardHandlerByIndex(0);
+      await expect(handle).toBeFocused();
+      await browser.keys(Key.Return);
+      await browser.keys(Key.Escape);
+      const result = await axeCoreCheck();
+      await expect(result).toHaveLength(0);
+    });
+
+    it('03: should pass axe-core after an item has been dropped - [TAB][ENTER][ARROWDOWN][ENTER]', async () => {
+      await browser.keys(Key.Tab);
+      await browser.keys(Key.Return);
+      await browser.keys(Key.ArrowDown);
+      await browser.keys(Key.Return);
+      const result = await axeCoreCheck();
+      await expect(result).toHaveLength(0);
+    });
+  });
+}

package/ds-card-v3/drag-n-drop/DSCardV3.DnD.func.spec.js

@@ -0,0 +1,129 @@
+/* eslint-disable max-lines */
+import { Key } from 'webdriverio';
+import DSCardV3CO from '../DSCardV3CO';
+
+// Functional coverage - no interaction for the PUI-17889 accessibility fix on the CardV3 Drag and Drop example.
+if (
+  !browser.capabilities['ice:options'].isPhone &&
+  !browser.capabilities['ice:options'].isTablet &&
+  (browser.capabilities.browserName === 'Chrome' || browser.capabilities.browserName === 'chrome')
+) {
+  describe('PUI-18685 - DSCardV3:: Drag and Drop accessibility - Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCardV3CO.dragAndDropURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: sortable containers are exposed as lists with an accessible name', async () => {
+      const lists = await DSCardV3CO.getDnDLists();
+      await expect(lists).toHaveLength(2);
+      const [backlog, inProgress] = lists;
+      await expect(backlog).toHaveAttribute('aria-labelledby', 'dnd-heading-container1');
+      await expect(inProgress).toHaveAttribute('aria-labelledby', 'dnd-heading-container2');
+    });
+
+    it('02: list accessible-name targets exist and expose readable headings', async () => {
+      const backlogHeading = await DSCardV3CO.getElementById('dnd-heading-container1');
+      const inProgressHeading = await DSCardV3CO.getElementById('dnd-heading-container2');
+      await expect(backlogHeading).toBeExisting();
+      await expect(inProgressHeading).toBeExisting();
+      await expect(backlogHeading).toHaveText('Backlog');
+      await expect(inProgressHeading).toHaveText('In Progress');
+    });
+
+    it('03: every card is programmatically exposed as a list item', async () => {
+      const listItems = await DSCardV3CO.getDnDListItems();
+      await expect(listItems).toHaveLength(12);
+    });
+
+    it('04: drag handle exposes aria-roledescription="sortable"', async () => {
+      const handle = await DSCardV3CO.getCardHandlerByIndex(0);
+      await expect(handle).toHaveAttribute('aria-roledescription', 'sortable');
+    });
+
+    it('05: drag handle references existing, non-empty drag instructions', async () => {
+      const handle = await DSCardV3CO.getCardHandlerByIndex(0);
+      const describedBy = await handle.getAttribute('aria-describedby');
+      expect(describedBy).toContain('DndDescribedBy');
+
+      const instructions = await DSCardV3CO.getDnDInstructions();
+      await expect(instructions).toBeExisting();
+      const instructionText = await instructions.getProperty('textContent');
+      expect(instructionText).toBeTruthy();
+    });
+
+    it('06: a live region is present to announce drag operations', async () => {
+      const liveRegion = await DSCardV3CO.getDnDLiveRegion();
+      await liveRegion.waitForExist();
+      await expect(liveRegion).toHaveAttribute('role', 'status');
+      await expect(liveRegion).toHaveAttribute('aria-live', 'assertive');
+      await expect(liveRegion).toHaveAttribute('aria-atomic', 'true');
+    });
+  });
+
+  // Functional coverage for the PUI-17889 accessibility fix on the CardV3 Drag and Drop example.
+  describe('PUI-18730 - DSCardV3:: Drag and Drop keyboard announcements - Func', () => {
+    beforeEach('loading page', async () => {
+      const errorOnGo = await DSCardV3CO.dragAndDropURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: picking up an item sets aria-pressed - [TAB][ENTER]', async () => {
+      await browser.keys(Key.Tab);
+      const handle = await DSCardV3CO.getCardHandlerByIndex(0);
+      await expect(handle).toBeFocused();
+      await browser.keys(Key.Return);
+      await expect(handle).toHaveAttribute('aria-pressed', 'true');
+    });
+
+    it('02: moving an item announces its new position - [TAB][ENTER][ARROWDOWN]', async () => {
+      await browser.keys(Key.Tab);
+      const handle = await DSCardV3CO.getCardHandlerByIndex(0);
+      await expect(handle).toBeFocused();
+      await browser.keys(Key.Space);
+      await expect(handle).toHaveAttribute('aria-pressed', 'true');
+      await browser.keys(Key.ArrowDown);
+      const liveRegion = await DSCardV3CO.getDnDLiveRegion();
+      await browser.waitUntil(
+        async () => (await liveRegion.getProperty('textContent')).includes('was moved to position'),
+        { timeoutMsg: 'Expected the live region to announce the new position' },
+      );
+      const announcement = await liveRegion.getProperty('textContent');
+      expect(announcement).toContain('was moved to position');
+    });
+
+    it('03: dropping an item announces the resulting position - [TAB][ENTER][ARROWDOWN][ENTER]', async () => {
+      await browser.keys(Key.Tab);
+      const handle = await DSCardV3CO.getCardHandlerByIndex(0);
+      await expect(handle).toBeFocused();
+      await browser.keys(Key.Space);
+      await expect(handle).toHaveAttribute('aria-pressed', 'true');
+      await browser.keys(Key.ArrowDown);
+      const liveRegion = await DSCardV3CO.getDnDLiveRegion();
+      await browser.keys(Key.Space);
+      await browser.waitUntil(
+        async () => (await liveRegion.getProperty('textContent')).includes('was dropped at position'),
+        { timeoutMsg: 'Expected the live region to announce the drop' },
+      );
+      const announcement = await liveRegion.getProperty('textContent');
+      expect(announcement).toContain('was dropped at position');
+    });
+
+    it('04: cancelling a drag is announced and clears aria-pressed - [TAB][ENTER][ESCAPE]', async () => {
+      await browser.keys(Key.Tab);
+      const handle = await DSCardV3CO.getCardHandlerByIndex(0);
+      await expect(handle).toBeFocused();
+      await browser.keys(Key.Return);
+      await expect(handle).toHaveAttribute('aria-pressed', 'true');
+      await browser.keys(Key.Escape);
+      const liveRegion = await DSCardV3CO.getDnDLiveRegion();
+      await browser.waitUntil(
+        async () => (await liveRegion.getProperty('textContent')).includes('Dragging was cancelled'),
+        { timeoutMsg: 'Expected the live region to announce the cancellation' },
+      );
+      const announcement = await liveRegion.getProperty('textContent');
+      expect(announcement).toContain('Dragging was cancelled');
+      await expect(handle).not.toHaveAttribute('aria-pressed', 'true');
+    });
+  });
+}