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

package/ds-autocomplete/DSAutocomplete.visual.spec.js

@@ -18,4 +18,38 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       await expect(snapshot).toEqual(0);
     });
   });
+  describe('PUI-17180 - Autocomplete:: Floating After Filtering -Visual', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSAutocompleteCO.floatingAfterFiltering.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should display menu correctly - after filtering', async () => {
+      await browser.keys(Key.Tab);
+      await type('44444-');
+      const menulist = await DSAutocompleteCO.getAutocompleteMenuList();
+      await menulist.waitForDisplayed({ timeout: 2000 });
+      const snapshot = await browser.percyCheckScreenshot(
+        DSAutocompleteCO.snapshotPath('autocomplete-floating-after-filtering'),
+      );
+      await expect(snapshot).toEqual(0);
+    });
+    it('02: should display menu correctly - after re filtering', async () => {
+      await type('6');
+      const menulist = await DSAutocompleteCO.getAutocompleteMenuList();
+      await menulist.waitForDisplayed({ timeout: 2000 });
+      const snapshot = await browser.percyCheckScreenshot(
+        DSAutocompleteCO.snapshotPath('autocomplete-floating-after-re-filtering'),
+      );
+      await expect(snapshot).toEqual(0);
+    });
+    it('03: should display menu correctly - after backspace', async () => {
+      await browser.keys(Key.Backspace);
+      const menulist = await DSAutocompleteCO.getAutocompleteMenuList();
+      await menulist.waitForDisplayed({ timeout: 2000 });
+      const snapshot = await browser.percyCheckScreenshot(
+        DSAutocompleteCO.snapshotPath('autocomplete-floating-after-backspace'),
+      );
+      await expect(snapshot).toEqual(0);
+    });
+  });
 }

package/ds-autocomplete/DSAutocompleteCO.js

@@ -12,6 +12,16 @@ export default class DSAutocompleteCO extends PageObject {
 
   static sectionTitles = new Urlbuilder(PATH_E2E_AUTOCOMPLETE, 'with-section-titles-test');
 
+  static floatingAfterFiltering = new Urlbuilder(PATH_E2E_AUTOCOMPLETE, 'floating-after-filtering');
+
+  static loadingTest = new Urlbuilder(PATH_E2E_AUTOCOMPLETE, 'loading-test');
+
+  static skeletonTest = new Urlbuilder(PATH_E2E_AUTOCOMPLETE, 'skeleton-test');
+
+  static loadingInputProps = new Urlbuilder(PATH_E2E_AUTOCOMPLETE, 'loading-input-props-test');
+
+  static skeletonInputProps = new Urlbuilder(PATH_E2E_AUTOCOMPLETE, 'skeleton-input-props-test');
+
   // Snapshots
   static snapshotPath(example = 'basic') {
     return PageObject.getSnapshotPathBuilder('Autocomplete', example);
@@ -35,8 +45,10 @@ export default class DSAutocompleteCO extends PageObject {
     return $$('[data-dimsum-slot="dsAutocompleteContainer"]')[index];
   }
 
+  // the option is a nested slot: the rendered element owns dsMenuitemMenuItemWrapper and carries the
+  // autocomplete slot on data-dimsum-parent-slot, which is where the custom attributes land
   static async getOptionSlot(index = 0) {
-    return $$('[data-dimsum-slot="dsAutocompleteOption"]')[index];
+    return $$('[data-dimsum-parent-slot="dsAutocompleteOption"]')[index];
   }
 
   static async getInputSlot(index = 0) {
@@ -46,4 +58,27 @@ export default class DSAutocompleteCO extends PageObject {
   static async getMenulistSlot(index = 0) {
     return $$('[data-dimsum-slot="dsAutocompleteMenuList"]')[index];
   }
+
+  // loading / skeleton (busy listbox) states
+  static async getLoadingListbox() {
+    return $('[data-testid="autocomplete-loading"]');
+  }
+
+  static async getLoadingIndicator() {
+    return $('[data-testid="ds-autocomplete-loading-indicator"]');
+  }
+
+  static async getSkeletonListbox() {
+    return $('[data-testid="autocomplete-skeleton"]');
+  }
+
+  static async getSkeletonMenuItems() {
+    return $$('[data-testid="ds-autocomplete-skeleton-menu-item"]');
+  }
+
+  // the input Autocomplete renders itself (onValueChange / inputProps API); the deprecated
+  // children API renders a consumer-owned DSInputText instead, which carries no autocomplete testid
+  static async getAutocompleteInput() {
+    return $('[data-testid="ds-autocomplete-input"]');
+  }
 }

package/ds-autocomplete/aria-busy-loading/DSAutocomplete.aria-busy-loading.axe-core.func.spec.js

@@ -0,0 +1,50 @@
+import { Key } from 'webdriverio';
+import DSAutocompleteCO from '../DSAutocompleteCO';
+import { axeCoreCheck, type } from '../../helpers';
+
+// Coverage for the loading state added in PUI-17137 ([Autocomplete] Add Support for Loading State).
+// The busy listbox surfaces are the riskiest part for axe: role="listbox" normally requires option
+// children (satisfied via aria-busy) and the spinner's role="status" is a forbidden listbox child
+// (removed from the accessibility tree via aria-hidden). This spec guards both.
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-18864 - DSAutocomplete:: busy listbox while isLoading -Axe-Core', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSAutocompleteCO.loadingTest.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should have no accessibility violations while the loading spinner is shown', async () => {
+      await browser.keys(Key.Tab);
+      await type('4');
+
+      const loading = await DSAutocompleteCO.getLoadingListbox();
+      await loading.waitForDisplayed();
+
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+  });
+
+  describe('PUI-18865 - DSAutocomplete:: busy listbox while isSkeleton -Axe-Core', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSAutocompleteCO.skeletonTest.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should have no accessibility violations while the skeleton menu is shown', async () => {
+      await browser.keys(Key.Tab);
+      await type('4');
+
+      const skeleton = await DSAutocompleteCO.getSkeletonListbox();
+      await skeleton.waitForDisplayed();
+
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+  });
+}

package/ds-autocomplete/aria-busy-loading/DSAutocomplete.aria-busy-loading.func.spec.js

@@ -0,0 +1,122 @@
+import { Key } from 'webdriverio';
+import DSAutocompleteCO from '../DSAutocompleteCO';
+import { type } from '../../helpers';
+
+// Coverage for the loading state added in PUI-17137 ([Autocomplete] Add Support for Loading State).
+// While options are being fetched the options array is still empty, so LoadingContainer /
+// SkeletonContainer keep the popover open on their own and carry the canonical listbox id +
+// role="listbox" + aria-busy + aria-label. Only one of skeleton / loading / options list is ever
+// mounted at a time, so the listbox id is never duplicated in the DOM.
+//
+// The last two describes exercise the `onValueChange` + `inputProps` API, which is the only path
+// where Autocomplete renders its own input and therefore wires role="combobox" + aria-expanded +
+// aria-controls onto it. The deprecated `children` API (first two describes) renders a
+// consumer-owned input that receives none of those attributes.
+//
+// Pure DOM-attribute assertions -> Chrome-only guard.
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-18860 - DSAutocomplete:: busy listbox while isLoading -Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSAutocompleteCO.loadingTest.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should render a busy loading listbox and hide the options list', async () => {
+      await browser.keys(Key.Tab);
+      await type('4');
+
+      const loading = await DSAutocompleteCO.getLoadingListbox();
+      await loading.waitForDisplayed();
+
+      await expect(loading).toHaveAttribute('role', 'listbox');
+      await expect(loading).toHaveAttribute('aria-busy', 'true');
+      await expect(loading).toHaveAttribute('aria-label', 'Loading options please wait');
+
+      // the spinner exposes role="status", a forbidden child of role="listbox", so it must be
+      // removed from the accessibility tree while staying visible
+      const indicator = await DSAutocompleteCO.getLoadingIndicator();
+      await expect(indicator).toBeDisplayedInViewport();
+      await expect(indicator).toHaveAttribute('aria-hidden', 'true');
+
+      // only one of loading / skeleton / options list is mounted at a time
+      const menulist = await DSAutocompleteCO.getAutocompleteMenuList();
+      await expect(menulist).not.toBeExisting();
+    });
+  });
+
+  describe('PUI-18861 - DSAutocomplete:: busy listbox while isSkeleton -Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSAutocompleteCO.skeletonTest.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should render a busy skeleton listbox with five presentational items', async () => {
+      await browser.keys(Key.Tab);
+      await type('4');
+
+      const skeleton = await DSAutocompleteCO.getSkeletonListbox();
+      await skeleton.waitForDisplayed();
+
+      await expect(skeleton).toHaveAttribute('role', 'listbox');
+      await expect(skeleton).toHaveAttribute('aria-busy', 'true');
+      await expect(skeleton).toHaveAttribute('aria-label', 'Loading options please wait');
+
+      const skeletonItems = await DSAutocompleteCO.getSkeletonMenuItems();
+      await expect(skeletonItems).toHaveLength(5);
+      // the count above is what pins SKELETON_AMOUNT; every item is rendered from the same JSX
+      // literal, so one sample is enough to prove role="presentation" reaches the DOM and keeps
+      // the busy listbox free of fake options
+      await expect(skeletonItems[2]).toHaveAttribute('role', 'presentation');
+
+      const menulist = await DSAutocompleteCO.getAutocompleteMenuList();
+      await expect(menulist).not.toBeExisting();
+    });
+  });
+
+  describe('PUI-18862 - DSAutocomplete:: input aria-controls linkage while isLoading -Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSAutocompleteCO.loadingInputProps.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should point the input aria-controls at the busy loading listbox', async () => {
+      await browser.keys(Key.Tab);
+      await type('4');
+
+      const loading = await DSAutocompleteCO.getLoadingListbox();
+      await loading.waitForDisplayed();
+      const loadingId = await loading.getAttribute('id');
+
+      const input = await DSAutocompleteCO.getAutocompleteInput();
+      await expect(input).toHaveAttribute('role', 'combobox');
+      await expect(input).toHaveAttribute('aria-expanded', 'true');
+      await expect(input).toHaveAttribute('aria-controls', loadingId);
+    });
+  });
+
+  describe('PUI-18863 - DSAutocomplete:: input aria-controls linkage while isSkeleton -Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSAutocompleteCO.skeletonInputProps.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should point the input aria-controls at the busy skeleton listbox', async () => {
+      await browser.keys(Key.Tab);
+      await type('4');
+
+      const skeleton = await DSAutocompleteCO.getSkeletonListbox();
+      await skeleton.waitForDisplayed();
+      const skeletonId = await skeleton.getAttribute('id');
+
+      const input = await DSAutocompleteCO.getAutocompleteInput();
+      await expect(input).toHaveAttribute('role', 'combobox');
+      await expect(input).toHaveAttribute('aria-expanded', 'true');
+      await expect(input).toHaveAttribute('aria-controls', skeletonId);
+    });
+  });
+}

package/ds-autocomplete/aria-busy-loading/DSAutocomplete.aria-busy-loading.visual.spec.js

@@ -0,0 +1,48 @@
+import { Key } from 'webdriverio';
+import DSAutocompleteCO from '../DSAutocompleteCO';
+import { type } from '../../helpers';
+
+// Coverage for the loading state added in PUI-17137 ([Autocomplete] Add Support for Loading State).
+// The acceptance criteria is the loading example from the InputText spec, so these snapshots pin the
+// two menu appearances: the centered indeterminate spinner and the five skeleton menu items.
+// Percy freezes CSS animations, so both the spinner rotation and the skeleton shimmer are captured
+// deterministically.
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-18866 - DSAutocomplete:: loading spinner menu -Visual', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSAutocompleteCO.loadingTest.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should display the loading spinner centered in the menu', async () => {
+      await browser.keys(Key.Tab);
+      await type('4');
+
+      const loading = await DSAutocompleteCO.getLoadingListbox();
+      await loading.waitForDisplayed();
+
+      const snapshot = await browser.percyCheckScreenshot(
+        DSAutocompleteCO.snapshotPath('autocomplete-loading-spinner-menu'),
+      );
+      await expect(snapshot).toEqual(0);
+    });
+  });
+
+  describe('PUI-18867 - DSAutocomplete:: skeleton menu items -Visual', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSAutocompleteCO.skeletonTest.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should display five skeleton menu items in the menu', async () => {
+      await browser.keys(Key.Tab);
+      await type('4');
+
+      const skeleton = await DSAutocompleteCO.getSkeletonListbox();
+      await skeleton.waitForDisplayed();
+
+      const snapshot = await browser.percyCheckScreenshot(DSAutocompleteCO.snapshotPath('autocomplete-skeleton-menu'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/ds-autocomplete/slots/DSAutocomplete.slots.func.spec.js

@@ -1,7 +1,12 @@
 import { Key } from 'webdriverio';
 import DSAutocompleteCO from '../DSAutocompleteCO';
 
-if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
   describe('PUI-17529 - Autocomplete:: Slots -Func', () => {
     before('loading page', async () => {
       const errorOnGo = await DSAutocompleteCO.slots.go();

package/ds-button-v3/DSButtonV3.aria-disabled-attribute.func.spec.js

@@ -0,0 +1,33 @@
+import DSButtonV3CO from './DSButtonV3CO';
+
+// Tests for the fix introduced in PUI-17909:
+//   aria-disabled is no longer emitted as "false" on interactive buttons. A default (enabled) button
+//   carries no aria-disabled at all, and a native `disabled` button conveys its state via the native
+//   `disabled` attribute, so aria-disabled is intentionally absent there too (it was dropped from the
+//   emission condition, which is now applyAriaDisabled || readOnly).
+// Both states already exist in the ShowcaseTest story (index 0 = enabled, index 3 = disabled).
+// Pure DOM-attribute assertions produce identical results in every browser, so this runs Chrome-only.
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-18796 - DSButtonV3:: aria-disabled absent on enabled and disabled buttons - Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSButtonV3CO.showcaseURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should not emit aria-disabled on enabled or native-disabled buttons', async () => {
+      // Enabled (default): aria-disabled must be entirely absent — the core PUI-17909 fix.
+      const enabled = await DSButtonV3CO.getButtonByIndex(0);
+      await expect(enabled).not.toHaveAttribute('aria-disabled');
+
+      // Native disabled: relies on the native `disabled` attribute, aria-disabled stays absent.
+      const disabled = await DSButtonV3CO.getButtonByIndex(3);
+      await expect(disabled).toHaveAttribute('disabled');
+      await expect(disabled).not.toHaveAttribute('aria-disabled');
+    });
+  });
+}

package/ds-button-v3/DSButtonV3CO.js

@@ -17,6 +17,8 @@ export default class DSButtonV3CO extends PageObject {
 
   static submitBtn = new Urlbuilder(PATH_E2E_BUTTON_V3, 'pui-16729-buttons-can-submit-forms');
 
+  static themeFontURL = new Urlbuilder(PATH_E2E_BUTTON_V3, 'theme-font-family-test');
+
   // selectors
   static async getButtonByIndex(index) {
     return $$('[data-testid="ds-button"]')[index];
@@ -38,6 +40,14 @@ export default class DSButtonV3CO extends PageObject {
     return $(`button*=${label}`);
   }
 
+  static async getThemedButton() {
+    return $('[data-testid="theme-font-sentinel"] [data-testid="ds-button"]');
+  }
+
+  static async getFallbackButton() {
+    return $('[data-testid="theme-font-fallback"] [data-testid="ds-button"]');
+  }
+
   // Snapshot
   static snapshotPath(example = 'basic') {
     return PageObject.getSnapshotPathBuilder('ButtonV3', example);

package/ds-button-v3/theme-font/DSButtonV3.theme-font.func.spec.js

@@ -0,0 +1,30 @@
+import DSButtonV3CO from '../DSButtonV3CO';
+
+// Tests the theme-driven font-family support shipped under PUI-18210
+// (V3 buttons reuse the b1 typography base → typographyFontFamily → theme.fonts.default,
+// falling back to proxima-nova). Theme-agnostic: uses a sentinel font, never the
+// dsConsumer POC theme values, so it survives any future theme change.
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-18708 - DSButtonV3:: theme font-family wiring - Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSButtonV3CO.themeFontURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should read font-family from theme with proxima-nova fallback', async () => {
+      const themed = await DSButtonV3CO.getThemedButton();
+      await themed.waitForDisplayed();
+      const themedFont = (await themed.getCSSProperty('font-family')).value.toLowerCase();
+      await expect(themedFont).toContain('sentinelfont');
+
+      const fallback = await DSButtonV3CO.getFallbackButton();
+      const fallbackFont = (await fallback.getCSSProperty('font-family')).value.toLowerCase();
+      await expect(fallbackFont).toContain('proxima-nova');
+    });
+  });
+}

package/ds-card/DSCard.cardv2_v1.func.spec.js

@@ -0,0 +1,54 @@
+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-18706 - Card V2, no native title attribute on container', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCardCO.V2URL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: the card container does not render a native title attribute', async () => {
+      const card = await DSCardCO.getCard();
+      const titleAttr = await card.getAttribute('title');
+      await expect(titleAttr).toBeNull();
+    });
+    it('02: the title still renders as visible header text', async () => {
+      const header = await DSCardCO.getCardHeader();
+      await expect(header).toBeDisplayed();
+      await expect(header).toHaveText(expect.stringContaining('Card Title'));
+    });
+    it('03: hovering inside the card never exposes the section name as a native tooltip', async () => {
+      const card = await DSCardCO.getCard();
+      await card.moveTo();
+      const sectionTitleTooltip = await card.$('[title="Card Title"]');
+      await expect(sectionTitleTooltip).not.toBeExisting();
+    });
+  });
+
+  describe('PUI-18724 - Card V1, no native title attribute on header', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCardCO.button.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: the card header does not render a native title attribute', async () => {
+      const header = await DSCardCO.getV1CardHeader();
+      const titleAttr = await header.getAttribute('title');
+      await expect(titleAttr).toBeNull();
+    });
+    it('02: the title still renders as visible header text', async () => {
+      const header = await DSCardCO.getV1CardHeader();
+      await expect(header).toBeDisplayed();
+      await expect(header).toHaveText(expect.stringContaining('Loren ipsum dolor'));
+    });
+    it('03: hovering inside the card never exposes the section name as a native tooltip', async () => {
+      const header = await DSCardCO.getV1CardHeader();
+      await header.moveTo();
+      const sectionTitleTooltip = await header.$('[title="Loren ipsum dolor"]');
+      await expect(sectionTitleTooltip).not.toBeExisting();
+    });
+  });
+}

package/ds-card/DSCard.cardv2_v1.visual.spec.js

@@ -0,0 +1,29 @@
+import DSCardCO from './DSCardCO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-18728 - DSCard:: V2 header title renders unchanged - Visual', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCardCO.V2URL.go();
+      if (errorOnGo) throw errorOnGo;
+      const card = await DSCardCO.getCard();
+      await card.waitForDisplayed({ timeout: 5000 });
+    });
+    it('should render the V2 card header title unchanged', async () => {
+      const snapshot = await browser.checkSnapshot(DSCardCO.snapshotPath('cardv2-header-title'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+
+  describe('PUI-18729 - DSCard:: V1 header title renders unchanged - Visual', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCardCO.button.go();
+      if (errorOnGo) throw errorOnGo;
+      const header = await DSCardCO.getV1CardHeader();
+      await header.waitForDisplayed({ timeout: 5000 });
+    });
+    it('should render the V1 card header title unchanged', async () => {
+      const snapshot = await browser.checkSnapshot(DSCardCO.snapshotPath('cardv1-header-title'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/ds-card/DSCardCO.js

@@ -24,6 +24,8 @@ export default class DSCardCO extends PageObject {
 
   static slotsTest = new Urlbuilder(PATH_E2E_CARD, 'slots-test');
 
+  static detailSlotsTest = new Urlbuilder(PATH_E2E_CARD, 'detail-slots-test');
+
   static ucDetailCardLongTitleURL = new Urlbuilder(PATH_E2E_CARD, 'detail-card-long-title');
 
   static detailExpandableURL = new Urlbuilder(PATH_E2E_CARD, 'detail-expandable-test');
@@ -48,6 +50,10 @@ export default class DSCardCO extends PageObject {
     return $('[data-testid="em-ds-card-header"]');
   }
 
+  static async getV1CardHeader() {
+    return $('[data-testid="ds-card-header"]');
+  }
+
   static async getCardDetailContainer() {
     return $('[data-testid="card-detail-container"]');
   }
@@ -128,4 +134,48 @@ export default class DSCardCO extends PageObject {
   static async getCardNavigationTypeSlotByIndex(index = 0) {
     return $$('[data-dimsum-slot="dsCardnavigationType"]')[index];
   }
+
+  // DetailCard (ds-card-v1-detail) slots — PUI-15889.
+  // SELECTABLE (checkbox) and EXPAND_CONTENT_BUTTON (chevron) are nested Dimsum
+  // components, so the consumer slot name surfaces as data-dimsum-parent-slot on
+  // the inner root (input / button); the rest use data-dimsum-slot directly.
+  static async getDetailContainerSlot() {
+    return $('[data-dimsum-slot="dsCardv1detailContainer"]');
+  }
+
+  static async getDetailTitleSlot() {
+    return $('[data-dimsum-slot="dsCardv1detailTitle"]');
+  }
+
+  static async getDetailDescriptionSlot() {
+    return $('[data-dimsum-slot="dsCardv1detailDescription"]');
+  }
+
+  static async getDetailSelectableSlot() {
+    return $('[data-dimsum-parent-slot="dsCardv1detailSelectable"]');
+  }
+
+  static async getDetailExpandContentButtonSlot() {
+    return $('[data-dimsum-parent-slot="dsCardv1detailExpandContentButton"]');
+  }
+
+  static async getDetailExpandContentSlot() {
+    return $('[data-dimsum-slot="dsCardv1detailExpandContent"]');
+  }
+
+  static async getDetailSeparatorSlot() {
+    return $('[data-dimsum-slot="dsCardv1detailSeparator"]');
+  }
+
+  static async getDetailRightAddonSlot() {
+    return $('[data-dimsum-slot="dsCardv1detailRightAddon"]');
+  }
+
+  static async getDetailRightDescriptionSlot() {
+    return $('[data-dimsum-slot="dsCardv1detailRightDescription"]');
+  }
+
+  static async getDetailRightValueSlot() {
+    return $('[data-dimsum-slot="dsCardv1detailRightValue"]');
+  }
 }

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

@@ -0,0 +1,29 @@
+// Tests for the fix introduced in PUI-15889 (DetailCard selectable/expandable slots).
+import DSCardCO from '../DSCardCO';
+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-18691 - Card:: DetailCard slot attribute injection - Axe-Core', () => {
+    before(async () => {
+      const errorOnGo = await DSCardCO.detailSlotsTest.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should have no accessibility violations with slot customizations', async () => {
+      await (await DSCardCO.getDetailContainerSlot()).waitForDisplayed();
+      // The slots story injects synthetic aria-labels onto every slot to prove
+      // attribute pass-through — including decorative elements (the description
+      // <p>, the right-side Grid <div>s) whose role prohibits aria-label. That is
+      // a test probe, not real consumer usage, so aria-prohibited-attr is disabled
+      // here — the same rationale axeCoreCheck already uses to disable valid-lang
+      // for the synthetic lang codes these slots tests inject.
+      const result = await axeCoreCheck({ extraDisabledRules: ['aria-prohibited-attr'] });
+      expect(result.length).toBe(0);
+    });
+  });
+}