dimsum-e2e-tests 3.80.0-next.14 → 3.80.0-next.19

package/CHANGELOG.md

@@ -3,6 +3,26 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [3.80.0-next.19](/github.com/intcx/PLATFORM-UI/compare/v3.80.0-next.18...v3.80.0-next.19) (2026-09-28)
+
+**Note:** Version bump only for package dimsum-e2e-tests
+
+## [3.80.0-next.18](/github.com/intcx/PLATFORM-UI/compare/v3.80.0-next.17...v3.80.0-next.18) (2026-09-25)
+
+**Note:** Version bump only for package dimsum-e2e-tests
+
+## [3.80.0-next.17](/github.com/intcx/PLATFORM-UI/compare/v3.80.0-next.16...v3.80.0-next.17) (2026-09-25)
+
+**Note:** Version bump only for package dimsum-e2e-tests
+
+## 3.80.0-next.16 (2026-09-25)
+
+**Note:** Version bump only for package dimsum-e2e-tests
+
+## 3.80.0-next.15 (2026-09-25)
+
+**Note:** Version bump only for package dimsum-e2e-tests
+
 ## 3.80.0-next.14 (2026-09-24)
 
 ### Features

package/ds-progress-indicator/DSProgressIndicator.axe-core.func.spec.js

@@ -1,4 +1,3 @@
-/* eslint-disable wdio/no-pause */
 import DSProgressIndicatorCO from './DSProgressIndicatorCO';
 import { axeCoreCheck } from '../helpers';
 
@@ -8,24 +7,28 @@ if (
     browser.capabilities.browserName === 'chrome') ||
   browser.capabilities.browserName === 'Chrome'
 ) {
-  describe('PUI-17521: Progress Indicator:: Basic - Axe Core', () => {
+  describe('PUI-17521 - DSProgressIndicator:: Basic - Axe-Core', () => {
     before('loading page', async () => {
       const errorOnGo = await DSProgressIndicatorCO.basicURL.go();
       if (errorOnGo) throw errorOnGo;
     });
     it('01: should display basic progress indicator and pass axe-core', async () => {
-      await (await DSProgressIndicatorCO.getUploadLabel()).waitForDisplayed();
-      await browser.pause(500);
+      await (await DSProgressIndicatorCO.getTitle()).waitForDisplayed();
+
       const result = await axeCoreCheck();
       expect(result.length).toBe(0);
     });
   });
-  describe('PUI-17524: Progress Indicator:: Others Test - Axe Core', () => {
+
+  describe('PUI-17524 - DSProgressIndicator:: Others Test - Axe-Core', () => {
     before('loading page', async () => {
       const errorOnGo = await DSProgressIndicatorCO.othersURL.go();
       if (errorOnGo) throw errorOnGo;
     });
     it('01: should display progress indicator and pass axe-core', async () => {
+      // Replaces a blind browser.pause(500): the story animates, so wait on the real end state.
+      await DSProgressIndicatorCO.waitForAnimatedCountersToSettle();
+
       const result = await axeCoreCheck();
       expect(result.length).toBe(0);
     });

package/ds-progress-indicator/DSProgressIndicator.func.spec.js

@@ -6,14 +6,28 @@ if (
     browser.capabilities.browserName === 'chrome') ||
   browser.capabilities.browserName === 'Chrome'
 ) {
-  describe('PUI-17522 - Progress Indicator:: Basic - Func', () => {
+  describe('PUI-17522 - DSProgressIndicator:: Basic - Func', () => {
     before('loading page', async () => {
       const errorOnGo = await DSProgressIndicatorCO.basicURL.go();
       if (errorOnGo) throw errorOnGo;
     });
-    it('01: should show basic progress indicator', async () => {
-      const progressIndicator = await DSProgressIndicatorCO.getUploadLabel();
-      await expect(progressIndicator).toBeDisplayed();
+
+    // The naming, aria-valuetext and invalid-range contracts live in the aria-contract spec; this
+    // one stays on the Basic story's own value contract.
+    it('01: should show basic progress indicator with a valid progressbar value range', async () => {
+      const title = await DSProgressIndicatorCO.getTitle();
+      await expect(title).toBeDisplayed();
+      await expect(title).toHaveText('upload');
+
+      const root = await DSProgressIndicatorCO.getRoot();
+      await expect(root).toHaveAttribute('aria-disabled', 'false');
+
+      const progress = await DSProgressIndicatorCO.getProgress();
+      await expect(progress).toHaveAttribute('role', 'progressbar');
+      await expect(progress).toHaveAttribute('aria-valuenow', '50');
+      await expect(progress).toHaveAttribute('aria-valuemin', '0');
+      await expect(progress).toHaveAttribute('aria-valuemax', '100');
+      await expect(await progress.getAttribute('style')).toContain('width: 50%');
     });
   });
 }

package/ds-progress-indicator/DSProgressIndicator.visual.spec.js

@@ -1,24 +1,32 @@
 import DSProgressIndicatorCO from './DSProgressIndicatorCO';
 
-if (!browser.capabilities['ice:options'].isPhone) {
-  describe('PUI-17520 - Progress Indicator:: Basic - Visual', () => {
+// Migrated off the pre-Percy browser.checkSnapshot API as part of the PUI-18856 compliance work,
+// which rewrote the class system these baselines were taken against.
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-17520 - DSProgressIndicator:: Basic - Visual', () => {
     before('loading page', async () => {
       const errorOnGo = await DSProgressIndicatorCO.basicURL.go();
       if (errorOnGo) throw errorOnGo;
     });
     it('01: should display basic progress indicator', async () => {
-      await (await DSProgressIndicatorCO.getUploadLabel()).waitForDisplayed();
-      const snapshot = await browser.checkSnapshot(DSProgressIndicatorCO.snapshotPath('progressindicator-basic'));
+      await (await DSProgressIndicatorCO.getTitle()).waitForDisplayed();
+
+      const snapshot = await browser.percyCheckScreenshot();
       await expect(snapshot).toEqual(0);
     });
   });
-  describe('PUI-17523 - Progress Indicator:: Others Test - Visual', () => {
+
+  describe('PUI-17523 - DSProgressIndicator:: Others Test - Visual', () => {
     before('loading page', async () => {
       const errorOnGo = await DSProgressIndicatorCO.othersURL.go();
       if (errorOnGo) throw errorOnGo;
     });
     it('01: should display progress indicator', async () => {
-      const snapshot = await browser.checkSnapshot(DSProgressIndicatorCO.snapshotPath('progressindicator-others'));
+      // Two of the four indicators are driven by setInterval and only stop once their counters
+      // reach the maximum. Snapshotting before that lands produces a different image every run.
+      await DSProgressIndicatorCO.waitForAnimatedCountersToSettle();
+
+      const snapshot = await browser.percyCheckScreenshot();
       await expect(snapshot).toEqual(0);
     });
   });

package/ds-progress-indicator/DSProgressIndicatorCO.js

@@ -1,26 +1,97 @@
 import { PATH_E2E_PROGRESS_INDICATOR } from '../paths';
 import { PageObject, Urlbuilder } from '../helpers';
 
+// Slot testids owned by the component (packages/atom/ds-progress-indicator/src/constants/index.ts).
+// Note the lowercase `i` in "progressindicator": it comes from DSProgressIndicatorName.
+const SLOT_TESTID = {
+  ROOT: 'ds-progressindicator-root',
+  TITLE: 'ds-progressindicator-title',
+  COUNTER: 'ds-progressindicator-counter',
+  PROGRESS_BAR: 'ds-progressindicator-progress-bar',
+  PROGRESS: 'ds-progressindicator-progress',
+};
+
+// In segmented mode every segment reuses the PROGRESS testid, and the stories render several
+// indicators per page, so selectors are scoped by the story's per-scenario `*-case` wrapper.
+// Omit `caseTestId` for single-indicator stories such as BasicTest.
+const scoped = (testId, caseTestId) =>
+  caseTestId ? `[data-testid="${caseTestId}"] [data-testid="${testId}"]` : `[data-testid="${testId}"]`;
+
 export default class DSProgressIndicatorCO extends PageObject {
   // Desktop
   static basicURL = new Urlbuilder(PATH_E2E_PROGRESS_INDICATOR, 'basic-test');
 
   static othersURL = new Urlbuilder(PATH_E2E_PROGRESS_INDICATOR, 'others-test');
 
-  static getUrl(component = 'basic') {
-    return PageObject.getUrl(PATH_E2E_PROGRESS_INDICATOR, component);
+  static ariaContractURL = new Urlbuilder(PATH_E2E_PROGRESS_INDICATOR, 'aria-contract-test');
+
+  static slotsURL = new Urlbuilder(PATH_E2E_PROGRESS_INDICATOR, 'slots-test');
+
+  static SLOT_TESTID = SLOT_TESTID;
+
+  // selectors
+  static async getRoot(caseTestId) {
+    return $(scoped(SLOT_TESTID.ROOT, caseTestId));
   }
 
-  static async getUploadLabel() {
-    return $('//span[contains(text(), "upload")]');
+  static async getTitle(caseTestId) {
+    return $(scoped(SLOT_TESTID.TITLE, caseTestId));
   }
 
-  // Snapshots
-  static snapshotPath(example = 'basic') {
-    return PageObject.getSnapshotPathBuilder('ProgressIndicator', example);
+  static async getCounter(caseTestId) {
+    return $(scoped(SLOT_TESTID.COUNTER, caseTestId));
+  }
+
+  static async getProgressBar(caseTestId) {
+    return $(scoped(SLOT_TESTID.PROGRESS_BAR, caseTestId));
+  }
+
+  // First (or only) progressbar of a case. Use getProgressBars for the segmented ones.
+  static async getProgress(caseTestId) {
+    return $(scoped(SLOT_TESTID.PROGRESS, caseTestId));
+  }
+
+  static async getProgressBars(caseTestId) {
+    return $$(scoped(SLOT_TESTID.PROGRESS, caseTestId));
+  }
+
+  // Slot-level lookups, for asserting the data-dimsum-slot contract independently of the testids.
+  static async getSlot(slotName, caseTestId) {
+    const prefix = caseTestId ? `[data-testid="${caseTestId}"] ` : '';
+    return $(`${prefix}[data-dimsum-slot="${slotName}"]`);
+  }
+
+  static async getSlots(slotName, caseTestId) {
+    const prefix = caseTestId ? `[data-testid="${caseTestId}"] ` : '';
+    return $$(`${prefix}[data-dimsum-slot="${slotName}"]`);
+  }
+
+  // aria-labelledby points at a React.useId() value containing ":", which is not a valid CSS id
+  // selector, so the target has to be resolved through the attribute selector instead of "#id".
+  static async getByIdAttribute(id) {
+    return $(`[id="${id}"]`);
   }
 
-  // selectors
-  // actions
   // utils
+  // OthersTest drives two indicators with setInterval counters. They stop once each counter reaches
+  // its max, so the story is only deterministic after both have landed on their final totals.
+  //
+  // The texts are read in a single browser.execute rather than by mapping over $$: WebdriverIO's
+  // element array overrides .map() to return a Promise, so Promise.all(list.map(...)) throws
+  // "object is not iterable". One round trip per poll is also cheaper than four.
+  static async waitForAnimatedCountersToSettle() {
+    await browser.waitUntil(
+      async () => {
+        const texts = await browser.execute(
+          (testId) => Array.from(document.querySelectorAll(`[data-testid="${testId}"]`), (el) => el.textContent),
+          SLOT_TESTID.COUNTER,
+        );
+        return texts.length >= 4 && texts[1] === '400 of 400' && texts[2] === '330 of 330';
+      },
+      {
+        timeout: 15000,
+        timeoutMsg: 'animated progress indicators never reached their final value',
+      },
+    );
+  }
 }

package/ds-progress-indicator/aria-contract/DSProgressIndicator.aria-contract.func.spec.js

@@ -0,0 +1,104 @@
+import DSProgressIndicatorCO from '../DSProgressIndicatorCO';
+
+// Coverage for the accessibility remediation shipped in PUI-18856 (PR #8353):
+//   PUI-18671 the progressbar used to carry a hardcoded aria-label="progress bar". It is now named
+//             by the visible title through aria-labelledby, and that string survives only as the
+//             fallback for an untitled indicator.
+//   PUI-18673 aria-valuetext now mirrors whatever the visible counter renders, default or custom.
+//   PUI-18675 each segment accepts a `label` that becomes its own accessible name. Only the Dimsum
+//             half of that defect is assertable here; the visible non-colour alternative is the
+//             consumer's, see stories/docs/principles/a11y/tradesoff.
+//   PUI-18672 an invalid `max` no longer produces width: NaN% and an inverted ARIA range. `max` was
+//             deliberately NOT made required (KNOWN_INTENTIONAL_DEVIATIONS.md, deviation 6), so what
+//             is asserted below is the shipped fail-safe: an indeterminate progressbar.
+//
+// Every assertion is a DOM attribute, which is identical across engines, so this runs Chrome only.
+// The `|| 'Chrome'` branch is mandatory: BrowserStack reports the capitalised name and a
+// lowercase-only guard would register zero tests while still exiting 0.
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-19209 - DSProgressIndicator:: progressbar ARIA contract - Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSProgressIndicatorCO.ariaContractURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should name the progressbar from the visible title and fall back when untitled', async () => {
+      const titled = await DSProgressIndicatorCO.getProgress('titled-case');
+      await titled.waitForDisplayed();
+      await expect(titled).not.toHaveAttribute('aria-label');
+
+      // The id is generated with React.useId(), so it is resolved at runtime rather than hardcoded.
+      const labelledBy = await titled.getAttribute('aria-labelledby');
+      const title = await DSProgressIndicatorCO.getTitle('titled-case');
+      await expect(await title.getAttribute('id')).toEqual(labelledBy);
+      await expect(await DSProgressIndicatorCO.getByIdAttribute(labelledBy)).toHaveText('Uploading documents');
+
+      const titleless = await DSProgressIndicatorCO.getProgress('titleless-case');
+      await expect(titleless).toHaveAttribute('aria-label', 'progress bar');
+      await expect(titleless).not.toHaveAttribute('aria-labelledby');
+    });
+
+    it('02: should mirror the visible counter in aria-valuetext for default and custom renderers', async () => {
+      const defaultCounter = await DSProgressIndicatorCO.getCounter('titled-case');
+      await expect(defaultCounter).toHaveText('50 of 100');
+      const defaultBar = await DSProgressIndicatorCO.getProgress('titled-case');
+      await expect(defaultBar).toHaveAttribute('aria-valuetext', '50 of 100');
+
+      const customCounter = await DSProgressIndicatorCO.getCounter('custom-counter-case');
+      await expect(customCounter).toHaveText('3 files remaining');
+      const customBar = await DSProgressIndicatorCO.getProgress('custom-counter-case');
+      await expect(customBar).toHaveAttribute('aria-valuetext', '3 files remaining');
+    });
+
+    it('03: should give each labelled segment its own accessible name', async () => {
+      const labelled = await DSProgressIndicatorCO.getProgressBars('labelled-segments-case');
+      await expect(labelled).toBeElementsArrayOfSize(2);
+
+      // A segment label wins over the indicator title, so aria-labelledby is dropped entirely.
+      await expect(labelled[0]).toHaveAttribute('aria-label', 'Approved documents');
+      await expect(labelled[0]).not.toHaveAttribute('aria-labelledby');
+      await expect(labelled[1]).toHaveAttribute('aria-label', 'Rejected documents');
+      await expect(labelled[1]).not.toHaveAttribute('aria-labelledby');
+
+      // Each segment reports its own range rather than the aggregate shown by the counter.
+      await expect(labelled[0]).toHaveAttribute('aria-valuetext', '50 of 100');
+      await expect(labelled[1]).toHaveAttribute('aria-valuetext', '100 of 200');
+
+      // An unlabelled segment still falls back to the indicator title.
+      const mixed = await DSProgressIndicatorCO.getProgressBars('mixed-segments-case');
+      await expect(mixed).toBeElementsArrayOfSize(2);
+      await expect(mixed[0]).toHaveAttribute('aria-label', 'Completed');
+      await expect(mixed[1]).not.toHaveAttribute('aria-label');
+      const fallbackId = await mixed[1].getAttribute('aria-labelledby');
+      await expect(await DSProgressIndicatorCO.getByIdAttribute(fallbackId)).toHaveText('Batch upload');
+    });
+
+    it('04: should render indeterminate for an invalid max and clamp an overflowing value', async () => {
+      const expectIndeterminate = async (caseId) => {
+        const bar = await DSProgressIndicatorCO.getProgress(caseId);
+        await expect(bar).toHaveAttribute('role', 'progressbar');
+        await expect(bar).not.toHaveAttribute('aria-valuenow');
+        await expect(bar).not.toHaveAttribute('aria-valuemin');
+        await expect(bar).not.toHaveAttribute('aria-valuemax');
+        await expect(bar).not.toHaveAttribute('aria-valuetext');
+        // The pre-fix behaviour was width: NaN%; the guard now yields a valid zero-length fill.
+        await expect(await bar.getAttribute('style')).toContain('width: 0%');
+        // The indicator is still named, so the invalid range degrades without losing the label.
+        await expect(bar).toHaveAttribute('aria-labelledby');
+      };
+
+      await expectIndeterminate('omitted-max-case');
+      await expectIndeterminate('zero-max-case');
+
+      const overflow = await DSProgressIndicatorCO.getProgress('overflow-case');
+      await expect(overflow).toHaveAttribute('aria-valuenow', '100');
+      await expect(overflow).toHaveAttribute('aria-valuemax', '100');
+      await expect(await overflow.getAttribute('style')).toContain('width: 100%');
+    });
+  });
+}

package/ds-progress-indicator/slots/DSProgressIndicator.slots.axe-core.func.spec.js

@@ -0,0 +1,31 @@
+import DSProgressIndicatorCO from '../DSProgressIndicatorCO';
+import { axeCoreCheck } from '../../helpers';
+
+// SlotsTest is the only ProgressIndicator story that overrides color/backgroundColor, so it is the
+// one place where the test code itself can introduce a contrast regression. This run is what makes
+// the WCAG 2 AA pairs in the story load-bearing rather than advisory. It also guards the
+// consumer-supplied slot aria-label against colliding with the component's own naming.
+//
+// Chrome only: axe-core results do not vary by engine. The `|| 'Chrome'` branch is mandatory,
+// BrowserStack reports the capitalised name and a lowercase-only guard registers zero tests.
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-19212 - DSProgressIndicator:: slot theming - Axe-Core', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSProgressIndicatorCO.slotsURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should have no accessibility violations with custom slot theming', async () => {
+      const root = await DSProgressIndicatorCO.getSlot('dsProgressindicatorRoot', 'segmented-slots-case');
+      await root.waitForDisplayed();
+
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+  });
+}

package/ds-progress-indicator/slots/DSProgressIndicator.slots.func.spec.js

@@ -0,0 +1,87 @@
+import DSProgressIndicatorCO from '../DSProgressIndicatorCO';
+
+// Slot contract coverage for the compliance migration in PUI-18856 / PUI-18941. The package dropped
+// ds-classnames/aggregatedClasses for the native slot system, so each visual element must now be
+// addressable through data-dimsum-slot and must accept consumer slot props.
+//
+// The consumer's `data-testid` REPLACES the component default, which is why this spec addresses the
+// elements through data-dimsum-slot and then asserts the overridden testid, rather than the other
+// way round.
+//
+// Slot attribute pass-through is engine-independent, so this runs Chrome only. The `|| 'Chrome'`
+// branch is mandatory: BrowserStack reports the capitalised name and a lowercase-only guard would
+// register zero tests while still exiting 0.
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-19210 - DSProgressIndicator:: slot contract and slot prop forwarding - Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSProgressIndicatorCO.slotsURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should expose the five slots on both the single and the segmented indicator', async () => {
+      const expectFiveSlots = async (caseId) => {
+        const [root, title, counter, progressBar, progress] = await Promise.all([
+          DSProgressIndicatorCO.getSlot('dsProgressindicatorRoot', caseId),
+          DSProgressIndicatorCO.getSlot('dsProgressindicatorTitle', caseId),
+          DSProgressIndicatorCO.getSlot('dsProgressindicatorCounter', caseId),
+          DSProgressIndicatorCO.getSlot('dsProgressindicatorProgressBar', caseId),
+          DSProgressIndicatorCO.getSlot('dsProgressindicatorProgress', caseId),
+        ]);
+
+        await root.waitForDisplayed();
+        await expect(root).toHaveAttribute('data-testid', 'custom-root-data');
+        await expect(title).toHaveAttribute('data-testid', 'custom-title-data');
+        await expect(counter).toHaveAttribute('data-testid', 'custom-counter-data');
+        await expect(progressBar).toHaveAttribute('data-testid', 'custom-progress-bar-data');
+        await expect(progress).toHaveAttribute('data-testid', 'custom-progress-data');
+      };
+
+      await expectFiveSlots('single-slots-case');
+      await expectFiveSlots('segmented-slots-case');
+    });
+
+    it('02: should forward consumer slot props to every slot and to each segment', async () => {
+      const [title, counter, progress] = await Promise.all([
+        DSProgressIndicatorCO.getSlot('dsProgressindicatorTitle', 'single-slots-case'),
+        DSProgressIndicatorCO.getSlot('dsProgressindicatorCounter', 'single-slots-case'),
+        DSProgressIndicatorCO.getSlot('dsProgressindicatorProgress', 'single-slots-case'),
+      ]);
+
+      await expect(title).toHaveAttribute('lang', 'en');
+      await expect(counter).toHaveAttribute('title', 'custom counter title');
+
+      // The progress slot carries role="progressbar", so a slot-level aria-label is legal there and
+      // is forwarded. It does not become the accessible name though: the component also emits its
+      // own aria-labelledby pointing at the title, and aria-labelledby outranks aria-label. Chrome's
+      // accessibility tree names these bars after their title, not "custom progress aria".
+      //
+      // That is the intended outcome, not a gap. Keeping the name tied to the visible title is the
+      // WCAG 2.5.3 Label in Name principle, and localisation is handled by passing a translated
+      // `title` rather than by overriding the label. The slot-level aria-label only takes effect on
+      // a titleless indicator, where the component would otherwise fall back to "progress bar".
+      // Asserting both attributes here pins the forwarding contract without implying the override
+      // wins the name.
+      await expect(progress).toHaveAttribute('role', 'progressbar');
+      await expect(progress).toHaveAttribute('aria-label', 'custom progress aria');
+      await expect(progress).toHaveAttribute('aria-labelledby');
+
+      // Slot props must reach every segment, not just the first one. The segments are addressed by
+      // index rather than with .map(): WebdriverIO's element array overrides .map() to return a
+      // Promise, so Promise.all(segments.map(...)) throws "object is not iterable".
+      const segments = await DSProgressIndicatorCO.getSlots('dsProgressindicatorProgress', 'segmented-slots-case');
+      await expect(segments).toBeElementsArrayOfSize(3);
+
+      await expect(segments[0]).toHaveAttribute('data-testid', 'custom-progress-data');
+      await expect(segments[0]).toHaveAttribute('aria-label', 'custom progress aria');
+      await expect(segments[1]).toHaveAttribute('data-testid', 'custom-progress-data');
+      await expect(segments[1]).toHaveAttribute('aria-label', 'custom progress aria');
+      await expect(segments[2]).toHaveAttribute('data-testid', 'custom-progress-data');
+      await expect(segments[2]).toHaveAttribute('aria-label', 'custom progress aria');
+    });
+  });
+}

package/ds-progress-indicator/slots/DSProgressIndicator.slots.visual.spec.js

@@ -0,0 +1,26 @@
+import DSProgressIndicatorCO from '../DSProgressIndicatorCO';
+
+// Visual half of the PUI-18856 slot migration: proves the styleOverrides payload actually reaches
+// each slot after the move off ds-classnames. The functional spec covers the attribute contract, so
+// this only needs the rendered appearance.
+//
+// Known gap this snapshot records rather than hides: the `progress-bar` slot keeps the grey legacy
+// track colour. Its styleOverride is emitted but loses the cascade to the retained SCSS rule
+// `.em-ds-determinate-progress-indicator .em-ds-progress-bar` (two classes beat the single
+// styled-components class). The other four slots take their overrides.
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-19211 - DSProgressIndicator:: slot theming - Visual', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSProgressIndicatorCO.slotsURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should display the single and segmented indicators with slot theming applied', async () => {
+      const root = await DSProgressIndicatorCO.getSlot('dsProgressindicatorRoot', 'segmented-slots-case');
+      await root.waitForDisplayed();
+
+      const snapshot = await browser.percyCheckScreenshot();
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/package.json

@@ -1,9 +1,100 @@
 {
   "type": "module",
   "name": "dimsum-e2e-tests",
-  "version": "3.80.0-next.14",
+  "version": "3.80.0-next.19",
   "description": "End-to-end tests for dimsum library",
   "dependencies": {
+    "@elliemae/ds-accessibility": "3.80.0-next.19",
+    "@elliemae/ds-accordion": "3.80.0-next.19",
+    "@elliemae/ds-app-picker": "3.80.0-next.19",
+    "@elliemae/ds-backdrop": "3.80.0-next.19",
+    "@elliemae/ds-banner": "3.80.0-next.19",
+    "@elliemae/ds-basic": "3.80.0-next.19",
+    "@elliemae/ds-breadcrumb": "3.80.0-next.19",
+    "@elliemae/ds-button-v2": "3.80.0-next.19",
+    "@elliemae/ds-card": "3.80.0-next.19",
+    "@elliemae/ds-card-navigation": "3.80.0-next.19",
+    "@elliemae/ds-card-v1": "3.80.0-next.19",
+    "@elliemae/ds-card-v1-detail": "3.80.0-next.19",
+    "@elliemae/ds-card-v2": "3.80.0-next.19",
+    "@elliemae/ds-card-v2-action-addon": "3.80.0-next.19",
+    "@elliemae/ds-card-v2-group": "3.80.0-next.19",
+    "@elliemae/ds-card-v3": "3.80.0-next.19",
+    "@elliemae/ds-card-v3-poc": "3.80.0-next.19",
+    "@elliemae/ds-chat": "3.80.0-next.19",
+    "@elliemae/ds-chat-bubble": "3.80.0-next.19",
+    "@elliemae/ds-chat-card": "3.80.0-next.19",
+    "@elliemae/ds-chat-container": "3.80.0-next.19",
+    "@elliemae/ds-chat-container-header": "3.80.0-next.19",
+    "@elliemae/ds-chat-empty-state": "3.80.0-next.19",
+    "@elliemae/ds-chat-floating-button": "3.80.0-next.19",
+    "@elliemae/ds-chat-message-delimeter": "3.80.0-next.19",
+    "@elliemae/ds-chat-sidebar": "3.80.0-next.19",
+    "@elliemae/ds-chat-system-message": "3.80.0-next.19",
+    "@elliemae/ds-chat-tile": "3.80.0-next.19",
+    "@elliemae/ds-chip": "3.80.0-next.19",
+    "@elliemae/ds-circular-progress-indicator": "3.80.0-next.19",
+    "@elliemae/ds-classnames": "3.80.0-next.19",
+    "@elliemae/ds-codeeditor": "3.80.0-next.19",
+    "@elliemae/ds-comments": "3.80.0-next.19",
+    "@elliemae/ds-controlled-form": "3.80.0-next.19",
+    "@elliemae/ds-csv-converter": "3.80.0-next.19",
+    "@elliemae/ds-data-table": "3.80.0-next.19",
+    "@elliemae/ds-data-table-action-cell": "3.80.0-next.19",
+    "@elliemae/ds-data-table-cell": "3.80.0-next.19",
+    "@elliemae/ds-data-table-cell-header": "3.80.0-next.19",
+    "@elliemae/ds-data-table-drag-and-drop-cell": "3.80.0-next.19",
+    "@elliemae/ds-data-table-expand-cell": "3.80.0-next.19",
+    "@elliemae/ds-data-table-filters": "3.80.0-next.19",
+    "@elliemae/ds-data-table-multi-select-cell": "3.80.0-next.19",
+    "@elliemae/ds-data-table-single-select-cell": "3.80.0-next.19",
+    "@elliemae/ds-dataviz": "3.80.0-next.19",
+    "@elliemae/ds-dataviz-pie": "3.80.0-next.19",
+    "@elliemae/ds-date-time-picker": "3.80.0-next.19",
+    "@elliemae/ds-decision-graph": "3.80.0-next.19",
+    "@elliemae/ds-dialog": "3.80.0-next.19",
+    "@elliemae/ds-drag-and-drop": "3.80.0-next.19",
+    "@elliemae/ds-dropdownmenu-v2": "3.80.0-next.19",
+    "@elliemae/ds-dropzone": "3.80.0-next.19",
+    "@elliemae/ds-fast-list": "3.80.0-next.19",
+    "@elliemae/ds-filter-bar": "3.80.0-next.19",
+    "@elliemae/ds-floating-context": "3.80.0-next.19",
+    "@elliemae/ds-form-checkbox": "3.80.0-next.19",
+    "@elliemae/ds-form-combobox": "3.80.0-next.19",
+    "@elliemae/ds-form-date-range-picker": "3.80.0-next.19",
+    "@elliemae/ds-form-date-time-picker": "3.80.0-next.19",
+    "@elliemae/ds-form-helpers-mask-hooks": "3.80.0-next.19",
+    "@elliemae/ds-form-input-text": "3.80.0-next.19",
+    "@elliemae/ds-form-input-textarea": "3.80.0-next.19",
+    "@elliemae/ds-form-layout-autocomplete": "3.80.0-next.19",
+    "@elliemae/ds-form-layout-blocks": "3.80.0-next.19",
+    "@elliemae/ds-form-layout-input-group": "3.80.0-next.19",
+    "@elliemae/ds-form-layout-label": "3.80.0-next.19",
+    "@elliemae/ds-form-multi-combobox": "3.80.0-next.19",
+    "@elliemae/ds-form-native-select": "3.80.0-next.19",
+    "@elliemae/ds-form-radio": "3.80.0-next.19",
+    "@elliemae/ds-form-select": "3.80.0-next.19",
+    "@elliemae/ds-form-single-combobox": "3.80.0-next.19",
+    "@elliemae/ds-form-toggle": "3.80.0-next.19",
+    "@elliemae/ds-global-header": "3.80.0-next.19",
+    "@elliemae/ds-grid": "3.80.0-next.19",
+    "@elliemae/ds-hooks-focus-stack": "3.80.0-next.19",
+    "@elliemae/ds-hooks-focus-trap": "3.80.0-next.19",
+    "@elliemae/ds-hooks-fontsize-detector": "3.80.0-next.19",
+    "@elliemae/ds-hooks-fontsize-media": "3.80.0-next.19",
+    "@elliemae/ds-hooks-headless-tooltip": "3.80.0-next.19",
+    "@elliemae/ds-hooks-is-mobile": "3.80.0-next.19",
+    "@elliemae/ds-hooks-is-showing-ellipsis": "3.80.0-next.19",
+    "@elliemae/ds-hooks-keyboard-navigation": "3.80.0-next.19",
+    "@elliemae/ds-hooks-on-blur-out": "3.80.0-next.19",
+    "@elliemae/ds-hooks-on-first-focus-in": "3.80.0-next.19",
+    "@elliemae/ds-icon": "3.80.0-next.19",
+    "@elliemae/ds-icons": "3.80.0-next.19",
+    "@elliemae/ds-image": "3.80.0-next.19",
+    "@elliemae/ds-imagelibrarymodal": "3.80.0-next.19",
+    "@elliemae/ds-indeterminate-progress-indicator": "3.80.0-next.19",
+    "@elliemae/ds-layout-provider": "3.80.0-next.19",
+    "@elliemae/ds-left-navigation": "3.80.0-next.19",
     "@elliemae/ds-legacy-button": "1.0.16",
     "@elliemae/ds-legacy-button-group": "1.0.16",
     "@elliemae/ds-legacy-button-v1": "1.0.16",
@@ -38,153 +129,62 @@
     "@elliemae/ds-legacy-wysiwygeditor": "1.0.16",
     "@elliemae/ds-legacy-zipcode-search": "1.0.16",
     "@elliemae/ds-legacy-zoom": "1.0.16",
-    "@elliemae/ds-accessibility": "3.80.0-next.14",
-    "@elliemae/ds-banner": "3.80.0-next.14",
-    "@elliemae/ds-accordion": "3.80.0-next.14",
-    "@elliemae/ds-basic": "3.80.0-next.14",
-    "@elliemae/ds-app-picker": "3.80.0-next.14",
-    "@elliemae/ds-breadcrumb": "3.80.0-next.14",
-    "@elliemae/ds-card": "3.80.0-next.14",
-    "@elliemae/ds-card-navigation": "3.80.0-next.14",
-    "@elliemae/ds-card-v1": "3.80.0-next.14",
-    "@elliemae/ds-card-v1-detail": "3.80.0-next.14",
-    "@elliemae/ds-card-v2": "3.80.0-next.14",
-    "@elliemae/ds-card-v2-action-addon": "3.80.0-next.14",
-    "@elliemae/ds-backdrop": "3.80.0-next.14",
-    "@elliemae/ds-card-v2-group": "3.80.0-next.14",
-    "@elliemae/ds-card-v3": "3.80.0-next.14",
-    "@elliemae/ds-card-v3-poc": "3.80.0-next.14",
-    "@elliemae/ds-chat": "3.80.0-next.14",
-    "@elliemae/ds-chat-card": "3.80.0-next.14",
-    "@elliemae/ds-chat-bubble": "3.80.0-next.14",
-    "@elliemae/ds-chat-container": "3.80.0-next.14",
-    "@elliemae/ds-chat-container-header": "3.80.0-next.14",
-    "@elliemae/ds-chat-empty-state": "3.80.0-next.14",
-    "@elliemae/ds-chat-floating-button": "3.80.0-next.14",
-    "@elliemae/ds-button-v2": "3.80.0-next.14",
-    "@elliemae/ds-chat-message-delimeter": "3.80.0-next.14",
-    "@elliemae/ds-chat-system-message": "3.80.0-next.14",
-    "@elliemae/ds-chat-sidebar": "3.80.0-next.14",
-    "@elliemae/ds-chat-tile": "3.80.0-next.14",
-    "@elliemae/ds-circular-progress-indicator": "3.80.0-next.14",
-    "@elliemae/ds-classnames": "3.80.0-next.14",
-    "@elliemae/ds-chip": "3.80.0-next.14",
-    "@elliemae/ds-codeeditor": "3.80.0-next.14",
-    "@elliemae/ds-comments": "3.80.0-next.14",
-    "@elliemae/ds-controlled-form": "3.80.0-next.14",
-    "@elliemae/ds-csv-converter": "3.80.0-next.14",
-    "@elliemae/ds-data-table": "3.80.0-next.14",
-    "@elliemae/ds-data-table-cell": "3.80.0-next.14",
-    "@elliemae/ds-data-table-drag-and-drop-cell": "3.80.0-next.14",
-    "@elliemae/ds-data-table-cell-header": "3.80.0-next.14",
-    "@elliemae/ds-data-table-action-cell": "3.80.0-next.14",
-    "@elliemae/ds-data-table-expand-cell": "3.80.0-next.14",
-    "@elliemae/ds-data-table-filters": "3.80.0-next.14",
-    "@elliemae/ds-data-table-multi-select-cell": "3.80.0-next.14",
-    "@elliemae/ds-data-table-single-select-cell": "3.80.0-next.14",
-    "@elliemae/ds-dataviz": "3.80.0-next.14",
-    "@elliemae/ds-dataviz-pie": "3.80.0-next.14",
-    "@elliemae/ds-dialog": "3.80.0-next.14",
-    "@elliemae/ds-drag-and-drop": "3.80.0-next.14",
-    "@elliemae/ds-date-time-picker": "3.80.0-next.14",
-    "@elliemae/ds-fast-list": "3.80.0-next.14",
-    "@elliemae/ds-decision-graph": "3.80.0-next.14",
-    "@elliemae/ds-dropzone": "3.80.0-next.14",
-    "@elliemae/ds-filter-bar": "3.80.0-next.14",
-    "@elliemae/ds-floating-context": "3.80.0-next.14",
-    "@elliemae/ds-form-checkbox": "3.80.0-next.14",
-    "@elliemae/ds-form-combobox": "3.80.0-next.14",
-    "@elliemae/ds-form-date-time-picker": "3.80.0-next.14",
-    "@elliemae/ds-form-date-range-picker": "3.80.0-next.14",
-    "@elliemae/ds-form-input-text": "3.80.0-next.14",
-    "@elliemae/ds-form-input-textarea": "3.80.0-next.14",
-    "@elliemae/ds-form-layout-blocks": "3.80.0-next.14",
-    "@elliemae/ds-form-layout-autocomplete": "3.80.0-next.14",
-    "@elliemae/ds-form-layout-label": "3.80.0-next.14",
-    "@elliemae/ds-form-layout-input-group": "3.80.0-next.14",
-    "@elliemae/ds-form-multi-combobox": "3.80.0-next.14",
-    "@elliemae/ds-form-native-select": "3.80.0-next.14",
-    "@elliemae/ds-form-radio": "3.80.0-next.14",
-    "@elliemae/ds-form-select": "3.80.0-next.14",
-    "@elliemae/ds-form-single-combobox": "3.80.0-next.14",
-    "@elliemae/ds-form-toggle": "3.80.0-next.14",
-    "@elliemae/ds-global-header": "3.80.0-next.14",
-    "@elliemae/ds-form-helpers-mask-hooks": "3.80.0-next.14",
-    "@elliemae/ds-hooks-focus-trap": "3.80.0-next.14",
-    "@elliemae/ds-hooks-focus-stack": "3.80.0-next.14",
-    "@elliemae/ds-hooks-fontsize-media": "3.80.0-next.14",
-    "@elliemae/ds-hooks-fontsize-detector": "3.80.0-next.14",
-    "@elliemae/ds-hooks-headless-tooltip": "3.80.0-next.14",
-    "@elliemae/ds-hooks-is-mobile": "3.80.0-next.14",
-    "@elliemae/ds-hooks-keyboard-navigation": "3.80.0-next.14",
-    "@elliemae/ds-hooks-is-showing-ellipsis": "3.80.0-next.14",
-    "@elliemae/ds-hooks-on-blur-out": "3.80.0-next.14",
-    "@elliemae/ds-icon": "3.80.0-next.14",
-    "@elliemae/ds-hooks-on-first-focus-in": "3.80.0-next.14",
-    "@elliemae/ds-icons": "3.80.0-next.14",
-    "@elliemae/ds-image": "3.80.0-next.14",
-    "@elliemae/ds-imagelibrarymodal": "3.80.0-next.14",
-    "@elliemae/ds-grid": "3.80.0-next.14",
-    "@elliemae/ds-left-navigation": "3.80.0-next.14",
-    "@elliemae/ds-indeterminate-progress-indicator": "3.80.0-next.14",
-    "@elliemae/ds-loading-indicator": "3.80.0-next.14",
-    "@elliemae/ds-menu-button": "3.80.0-next.14",
-    "@elliemae/ds-menu-items": "3.80.0-next.14",
-    "@elliemae/ds-menu-items-action": "3.80.0-next.14",
-    "@elliemae/ds-menu-items-commons": "3.80.0-next.14",
-    "@elliemae/ds-menu-items-section": "3.80.0-next.14",
-    "@elliemae/ds-menu-items-multi": "3.80.0-next.14",
-    "@elliemae/ds-menu-items-single": "3.80.0-next.14",
-    "@elliemae/ds-menu-items-separator": "3.80.0-next.14",
-    "@elliemae/ds-menu-items-single-with-submenu": "3.80.0-next.14",
-    "@elliemae/ds-menu-items-skeleton": "3.80.0-next.14",
-    "@elliemae/ds-menu-items-submenu": "3.80.0-next.14",
-    "@elliemae/ds-menu-tree-item": "3.80.0-next.14",
-    "@elliemae/ds-modal-slide": "3.80.0-next.14",
-    "@elliemae/ds-notification-badge": "3.80.0-next.14",
-    "@elliemae/ds-page-header": "3.80.0-next.14",
-    "@elliemae/ds-page-header-v2": "3.80.0-next.14",
-    "@elliemae/ds-overlay": "3.80.0-next.14",
-    "@elliemae/ds-page-header-v1": "3.80.0-next.14",
-    "@elliemae/ds-page-layout": "3.80.0-next.14",
-    "@elliemae/ds-pagination": "3.80.0-next.14",
-    "@elliemae/ds-progress-indicator": "3.80.0-next.14",
-    "@elliemae/ds-dropdownmenu-v2": "3.80.0-next.14",
-    "@elliemae/ds-layout-provider": "3.80.0-next.14",
-    "@elliemae/ds-pills-v2": "3.80.0-next.14",
-    "@elliemae/ds-portal": "3.80.0-next.14",
-    "@elliemae/ds-read-more": "3.80.0-next.14",
-    "@elliemae/ds-query-builder": "3.80.0-next.14",
-    "@elliemae/ds-props-helpers": "3.80.0-next.14",
-    "@elliemae/ds-separator": "3.80.0-next.14",
-    "@elliemae/ds-ribbon": "3.80.0-next.14",
-    "@elliemae/ds-scrollable-container": "3.80.0-next.14",
-    "@elliemae/ds-resizeable-container": "3.80.0-next.14",
-    "@elliemae/ds-shared": "3.80.0-next.14",
-    "@elliemae/ds-side-panel-header": "3.80.0-next.14",
-    "@elliemae/ds-shuttle-v2": "3.80.0-next.14",
-    "@elliemae/ds-side-panel": "3.80.0-next.14",
-    "@elliemae/ds-slider-v2": "3.80.0-next.14",
-    "@elliemae/ds-skeleton": "3.80.0-next.14",
-    "@elliemae/ds-svg": "3.80.0-next.14",
-    "@elliemae/ds-stepper": "3.80.0-next.14",
-    "@elliemae/ds-square-indicator": "3.80.0-next.14",
-    "@elliemae/ds-system": "3.80.0-next.14",
-    "@elliemae/ds-tabs": "3.80.0-next.14",
-    "@elliemae/ds-test-utils": "3.80.0-next.14",
-    "@elliemae/ds-toast": "3.80.0-next.14",
-    "@elliemae/ds-toolbar-v1": "3.80.0-next.14",
-    "@elliemae/ds-transition": "3.80.0-next.14",
-    "@elliemae/ds-tooltip-v3": "3.80.0-next.14",
-    "@elliemae/ds-tree-model": "3.80.0-next.14",
-    "@elliemae/ds-toolbar-v2": "3.80.0-next.14",
-    "@elliemae/ds-truncated-expandable-text": "3.80.0-next.14",
-    "@elliemae/ds-typescript-helpers": "3.80.0-next.14",
-    "@elliemae/ds-typography": "3.80.0-next.14",
-    "@elliemae/ds-virtual-list": "3.80.0-next.14",
-    "@elliemae/ds-treeview": "3.80.0-next.14",
-    "@elliemae/ds-wizard": "3.80.0-next.14",
-    "@elliemae/ds-zustand-helpers": "3.80.0-next.14"
+    "@elliemae/ds-loading-indicator": "3.80.0-next.19",
+    "@elliemae/ds-menu-button": "3.80.0-next.19",
+    "@elliemae/ds-menu-items": "3.80.0-next.19",
+    "@elliemae/ds-menu-items-action": "3.80.0-next.19",
+    "@elliemae/ds-menu-items-commons": "3.80.0-next.19",
+    "@elliemae/ds-menu-items-multi": "3.80.0-next.19",
+    "@elliemae/ds-menu-items-section": "3.80.0-next.19",
+    "@elliemae/ds-menu-items-separator": "3.80.0-next.19",
+    "@elliemae/ds-menu-items-single": "3.80.0-next.19",
+    "@elliemae/ds-menu-items-single-with-submenu": "3.80.0-next.19",
+    "@elliemae/ds-menu-items-skeleton": "3.80.0-next.19",
+    "@elliemae/ds-menu-items-submenu": "3.80.0-next.19",
+    "@elliemae/ds-menu-tree-item": "3.80.0-next.19",
+    "@elliemae/ds-modal-slide": "3.80.0-next.19",
+    "@elliemae/ds-notification-badge": "3.80.0-next.19",
+    "@elliemae/ds-overlay": "3.80.0-next.19",
+    "@elliemae/ds-page-header": "3.80.0-next.19",
+    "@elliemae/ds-page-header-v1": "3.80.0-next.19",
+    "@elliemae/ds-page-header-v2": "3.80.0-next.19",
+    "@elliemae/ds-page-layout": "3.80.0-next.19",
+    "@elliemae/ds-pagination": "3.80.0-next.19",
+    "@elliemae/ds-pills-v2": "3.80.0-next.19",
+    "@elliemae/ds-portal": "3.80.0-next.19",
+    "@elliemae/ds-progress-indicator": "3.80.0-next.19",
+    "@elliemae/ds-props-helpers": "3.80.0-next.19",
+    "@elliemae/ds-query-builder": "3.80.0-next.19",
+    "@elliemae/ds-read-more": "3.80.0-next.19",
+    "@elliemae/ds-resizeable-container": "3.80.0-next.19",
+    "@elliemae/ds-ribbon": "3.80.0-next.19",
+    "@elliemae/ds-scrollable-container": "3.80.0-next.19",
+    "@elliemae/ds-separator": "3.80.0-next.19",
+    "@elliemae/ds-shared": "3.80.0-next.19",
+    "@elliemae/ds-shuttle-v2": "3.80.0-next.19",
+    "@elliemae/ds-side-panel": "3.80.0-next.19",
+    "@elliemae/ds-side-panel-header": "3.80.0-next.19",
+    "@elliemae/ds-skeleton": "3.80.0-next.19",
+    "@elliemae/ds-slider-v2": "3.80.0-next.19",
+    "@elliemae/ds-square-indicator": "3.80.0-next.19",
+    "@elliemae/ds-stepper": "3.80.0-next.19",
+    "@elliemae/ds-svg": "3.80.0-next.19",
+    "@elliemae/ds-system": "3.80.0-next.19",
+    "@elliemae/ds-tabs": "3.80.0-next.19",
+    "@elliemae/ds-test-utils": "3.80.0-next.19",
+    "@elliemae/ds-toast": "3.80.0-next.19",
+    "@elliemae/ds-toolbar-v1": "3.80.0-next.19",
+    "@elliemae/ds-toolbar-v2": "3.80.0-next.19",
+    "@elliemae/ds-tooltip-v3": "3.80.0-next.19",
+    "@elliemae/ds-transition": "3.80.0-next.19",
+    "@elliemae/ds-tree-model": "3.80.0-next.19",
+    "@elliemae/ds-treeview": "3.80.0-next.19",
+    "@elliemae/ds-truncated-expandable-text": "3.80.0-next.19",
+    "@elliemae/ds-typescript-helpers": "3.80.0-next.19",
+    "@elliemae/ds-typography": "3.80.0-next.19",
+    "@elliemae/ds-virtual-list": "3.80.0-next.19",
+    "@elliemae/ds-wizard": "3.80.0-next.19",
+    "@elliemae/ds-zustand-helpers": "3.80.0-next.19"
   },
   "publishConfig": {
     "access": "public"