dimsum-e2e-tests 3.70.0-next.7 → 3.70.0-next.71

package/ds-controlled-form/ds-controlled-radio/aria-disabled/DSControlledRadio.aria-disabled.axe-core.func.spec.js

@@ -1,3 +1,4 @@
+import { Key } from 'webdriverio';
 import { axeCoreCheck } from '../../../helpers';
 import DSControlledRadioCO from '../DSControlledRadioCO';
 
@@ -13,10 +14,23 @@ if (
       if (errorOnGo) throw errorOnGo;
     });
     it('01: should display radio with aria-disabled and pass axe-core scann', async () => {
-      const radio = await DSControlledRadioCO.getRadioByIndex(1);
+      const result = await axeCoreCheck();
+      await expect(result).toHaveLength(0);
+    });
+    it('02: should focus and select first radio with aria-disabled and pass axe-core scann', async () => {
+      const radio = await DSControlledRadioCO.getRadioByIndex(0);
       await radio.click();
+      await expect(radio).toBeFocused();
+      await expect(radio).toBeSelected();
+      const result = await axeCoreCheck();
+      await expect(result).toHaveLength(0);
+    });
+    it('03: should focus second radio with aria-disabled and pass axe-core scann', async () => {
+      await browser.keys(Key.ArrowDown);
+      const radio = await DSControlledRadioCO.getRadioByIndex(1);
+      await expect(radio).toBeFocused();
       const result = await axeCoreCheck();
-      expect(result.length).toBe(0);
+      await expect(result).toHaveLength(0);
     });
   });
 }

package/ds-controlled-form/ds-controlled-radio/aria-disabled/DSControlledRadio.aria-disabled.func.spec.js

@@ -0,0 +1,37 @@
+import { Key } from 'webdriverio';
+import DSControlledRadioCO from '../DSControlledRadioCO';
+
+if (
+  !browser.capabilities['ice:options'].isPhone &&
+  !browser.capabilities['ice:options'].isTablet &&
+  (browser.capabilities.browserName === 'Chrome' || browser.capabilities.browserName === 'chrome')
+) {
+  describe('PUI-18777 - DSControlledRadio:: aria-disabled group Tab navigation - Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSControlledRadioCO.applyAriaDisabled.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should focus the checked option when tabbing into the aria-disabled group', async () => {
+      const firstRadio = await DSControlledRadioCO.getRadioByIndex(0);
+      await browser.keys(Key.Tab);
+      await expect(firstRadio).toBeFocused();
+      await expect(firstRadio).toBeSelected();
+    });
+    it('02: should focus the second option when arrow down is pressed', async () => {
+      const secondRadio = await DSControlledRadioCO.getRadioByIndex(1);
+      await browser.keys(Key.ArrowDown);
+      await expect(secondRadio).toBeFocused();
+    });
+
+    it('03: should tab out of the group instead of moving to the next option', async () => {
+      const firstRadio = await DSControlledRadioCO.getRadioByIndex(0);
+      const secondRadio = await DSControlledRadioCO.getRadioByIndex(1);
+      const thirdRadio = await DSControlledRadioCO.getRadioByIndex(2);
+      await browser.keys(Key.Tab);
+      await expect(firstRadio).not.toBeFocused();
+      await expect(secondRadio).not.toBeFocused();
+      await expect(thirdRadio).not.toBeFocused();
+    });
+  });
+}

package/ds-controlled-form/ds-controlled-radio/slots/DSControlledRadio.slots.func.spec.js

@@ -0,0 +1,78 @@
+import DSControlledRadioCO from '../DSControlledRadioCO';
+
+// Slot surface added when the DSControlledRadio label moved to DSTypography under PUI-18774:
+// label-typography, truncated-label, tooltip-container and tooltip-text. The tooltip pair only
+// exists while the label is truncated AND hovered, which is why this lives in E2E rather than in
+// the package's jest slot tests.
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-18975 - DSControlledRadio:: label typography and tooltip slots - Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSControlledRadioCO.slotsTest.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should have custom aria-* for each rendered label slot', async () => {
+      const root = await DSControlledRadioCO.getSlotsRoot();
+      const inputWrapper = await DSControlledRadioCO.getSlotsInputWrapper();
+      const input = await DSControlledRadioCO.getSlotsInput();
+      const label = await DSControlledRadioCO.getSlotsLabel();
+      const labelTypography = await DSControlledRadioCO.getSlotsLabelTypography();
+      const truncatedLabel = await DSControlledRadioCO.getSlotsTruncatedLabel();
+      await expect(root).toHaveAttribute('aria-label', 'root aria');
+      await expect(inputWrapper).toHaveAttribute('aria-label', 'inputwrapper aria');
+      await expect(input).toHaveAttribute('aria-label', 'input aria');
+      await expect(label).toHaveAttribute('aria-label', 'label aria');
+      await expect(labelTypography).toHaveAttribute('aria-label', 'labeltypography aria');
+      await expect(truncatedLabel).toHaveAttribute('aria-label', 'truncatedlabel aria');
+    });
+
+    it('02: should have custom data-* for each rendered label slot', async () => {
+      const root = await DSControlledRadioCO.getSlotsRoot();
+      const inputWrapper = await DSControlledRadioCO.getSlotsInputWrapper();
+      const input = await DSControlledRadioCO.getSlotsInput();
+      const label = await DSControlledRadioCO.getSlotsLabel();
+      const labelTypography = await DSControlledRadioCO.getSlotsLabelTypography();
+      const truncatedLabel = await DSControlledRadioCO.getSlotsTruncatedLabel();
+      await expect(root).toHaveAttribute('data-testid', 'root data');
+      await expect(inputWrapper).toHaveAttribute('data-testid', 'inputwrapper data');
+      await expect(input).toHaveAttribute('data-testid', 'input data');
+      await expect(label).toHaveAttribute('data-testid', 'label data');
+      await expect(labelTypography).toHaveAttribute('data-testid', 'labeltypography data');
+      await expect(truncatedLabel).toHaveAttribute('data-testid', 'truncatedlabel data');
+    });
+
+    it('03: should have custom lang for each rendered label slot', async () => {
+      const root = await DSControlledRadioCO.getSlotsRoot();
+      const inputWrapper = await DSControlledRadioCO.getSlotsInputWrapper();
+      const input = await DSControlledRadioCO.getSlotsInput();
+      const label = await DSControlledRadioCO.getSlotsLabel();
+      const labelTypography = await DSControlledRadioCO.getSlotsLabelTypography();
+      const truncatedLabel = await DSControlledRadioCO.getSlotsTruncatedLabel();
+      await expect(root).toHaveAttribute('lang', 'ja');
+      await expect(inputWrapper).toHaveAttribute('lang', 'it');
+      await expect(input).toHaveAttribute('lang', 'de');
+      await expect(label).toHaveAttribute('lang', 'fr');
+      await expect(labelTypography).toHaveAttribute('lang', 'es');
+      await expect(truncatedLabel).toHaveAttribute('lang', 'pt');
+    });
+
+    it('04: should have custom aria-*, data-* and lang for the tooltip slots on hover', async () => {
+      const truncatedLabel = await DSControlledRadioCO.getSlotsTruncatedLabel();
+      await truncatedLabel.moveTo();
+      const tooltipContainer = await DSControlledRadioCO.getSlotsTooltipContainer();
+      await tooltipContainer.waitForDisplayed();
+      const tooltipText = await DSControlledRadioCO.getSlotsTooltipText();
+      await expect(tooltipContainer).toHaveAttribute('aria-label', 'tooltipcontainer aria');
+      await expect(tooltipContainer).toHaveAttribute('data-testid', 'tooltipcontainer data');
+      await expect(tooltipContainer).toHaveAttribute('lang', 'zh');
+      await expect(tooltipText).toHaveAttribute('aria-label', 'tooltiptext aria');
+      await expect(tooltipText).toHaveAttribute('data-testid', 'tooltiptext data');
+      await expect(tooltipText).toHaveAttribute('lang', 'ru');
+    });
+  });
+}

package/ds-controlled-form/ds-controlled-radio/theme-font/DSControlledRadio.theme-font.func.spec.js

@@ -0,0 +1,30 @@
+import DSControlledRadioCO from '../DSControlledRadioCO';
+
+// Tests the theme-driven font-family mechanism shipped under PUI-18210
+// (the radio label renders through DSTypography, which reads 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-18800 - DSControlledRadio:: theme font-family wiring - Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSControlledRadioCO.themeFontURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should read label font-family from theme with proxima-nova fallback', async () => {
+      const themed = await DSControlledRadioCO.getThemedRadioLabel();
+      await themed.waitForDisplayed();
+      const themedFont = (await themed.getCSSProperty('font-family')).value.toLowerCase();
+      await expect(themedFont).toContain('sentinelfont');
+
+      const fallback = await DSControlledRadioCO.getFallbackRadioLabel();
+      const fallbackFont = (await fallback.getCSSProperty('font-family')).value.toLowerCase();
+      await expect(fallbackFont).toContain('proxima-nova');
+    });
+  });
+}

package/ds-controlled-form/react-hook-form/ReactHook.func.spec.js

@@ -67,9 +67,7 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       const input = await ReactHookCO.getMonthInputsByIndex(2);
       const inputValue = await input.getAttribute('aria-label');
       // eslint-disable-next-line max-len
-      await expect(inputValue).toEqual(
-        'month input field, current values: November, twenty second, 3333, 4, 45, ante meridiem',
-      );
+      await expect(inputValue).toEqual('month');
     });
   });
 }

package/ds-data-table-async/DSDataTableCO.js

@@ -1,5 +1,6 @@
 /* eslint-disable import/no-relative-packages */
 /* eslint-disable max-lines */
+import { Key } from 'webdriverio';
 import {
   PATH_E2E_DATATABLE,
   PATH_E2E_DATATABLE_DND,
@@ -32,6 +33,8 @@ export default class DataTableCO extends PageObject {
 
   static DndColumnsFixedWidth = new Urlbuilder(PATH_E2E_DATATABLE_DND, 'dnd-columns-fixed-width');
 
+  static keyboardDragScroll = new Urlbuilder(PATH_E2E_DATATABLE_DND, 'keyboard-drag-scroll-test');
+
   // Filters
 
   static singleSelect = new Urlbuilder(PATH_E2E_DATATABLE_FILTERS, 'single-select-filter');
@@ -134,6 +137,8 @@ export default class DataTableCO extends PageObject {
 
   static allFiltersV2 = new Urlbuilder(PATH_E2E_DATATABLE_FILTERS_V2, 'all-filters-v-2');
 
+  static pillLabelCustomization = new Urlbuilder(PATH_E2E_DATATABLE_FILTERS_V2, 'pill-label-customization-test');
+
   // ADVANCED
 
   static groupByCol = new Urlbuilder(PATH_E2E_DATATABLE_ADVANCED, 'group-by-column');
@@ -142,12 +147,10 @@ export default class DataTableCO extends PageObject {
 
   static performance = new Urlbuilder(PATH_E2E_DATATABLE_ADVANCED, 'performance');
 
-  static emptyStateFullCustom = new Urlbuilder(PATH_E2E_DATATABLE_ADVANCED, 'empty-state-full-custom');
-
-  static customCellRowHeader = new Urlbuilder(PATH_E2E_DATATABLE_ADVANCED, 'custom-cell-row-and-header');
-
   static responsive = new Urlbuilder(PATH_E2E_DATATABLE_ADVANCED, 'responsive');
 
+  static keyboardScrollIntoView = new Urlbuilder(PATH_E2E_DATATABLE_ADVANCED, 'keyboard-scroll-into-view-test');
+
   // ROW
 
   static selectWithNoControl = new Urlbuilder(PATH_E2E_DATATABLE_ROW, 'select-without-column');
@@ -162,10 +165,15 @@ export default class DataTableCO extends PageObject {
 
   static singleSelectDisabledSelectionUC = new Urlbuilder(PATH_E2E_DATATABLE, 'single-select-disabled-selection');
 
-  static multiSelectDisabledSelectionUC = new Urlbuilder(PATH_E2E_DATATABLE, 'multi-select-disabled-selection');
+  static multiSelectDisabledSelectionUC = new Urlbuilder(PATH_E2E_DATATABLE_ROW, 'multi-select-disabled-selection');
 
   static multiSelectEmpty = new Urlbuilder(PATH_E2E_DATATABLE_ROW, 'multi-select-empty');
 
+  static multiSelectDisabledWithUniqueRowAccessor = new Urlbuilder(
+    PATH_E2E_DATATABLE_ROW,
+    'multi-select-disabled-selection-with-unique-row-accessor',
+  );
+
   // Column
 
   static columnLayout = new Urlbuilder(PATH_E2E_DATATABLE_COLUMN, 'basic-column-layout');
@@ -194,10 +202,18 @@ export default class DataTableCO extends PageObject {
     'grouping-with-hidden-and-resizable-columns',
   );
 
+  // PUI-18812 removed the resizerA11yMode prop, so there is one resizer shape and one story. The
+  // "SeparatorMode" name is historical — kept to avoid churning this URL and every spec using it.
+  static resizerSeparatorMode = new Urlbuilder(PATH_E2E_DATATABLE_COLUMN, 'resizer-separator-mode-test');
+
   // Text Wrapping
 
   static textWrapTruncColumn = new Urlbuilder(PATH_E2E_DATATABLE_TEXT_WRAPPING, 'text-wrap-truncate-column');
 
+  static headerWrapAlignment = new Urlbuilder(PATH_E2E_DATATABLE_TEXT_WRAPPING, 'header-wrap-alignment-test');
+
+  static textWrapGlobalWithToolbar = new Urlbuilder(PATH_E2E_DATATABLE_TEXT_WRAPPING, 'text-wrap-global');
+
   // Toolbar
 
   static toolbarIntegration = new Urlbuilder(PATH_E2E_DATATABLE_TOOLBAR, 'toolbar-integration');
@@ -242,6 +258,8 @@ export default class DataTableCO extends PageObject {
 
   static pui16461SkeletonAndNoResults = new Urlbuilder(PATH_E2E_DATATABLE_STATES, 'pui-16461-skeleton-and-no-results');
 
+  static emptyStateFullCustom = new Urlbuilder(PATH_E2E_DATATABLE_STATES, 'empty-state-full-custom');
+
   // Cell
   static editableCells = new Urlbuilder(PATH_E2E_DATATABLE_CELL, 'editable-cells');
 
@@ -249,6 +267,8 @@ export default class DataTableCO extends PageObject {
 
   static customCellRowAndHeaderTest = new Urlbuilder(PATH_E2E_DATATABLE_CELL, 'custom-cell-row-and-header');
 
+  static toggleCellEnterFocus = new Urlbuilder(PATH_E2E_DATATABLE_CELL, 'toggle-cell-enter-focus-test');
+
   // Use Cases
 
   static integratedExampleWithFilters = new Urlbuilder(PATH_E2E_DATATABLE_USE_CASES, 'integrated-example-with-filters');
@@ -297,11 +317,6 @@ export default class DataTableCO extends PageObject {
 
   // eslint-disable-next-line max-len
 
-  static multiSelectDisabledWithUniqueRowAccessor = new Urlbuilder(
-    PATH_E2E_DATATABLE,
-    'multi-select-disabled-selection-with-unique-row-accessor',
-  );
-
   static resizableWithConstrains = new Urlbuilder(PATH_E2E_DATATABLE, 'pui-8896-resizable-with-constrains');
 
   static memoizedSearchFilterTest = new Urlbuilder(PATH_E2E_DATATABLE, 'pui-12253-memoized-filter-component');
@@ -403,6 +418,10 @@ export default class DataTableCO extends PageObject {
     return $$('[data-testid="ds-button"]')[index];
   }
 
+  static getRowActionResult() {
+    return $('[data-testid="datatable-row-action-result"]');
+  }
+
   static async getSkipToButton() {
     return $(`[id="storybook-root"] button`);
   }
@@ -415,6 +434,164 @@ export default class DataTableCO extends PageObject {
     return $('[data-testid="ds-datatable-empty-state-wrapper"]');
   }
 
+  // PUI-18626 — keyboard scroll-into-view
+
+  static getRows = async () => $$('[data-testid="data-table-row"]');
+
+  static getFirstRow = async () => (await this.getRows())[0];
+
+  static pressArrow = async (direction = 'down', times = 1) => {
+    const key = direction === 'up' ? Key.ArrowUp : Key.ArrowDown;
+    for (let i = 0; i < times; i += 1) {
+      // eslint-disable-next-line no-await-in-loop
+      await browser.keys(key);
+    }
+  };
+
+  /**
+   * Reads live layout to verify the currently focused row is scrolled fully below the sticky
+   * header (not clipped) after keyboard navigation. Returns viewport-relative tops/bottom in px
+   * plus the scroll container scrollTop. Selectors live here (not in the spec) by convention.
+   */
+  static getUpwardNavGeometry = async () =>
+    browser.execute(() => {
+      const rowSel = '[data-testid="data-table-row"], [data-testid="ds-datatable-row"]';
+      const headSel = '[data-testid="ds-datatable-head-wrapper"]';
+      const vwSel = '[data-testid="data-table-scrollable-container"]';
+      const active = document.activeElement;
+      const row = active && active.closest ? active.closest(rowSel) : null;
+      const focused = row || active;
+      const head = document.querySelector(headSel);
+      const vw = document.querySelector(vwSel);
+      return {
+        hasRow: Boolean(row),
+        rowTop: focused ? focused.getBoundingClientRect().top : null,
+        headerBottom: head ? head.getBoundingClientRect().bottom : null,
+        containerTop: vw ? vw.getBoundingClientRect().top : null,
+        scrollTop: vw ? vw.scrollTop : null,
+      };
+    });
+
+  // PUI-15735 — creatable filter aria-activedescendant validity
+
+  /**
+   * Returns the combobox input's aria-activedescendant together with the ids of every option
+   * currently rendered in the listbox, in one round-trip. Valid states are an empty
+   * aria-activedescendant or one whose value appears in optionIds.
+   */
+  static getFilterActiveDescendantState = async () =>
+    browser.execute(() => {
+      const input = document.querySelector('[data-testid="combobox-input"]');
+      const options = Array.from(document.querySelectorAll('[data-testid="combobox-option"]'));
+      return {
+        activeDescendant: input ? input.getAttribute('aria-activedescendant') : null,
+        optionIds: options.map((option) => option.id),
+      };
+    });
+
+  // PUI-8826 — keyboard row drag must not smooth-scroll
+
+  /**
+   * Patches the DOM scroll APIs so every programmatic scroll from this point on records its
+   * `behavior`. dnd-kit calls scrollTo/scrollBy directly on the scroll container's DOM node rather
+   * than through React, so patching the shared prototype captures every call the drag makes.
+   * Install after the story is loaded and before the drag starts.
+   */
+  static installScrollSpy = async () =>
+    browser.execute(() => {
+      window.dimsumScrollCalls = [];
+      ['scrollTo', 'scrollBy'].forEach((methodName) => {
+        const original = Element.prototype[methodName];
+        // A function expression, not an arrow, so `this` stays the scrolled element.
+        Element.prototype[methodName] = function scrollSpy(...args) {
+          const [options] = args;
+          if (options && typeof options === 'object') {
+            window.dimsumScrollCalls.push({ method: methodName, behavior: options.behavior });
+          }
+          return original.apply(this, args);
+        };
+      });
+    });
+
+  static getScrollSpyCalls = async () => browser.execute(() => window.dimsumScrollCalls || []);
+
+  /** Scroll offset of the virtualized viewport — proves the drag actually scrolled the list. */
+  static getScrollableContainerScrollTop = async () =>
+    browser.execute(() => {
+      const container = document.querySelector('[data-testid="data-table-scrollable-container"]');
+      return container ? container.scrollTop : null;
+    });
+
+  /** Id-cell text of whichever row currently owns focus — the dragged row after a keyboard drop. */
+  static getFocusedRowIdCellText = async () =>
+    browser.execute(() => {
+      const active = document.activeElement;
+      const row = active && active.closest ? active.closest('[data-testid="data-table-row"]') : null;
+      const cells = row ? row.querySelectorAll('[data-testid="data-table-cell"]') : [];
+      // Cell 0 is the drag-handle cell; the id column follows it.
+      return cells.length > 1 ? cells[1].textContent.trim() : null;
+    });
+
+  // PUI-17187 — filter popover clamped to the table's own scrollport during horizontal scroll
+
+  /**
+   * Horizontal-scroll geometry of one column, read live instead of hardcoded. Returns the header
+   * cell's offset range inside the scrolled content plus the scrollport's own width, which is what
+   * the two scroll targets are derived from: colLeft - clientWidth + a sliver still leaves the
+   * column partially visible at the left edge, while colRight puts it fully out of view. Fixed-layout
+   * column widths shift with viewport and theme, so a hardcoded scrollLeft would be silently wrong
+   * on another browser or breakpoint.
+   */
+  static getColumnScrollGeometry = async (columnName) =>
+    browser.execute((name) => {
+      const container = document.querySelector('[data-testid="data-table-scrollable-container"]');
+      const headers = Array.from(document.querySelectorAll('[data-testid="data-table-header"]'));
+      const target = headers.find((header) => (header.textContent || '').toLowerCase().includes(name.toLowerCase()));
+      if (!container || !target) return null;
+      // Derived from bounding rects plus the CURRENT scrollLeft, not offsetLeft/offsetWidth:
+      // offsetLeft is measured against the nearest positioned ancestor, which is not guaranteed to
+      // be the scrolled content, so it silently yields the wrong scroll target. This form is exact
+      // regardless of which ancestor happens to be positioned.
+      const targetRect = target.getBoundingClientRect();
+      const containerRect = container.getBoundingClientRect();
+      const colLeft = targetRect.left - containerRect.left + container.scrollLeft;
+      return {
+        colLeft,
+        colRight: colLeft + targetRect.width,
+        clientWidth: container.clientWidth,
+        maxScrollLeft: container.scrollWidth - container.clientWidth,
+      };
+    }, columnName);
+
+  static setScrollableContainerScrollLeft = async (value) =>
+    browser.execute((next) => {
+      const container = document.querySelector('[data-testid="data-table-scrollable-container"]');
+      if (container) container.scrollLeft = next;
+    }, value);
+
+  /**
+   * Popover and scrollport horizontal bounds in one round-trip, so the two rects are always sampled
+   * from the same frame — reading them separately can straddle a reposition and compare a stale
+   * popover x against a fresh container x.
+   */
+  static getFilterPopoverBoundaryRects = async () =>
+    browser.execute(() => {
+      const popover = document.querySelector('[data-testid="data-table-filter-menu-content"]');
+      const container = document.querySelector('[data-testid="data-table-scrollable-container"]');
+      if (!popover || !container) return null;
+      const popoverRect = popover.getBoundingClientRect();
+      const containerRect = container.getBoundingClientRect();
+      const styles = window.getComputedStyle(popover);
+      return {
+        popoverLeft: popoverRect.left,
+        popoverRight: popoverRect.right,
+        containerLeft: containerRect.left,
+        containerRight: containerRect.right,
+        opacity: styles.opacity,
+        pointerEvents: styles.pointerEvents,
+      };
+    });
+
   // Snapshots
   static snapshotPath(example = 'basic') {
     return PageObject.getSnapshotPathBuilder('DataTable', example, 'ds-data-table');

package/ds-data-table-async/basic/DSDataTable.basic.visual.spec.js

@@ -20,7 +20,7 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
   });
   describe('PUI-6988 - DataTable, Custom cell and row header -visual.', async () => {
     before('loading page', async () => {
-      const errorOnGo = await DSDataTableCO.customCellRowHeader.go();
+      const errorOnGo = await DSDataTableCO.customCellRowAndHeaderTest.go();
       if (errorOnGo) throw errorOnGo;
       await DSDataTableCO.waitForDataTable();
     });

package/ds-data-table-async/components/FilterBarCO.js

@@ -70,6 +70,13 @@ export default class FilterBarCO extends PageObject {
 
   static getPillCloseButtonByIndex = async (index) => getElementByIndex(this.getAllPillCloseButtons, index);
 
+  // Label pill wrapper exposes role="group" + aria-label = the pill label text (pillLabel || Header).
+  static getLabelPillByName = async (name) => $(`[role="group"][aria-label="${name}"]`);
+
+  // SVG icon inside a label pill (found by its accessible name) — asserts a custom pill renderer drew
+  // its own icon. The label pill wrapper is the role="group" element; its descendant <svg> is the icon.
+  static getPillIconByName = async (name) => $(`[role="group"][aria-label="${name}"] svg`);
+
   static async getFilterBarDropDownOption(label) {
     return $(`[role=option][label="${label}"]`);
   }

package/ds-data-table-async/components/FiltersCO.js

@@ -145,7 +145,7 @@ export default class FiltersCO extends PageObject {
 
   static getFilterMenuContentSlot = async () => $('[data-dimsum-slot="dsDatatableFilterPopoverContent"]');
 
-  static getFilterPopoverSlot = async () => $('[data-dimsum-slot="dsDatatableFilterPopover"]');
+  static getFilterPopoverSlot = async () => $('[data-dimsum-parent-slot="dsDatatableFilterPopover"]');
 
   static getFreeTextSearchWrapperSlot = async () => $('[data-dimsum-slot="dsDatatableFreeTextSearchWrapper"]');
 

package/ds-data-table-async/components/HeaderCO.js

@@ -51,7 +51,19 @@ export default class HeaderCO extends PageObject {
 
   static getHeadersWrapper = async () => $('[data-testid="ds-datatable-head-wrapper"]');
 
-  static getResizeHandler = async (index) => $$('[data-testid="column"],[aria-label="Resize column"]')[index];
+  // PUI-17784 / PUI-18812 / PUI-18885: the resize handle went <input type="range" aria-label="Resize
+  // column"> -> <button role="application" aria-labelledby> -> back to a native <input type="range">
+  // named with a dynamic aria-label="Resize {column} column". Selecting on data-testid rather than
+  // aria-label is what kept this accessor stable across all of it (the original selector matched
+  // neither data-testid="column" nor the post-PUI-17784 naming).
+  static getResizeHandler = async (index) => $$('[data-testid="ds-datatable-resizer"]')[index];
+
+  static getResizeHandlers = async () => $$('[data-testid="ds-datatable-resizer"]');
+
+  static getLastResizeHandler = async () => {
+    const all = await this.getResizeHandlers();
+    return all[all.length - 1];
+  };
 
   static getFilterBtnByIndex = async (index) => $$('[data-testid="data-table-filter-menu-button"] button')[index];
 
@@ -60,6 +72,30 @@ export default class HeaderCO extends PageObject {
     return headerCell.$('[data-testid="data-table-sort-button"]');
   };
 
+  // Filter icon wrapper scoped to a single header cell. The wrapper span carries the
+  // display:none/opacity:0 "hide" styling driven by the header's hover/focus state (PUI-15154),
+  // so its isDisplayed() reflects filter-icon visibility for that specific column.
+  static getFilterButtonInHeader = async (index) => {
+    const headerCell = await this.getHeaderCellByIndex(index);
+    return headerCell.$('[data-testid="data-table-filter-menu-button"]');
+  };
+
+  // PUI-17786: a11y accessors for the resize handle. Targets the same [data-testid="ds-datatable-resizer"]
+  // as the getResizeHandler selector fix (separate PR); kept distinct so these a11y specs run standalone.
+  static getResizer = async (index) => $$('[data-testid="ds-datatable-resizer"]')[index];
+
+  // PUI-18885 removed getResizerLabelledByText: the resizer is named with aria-label directly, so
+  // there is no aria-labelledby reference left to resolve. Read the attribute in the spec and use
+  // getResizerComputedName below for what the browser actually computes.
+
+  /**
+   * The accessible name the BROWSER computes for the resizer, via the W3C WebDriver
+   * "Get Computed Label" endpoint — the accname algorithm's real output, not a re-implementation.
+   * Only meaningful while the handle is exposed: at rest it is aria-hidden, so it is outside the
+   * accessibility tree and has no computed name by design.
+   */
+  static getResizerComputedName = async (resizer) => resizer.getComputedLabel();
+
   // Snapshots
   static snapshotPath(example = 'basic') {
     return PageObject.getSnapshotPathBuilder('DataTable', example, 'ds-data-table');

package/ds-data-table-async/dnd/DSDataTable.dnd-keyboard-scroll.func.spec.js

@@ -0,0 +1,51 @@
+import { Key } from 'webdriverio';
+import DSDataTableCO from '../DSDataTableCO';
+import { RowCO } from '../components';
+
+// Tests for the fix introduced in PUI-8826. Holding ArrowDown during a keyboard row drag fired
+// dnd-kit's default smooth scroll on every key-repeat keydown, re-targeting the in-flight scroll
+// animation before it settled — this read as the dragged row "flickering". The fix pins the
+// KeyboardSensor to scrollBehavior: 'auto', so repeated keydowns produce instant jumps instead.
+const REPEATED_PRESSES = 15;
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-18883 - DSDataTable:: keyboard row drag scroll on held ArrowDown - Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSDataTableCO.keyboardDragScroll.go();
+      if (errorOnGo) throw errorOnGo;
+      await DSDataTableCO.waitForDataTable();
+      await DSDataTableCO.installScrollSpy();
+    });
+    it('01: the drag survives a burst of ArrowDown presses', async () => {
+      const dragHandle = await RowCO.getRowDragHlandlerByIndex(0);
+      await dragHandle.click();
+      await browser.keys(Key.Space);
+      await expect(dragHandle).toHaveAttribute('aria-pressed', 'true');
+
+      await DSDataTableCO.pressArrow('down', REPEATED_PRESSES);
+      // Still picked up and still holding focus — the repeat burst neither dropped the row nor
+      // stole focus mid-scroll.
+      await expect(dragHandle).toHaveAttribute('aria-pressed', 'true');
+      await expect(dragHandle).toBeFocused();
+    });
+    it('02: the burst scrolled the viewport and never used behavior "smooth"', async () => {
+      // Sanity first: a 200px viewport over 40 rows means the drag must have scrolled. Without
+      // this the behavior assertion below could pass without exercising the fix at all.
+      const scrollTop = await DSDataTableCO.getScrollableContainerScrollTop();
+      await expect(scrollTop).toBeGreaterThan(0);
+
+      const scrollCalls = await DSDataTableCO.getScrollSpyCalls();
+      await expect(scrollCalls.length).toBeGreaterThan(0);
+      await expect(scrollCalls.every((call) => call.behavior === 'auto')).toBe(true);
+    });
+    it('03: dropping with Space reorders the list and keeps the dragged row focused', async () => {
+      await browser.keys(Key.Space);
+      await expect(await DSDataTableCO.getFocusedRowIdCellText()).toBe('1');
+    });
+  });
+}