dimsum-e2e-tests 3.80.0-next.42 → 3.80.0-next.44

package/ds-leftnavigation/LeftNavigation.func.spec.js

@@ -129,3 +129,41 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
     });
   });
 }
+
+// DOM-attribute contract: identical in every browser, so it runs on Chrome only
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  // Tests for the compliance remediation introduced in PUI-19115 (named slots, new data-testids)
+  describe('PUI-19280 - LeftNavigation:: truncated label and open window icon testids - Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await LeftNavCO.fullFeatures.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should keep ds-icon-root on open window icons', async () => {
+      await (await LeftNavCO.leftNavItem(0)).click();
+      await browser.waitUntil(async () => (await LeftNavCO.getOpenWindowIconTestIds()).length > 0, {
+        timeoutMsg: 'expected open window icons to be rendered after opening the first item',
+      });
+      const testIds = await LeftNavCO.getOpenWindowIconTestIds();
+      await expect(testIds.every((testId) => testId === 'ds-icon-root')).toBe(true);
+    });
+    it('02: should show the tooltip testid only while hovering a truncated label', async () => {
+      await (await LeftNavCO.leftNavItem(0)).click();
+      const truncItem = await LeftNavCO.getTruncatedText(0);
+      await truncItem.waitForDisplayed();
+      const truncatedTexts = await LeftNavCO.getTruncatedLabelTexts();
+      await expect(truncatedTexts[0]).toBe('Exception-1 Truncated Content');
+      await expect(await LeftNavCO.getTruncatedLabelTooltip()).not.toBeExisting();
+      await mouseOver(truncItem);
+      const tooltip = await LeftNavCO.getTruncatedLabelTooltip();
+      await tooltip.waitForDisplayed();
+      await expect(tooltip).toHaveText('Exception-1 Truncated Content');
+      await mouseOver(null, 0, 0);
+      await expect(await LeftNavCO.getTruncatedLabelTooltip()).not.toBeExisting();
+    });
+  });
+}

package/ds-leftnavigation/LeftNavigationCO.js

@@ -78,6 +78,26 @@ export default class LeftNavCO extends PageObject {
     return $('[data-testid="ds-floating-wrapper-root"]');
   }
 
+  static async getTruncatedLabelTexts() {
+    return browser.execute(() =>
+      [...document.querySelectorAll('[data-testid="ds-leftnavigation-truncated-label"]')].map((el) =>
+        el.textContent.trim(),
+      ),
+    );
+  }
+
+  static async getTruncatedLabelTooltip() {
+    return $('[data-testid="ds-leftnavigation-truncated-label-tooltip"]');
+  }
+
+  static async getOpenWindowIconTestIds() {
+    return browser.execute(() =>
+      [...document.querySelectorAll('[data-dimsum-parent-slot="dsLeftnavigationOpenWindowIcon"]')].map(
+        (el) => el.dataset.testid,
+      ),
+    );
+  }
+
   static async getSubItemBtn() {
     return $('[data-testid="sub-item-button"]');
   }

package/ds-menu-button/DSMenuButtonCO.js

@@ -3,15 +3,15 @@ import { PageObject, Urlbuilder } from '../helpers';
 
 export default class DSMenuButtonCO extends PageObject {
   // Current supported examples: POC
-  static activableMenuItem = new Urlbuilder(PATH_E2E_MENU_BUTTON, 'activable-menu-item');
+  static activableMenuItem = new Urlbuilder(PATH_E2E_MENU_BUTTON, 'activable-menu-item-test');
 
-  static multipleSelectMenuItem = new Urlbuilder(PATH_E2E_MENU_BUTTON, 'multiple-select-menu-item');
+  static multipleSelectMenuItem = new Urlbuilder(PATH_E2E_MENU_BUTTON, 'multiple-select-menu-item-test');
 
   static nextTabstopTest = new Urlbuilder(PATH_E2E_MENU_BUTTON, 'next-tabstop-test');
 
-  static singleSelectMenuItem = new Urlbuilder(PATH_E2E_MENU_BUTTON, 'single-select-menu-item');
+  static singleSelectMenuItem = new Urlbuilder(PATH_E2E_MENU_BUTTON, 'single-select-menu-item-test');
 
-  static withSubmenuMenuItem = new Urlbuilder(PATH_E2E_MENU_BUTTON, 'with-submenu-menu-item');
+  static withSubmenuMenuItem = new Urlbuilder(PATH_E2E_MENU_BUTTON, 'with-submenu-menu-item-test');
 
   static withDisabled = new Urlbuilder(PATH_E2E_MENU_BUTTON, 'disabled-items-test');
 

package/ds-query-builder/DSQueryBuilderCO.js

@@ -7,8 +7,6 @@ export default class DSQueryBuilderCO extends PageObject {
 
   static inModalURL = new Urlbuilder(PATH_E2E_QUERY_BUILDER, 'pui-5837-in-modal');
 
-  static advancedDependencies = new Urlbuilder(PATH_QUERY_BUILDER, 'advanced-dependencies');
-
   static arrayConditionsURL = new Urlbuilder(PATH_QUERY_BUILDER, 'advanced-dependencies-array');
 
   static fieldDateRangePicker = new Urlbuilder(PATH_QUERY_BUILDER, 'field-date-range-picker');

package/ds-svg/DSSvgCO.js

@@ -2,15 +2,15 @@ import { PATH_E2E_SVG } from '../paths';
 import { PageObject, Urlbuilder } from '../helpers';
 
 export default class DSSvgCO extends PageObject {
-  static basic = new Urlbuilder(PATH_E2E_SVG, 'basic');
+  static basic = new Urlbuilder(PATH_E2E_SVG, 'basic-test');
 
-  static sizes = new Urlbuilder(PATH_E2E_SVG, 'sizes');
+  static sizes = new Urlbuilder(PATH_E2E_SVG, 'sizes-test');
 
-  static dimensions = new Urlbuilder(PATH_E2E_SVG, 'dimensions');
+  static dimensions = new Urlbuilder(PATH_E2E_SVG, 'dimensions-test');
 
-  static insideInteractive = new Urlbuilder(PATH_E2E_SVG, 'inside-interactive-element');
+  static insideInteractive = new Urlbuilder(PATH_E2E_SVG, 'inside-interactive-element-test');
 
-  static withTooltip = new Urlbuilder(PATH_E2E_SVG, 'with-tooltip');
+  static withTooltip = new Urlbuilder(PATH_E2E_SVG, 'with-tooltip-test');
 
   // Selectors
   static async getWrapper() {

package/ds-tabs/DSTabs.visual.spec.js

@@ -80,7 +80,9 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       const snapshot = await browser.checkSnapshot(DSTabsCO.snapshotPath('tab-grid-default'));
       await expect(snapshot).toEqual(0);
     });
-    it('should display tabs with a grid moved one tablist to the right', async () => {
+    // Percy intermittently never completes this snapshot (any browser, only when run alongside other snapshots), marks
+    // the whole build as failed and rejects every later snapshot. Re-enable once Percy support resolves it.
+    it.skip('should display tabs with a grid moved one tablist to the right', async () => {
       // const tab1 = await DSTabsCO.getTab(1);
       // await tab1.click();
       const tab2 = await DSTabsCO.getTab(2);

package/ds-toast/DSToast.visual.spec.js

@@ -153,12 +153,16 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       const bottomLeftBtn = await DSToastCO.openToastPositionBtn('bottom-left');
       const bottomCenterBtn = await DSToastCO.openToastPositionBtn('bottom-center');
       const bottomRightBtn = await DSToastCO.openToastPositionBtn('bottom-right');
-      await topLeftBtn.click();
-      await topCenterBtn.click();
-      await topRigthBtn.click();
+      // Click order matters: all six triggers sit within y 0-88, and the top-* toast containers
+      // render over y 13-97 with autoClose disabled. Clicking the top row first covers the bottom
+      // row and WebDriver rejects the click as intercepted. Bottom row first keeps every trigger
+      // clickable (bottom containers sit at y 983-1067) and yields the same final state.
       await bottomLeftBtn.click();
       await bottomCenterBtn.click();
       await bottomRightBtn.click();
+      await topLeftBtn.click();
+      await topCenterBtn.click();
+      await topRigthBtn.click();
       await browser.pause(2000);
       const topLeftToast = await DSToastCO.getToastByPosition('top-left');
       const topCenterToast = await DSToastCO.getToastByPosition('top-center');

package/ds-toast/DSToastCO.js

@@ -13,7 +13,7 @@ export default class DSToastCO extends PageObject {
 
   static longTextURL = new Urlbuilder(PATH_E2E_TOAST, 'long-text-test');
 
-  static longTextWithLinkURL = new Urlbuilder(PATH_E2E_TOAST, 'long-text-with-link');
+  static longTextWithLinkURL = new Urlbuilder(PATH_E2E_TOAST, 'long-text-with-link-test');
 
   static multipleToastURL = new Urlbuilder(PATH_E2E_TOAST, 'multiple-toast-test');
 

package/ds-treeview/DSTreeViewCO.js

@@ -17,7 +17,7 @@ export const knobs = {
 export default class DSTreeViewCO extends PageObject {
   static basicUrl = new Urlbuilder(PATH_TREEVIEW, 'basic');
 
-  static compactURL = new Urlbuilder(PATH_TREEVIEW, 'compact');
+  static compactURL = new Urlbuilder(PATH_TREEVIEW, 'compact-view');
 
   static fluidHeightURL = new Urlbuilder(PATH_TREEVIEW, 'fluid-height');
 

package/ds-typography/DSTypographyCO.js

@@ -3,13 +3,13 @@ import { PageObject, Urlbuilder, getElementByIndex } from '../helpers';
 
 export default class DSTypographyCO extends PageObject {
   // Desktop
-  static cardURL = new Urlbuilder(PATH_E2E_TYPOGRAPHY, 'card');
+  static cardURL = new Urlbuilder(PATH_E2E_TYPOGRAPHY, 'card-read-more');
 
-  static formURl = new Urlbuilder(PATH_E2E_TYPOGRAPHY, 'form');
+  static formURl = new Urlbuilder(PATH_E2E_TYPOGRAPHY, 'form-test');
 
-  static dialogURL = new Urlbuilder(PATH_E2E_TYPOGRAPHY, 'dialog');
+  static dialogURL = new Urlbuilder(PATH_E2E_TYPOGRAPHY, 'dialog-test');
 
-  static showcaseURL = new Urlbuilder(PATH_E2E_TYPOGRAPHY, 'show-case');
+  static showcaseURL = new Urlbuilder(PATH_E2E_TYPOGRAPHY, 'show-case-test');
 
   static truncationURL = new Urlbuilder(PATH_E2E_TYPOGRAPHY, 'truncation-test');
 

package/helpers.js

@@ -402,66 +402,54 @@ export async function getLocationByDataTestId(dataTest, index) {
   return result;
 }
 
+// Inset from the element's top/bottom edge for the scrollbar click. Classic Windows scrollbars
+// render an arrow button (~17px) at each end: clicking it scrolls a single line, while clicking the
+// track scrolls a full page. Clearing the arrow is what makes a click page instead of nudge.
+const SCROLLBAR_ARROW_INSET = 30;
+
 /**
- * Simulates clicks on the scrollbar of an element to scroll its content.
+ * Simulates clicks on the scrollbar track of an element to page its content.
  *
- * For "down" direction, it clicks near the bottom of the element; for "up",
- * it clicks near the top. A pause is added between pointerDown and pointerUp
- * to simulate a more realistic click.
+ * For "down" direction it clicks the track near the bottom of the element; for "up", near the top.
+ * Both are inset far enough to clear the scrollbar's arrow buttons. A pause is added between
+ * pointerDown and pointerUp to simulate a more realistic click.
  *
- * @param {string|object} element - Element or selector for the element containing the scrollbar.
+ * @param {string|object} element - Element or selector for the element that scrolls (the one with
+ *   overflow-y: auto/scroll, not an inner content wrapper).
  * @param {string} direction - Scroll direction: 'up' or 'down' (default: 'down').
  * @param {number} clicks - Number of clicks to simulate (default: 1).
  */
 export async function clickScrollBar(element, direction = 'down', clicks = 1) {
-  // If 'element' is a string, treat it as a selector.
-  let elem = typeof element === 'string' ? await $(element) : element;
-  if (!elem) {
-    throw new Error('Element not found.');
+  if (direction !== 'up' && direction !== 'down') {
+    throw new Error("Invalid direction: choose 'up' or 'down'");
   }
 
-  // Get viewport dimensions to clamp coordinates.
-  const viewport = await browser.getWindowSize();
+  // Page viewport, not browser.getWindowSize(): the latter reports the outer window, which includes
+  // the titlebar and toolbar, so clamping against it can yield a y below the page and make
+  // performActions fail with "move target out of bounds".
+  const viewport = await browser.execute(() => ({ width: window.innerWidth, height: window.innerHeight }));
 
-  // Loop to simulate each click.
   for (let i = 0; i < clicks; i++) {
-    // Re-fetch the element's current bounding rect.
-    let rect;
-    if (typeof elem.getRect === 'function') {
-      rect = await elem.getRect();
-    } else {
-      rect = await browser.execute((el) => {
-        const r = el.getBoundingClientRect();
-        return { x: r.x, y: r.y, width: r.width, height: r.height };
-      }, elem);
+    // Re-resolve on every iteration. Virtualized and portalled scrollers re-render between clicks,
+    // and a cached element reference would raise "stale element reference".
+    const elem = typeof element === 'string' ? await $(element) : element;
+    if (!(await elem.isExisting())) {
+      throw new Error(`clickScrollBar: element no longer exists on click ${i + 1} of ${clicks}.`);
     }
 
-    // Define element's vertical limits (with a margin of 5px).
-    const topLimit = Math.round(rect.y + 5);
-    const bottomLimit = Math.round(rect.y + rect.height - 5);
-    // Calculate x-coordinate: 5px from the right edge.
-    let xCoord = Math.round(rect.x + rect.width - 5);
-    xCoord = Math.max(0, Math.min(xCoord, viewport.width - 1));
-
-    let yCoord;
-    if (direction === 'down') {
-      // Para scroll down: queremos hacer click en el área inferior.
-      // Se puede calcular un offset en función del número de click.
-      yCoord = bottomLimit - i * 5; // Ajusta el valor (por ejemplo, 5px) según sea necesario.
-    } else if (direction === 'up') {
-      // Para scroll up: click en el área superior.
-      yCoord = topLimit + i * 5; // Ajusta el valor (por ejemplo, 5px) según sea necesario.
-    } else {
-      throw new Error("Invalid direction: choose 'up' or 'down'");
-    }
-    // Asegurarse de que yCoord esté dentro de los límites del elemento.
-    if (direction === 'down') {
-      yCoord = Math.min(yCoord, bottomLimit);
-    } else {
-      yCoord = Math.max(yCoord, topLimit);
-    }
-    // Clamp yCoord within viewport.
-    yCoord = Math.max(0, Math.min(yCoord, viewport.height - 1));
+    const rect = await browser.execute((el) => {
+      const r = el.getBoundingClientRect();
+      return { x: r.x, y: r.y, width: r.width, height: r.height };
+    }, elem);
+
+    // x: inside the scrollbar band, 5px from the right edge.
+    const xCoord = Math.max(0, Math.min(Math.round(rect.x + rect.width - 5), viewport.width - 1));
+
+    const inset = Math.min(SCROLLBAR_ARROW_INSET, Math.max(1, Math.round(rect.height / 2) - 1));
+    const rawY = direction === 'down' ? rect.y + rect.height - inset : rect.y + inset;
+    // Keep the point inside the element, then inside the viewport.
+    const boundedY = Math.min(Math.max(Math.round(rawY), Math.round(rect.y) + 1), Math.round(rect.y + rect.height) - 1);
+    const yCoord = Math.max(0, Math.min(boundedY, viewport.height - 1));
 
     // Perform the click action with a pause to simulate a more realistic manual click.
     await browser.performActions([