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

package/ds-chat/components/TileCO.js

@@ -0,0 +1,82 @@
+import { PATH_E2E_CHAT, PATH_E2E_CHAT_TILE } from '../../paths';
+import { PageObject, Urlbuilder } from '../../helpers';
+
+export default class TileCO extends PageObject {
+  static tilesURL = new Urlbuilder(PATH_E2E_CHAT, 'tile');
+
+  static sidebarURL = new Urlbuilder(PATH_E2E_CHAT, 'sidebar');
+
+  static applyAriaDisabledURL = new Urlbuilder(PATH_E2E_CHAT_TILE, 'apply-aria-disabled-test');
+
+  static slotsTestURL = new Urlbuilder(PATH_E2E_CHAT_TILE, 'slots-test');
+
+  static async getChatTile(tileId) {
+    return $(`[data-testid="tile-button-${tileId}"]`);
+  }
+
+  static async getChatTileButtonItem(tileId) {
+    return $(`[data-testid="tile-button-item-id-${tileId}"]`);
+  }
+
+  static async getSideBarSelectedTile() {
+    return $(`[data-testid="selected-tile"]`).getText();
+  }
+
+  static async getTileTooltip(id) {
+    return $(`[data-testid="ds-tooltip-v3-trigger-wrapper_ds-chat-tile-tooltip-button-item-id-${id}"]`);
+  }
+
+  static async getCounter() {
+    return $('[data-testid="counter"]');
+  }
+
+  static async getTileBadge(tileId) {
+    return $(`[data-testid="tile-badge-${tileId}"]`);
+  }
+
+  static async getTileCloseButton(tileId) {
+    return $(`[data-testid="tile-close-btn-${tileId}"]`);
+  }
+
+  // Slot selectors (used by slots func spec — one tile per story)
+  static async getRootSlot() {
+    return $('[data-dimsum-slot="dsChattilebuttonRoot"]');
+  }
+
+  static async getTooltipWrapperSlot() {
+    return $('[data-dimsum-slot="dsChattilebuttonTooltipWrapper"]');
+  }
+
+  static async getWrapperSlot() {
+    return $('[data-dimsum-slot="dsChattilebuttonWrapper"]');
+  }
+
+  static async getLeftBorderSlot() {
+    return $('[data-dimsum-slot="dsChattilebuttonLeftBorder"]');
+  }
+
+  static async getCentralContentSlot() {
+    return $('[data-dimsum-slot="dsChattilebuttonCentralContent"]');
+  }
+
+  static async getIconSlot() {
+    return $('[data-dimsum-slot="dsChattilebuttonIcon"]');
+  }
+
+  static async getLabelSlot() {
+    return $('[data-dimsum-slot="dsChattilebuttonLabel"]');
+  }
+
+  static async getBadgeSlot() {
+    return $('[data-dimsum-slot="dsChattilebuttonBadge"]');
+  }
+
+  static async getCloseButtonSlot() {
+    return $('[data-dimsum-slot="dsChattilebuttonCloseButton"]');
+  }
+
+  // Snapshots
+  static snapshotPath(example = 'basic') {
+    return PageObject.getSnapshotPathBuilder('Tile', example, 'ds-chat');
+  }
+}

package/ds-chat/components/index.js

@@ -1,8 +1,9 @@
 import BubbleCO from './BubbleCO';
+import CardCO from './CardCO';
 import FloatingButtonCO from './FloatingButtonCO';
-import TileCO from '../../ds-chat-tile/TileCO';
+import TileCO from './TileCO';
 import HeaderCO from './HeaderCO';
 import ComposerCO from './ComposerCO';
 import ChatCO from '../DSChatCO';
 import StoryBtnsCO from './StoryBtnsCO';
-export { BubbleCO, FloatingButtonCO, TileCO, HeaderCO, ComposerCO, ChatCO, StoryBtnsCO };
+export { BubbleCO, CardCO, FloatingButtonCO, TileCO, HeaderCO, ComposerCO, ChatCO, StoryBtnsCO };

package/ds-chat/floatingbutton/DSChat-floating-button.visual.spec.js

@@ -5,7 +5,7 @@ import { mouseOver, keyboardActions, tickActions, performKeyboardAction } from '
 if (!browser.capabilities['ice:options'].isPhone) {
   describe('PUI-6669 - Chat, Floating Button, States - Visual Tests', () => {
     beforeEach('loading page', async () => {
-      const errorOnGo = await FloatingButtonCO.floatingButtonURL.go();
+      const errorOnGo = await FloatingButtonCO.floatingExampleURL.go();
       if (errorOnGo) throw errorOnGo;
     });
     it('should display the floating button in default state', async () => {

package/ds-chat/loadmore/DSChat-loadmore.func.spec.js

@@ -21,7 +21,7 @@ if (!browser.capabilities['ice:options'].isPhone) {
       await browser.pause(2000);
       const howManyMsgs = (await DSChatCO.getBubbleContainers()).length;
       await expect(howManyMsgs).toEqual(20);
-      await expect(bubble0).toBeDisplayedInViewport();
+      await expect(bubble0).toBeDisplayed();
     });
   });
 }

package/{ds-chat-tile → ds-chat/tile}/DSChat-tile.axe-core.func.spec.js

@@ -1,6 +1,6 @@
 import { Key } from 'webdriverio';
-import { axeCoreCheck } from '../helpers';
-import TileCO from './TileCO';
+import { axeCoreCheck } from '../../helpers';
+import { TileCO } from '../components';
 
 if (
   (!browser.capabilities['ice:options'].isPhone &&

package/{ds-chat-tile → ds-chat/tile}/DSChat-tile.func.spec.js

@@ -1,5 +1,5 @@
 import { Key } from 'webdriverio';
-import TileCO from './TileCO';
+import { TileCO } from '../components';
 
 if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
   describe('PUI-6684 - Chat, Tile, Keyboard Navigation', () => {

package/{ds-chat-tile → ds-chat/tile}/DSChat-tile.visual.spec.js

@@ -1,6 +1,6 @@
 import { Key } from 'webdriverio';
-import TileCO from './TileCO';
-import { mouseOver, keyboardActions, tickActions, performKeyboardAction } from '../helpers';
+import { TileCO } from '../components';
+import { mouseOver, keyboardActions, tickActions, performKeyboardAction } from '../../helpers';
 
 if (!browser.capabilities['ice:options'].isPhone) {
   describe('PUI-6674 - Chat, Tile, Visual Tests', () => {

package/{ds-chat-tile → ds-chat/tile}/aria-disabled/DSChat-tile.aria-disabled.axe-core.func.spec.js

@@ -1,5 +1,5 @@
-import { axeCoreCheck } from '../../helpers';
-import TileCO from '../TileCO';
+import { axeCoreCheck } from '../../../helpers';
+import { TileCO } from '../../components';
 
 if (
   (!browser.capabilities['ice:options'].isPhone &&

package/{ds-chat-tile → ds-chat/tile}/aria-disabled/DSChat-tile.aria-disabled.visual.spec.js

@@ -1,6 +1,6 @@
 /* eslint-disable max-len */
 import { Key } from 'webdriverio';
-import TileCO from '../TileCO';
+import { TileCO } from '../../components';
 
 if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
   describe('PUI-14368 - [Tile] applyAriaDisabled prop - visual Test', () => {

package/ds-chat/tile/slots/DSChatTile.slots.func.spec.js

@@ -0,0 +1,53 @@
+// Tests for PUI-17908 (ds-chat-tile slots implementation)
+import { TileCO } from '../../components';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-18465 - DSChatTile:: slot wiring - Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await TileCO.slotsTestURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should have custom aria-* for each slot', async () => {
+      await (await TileCO.getRootSlot()).waitForDisplayed();
+      await expect(await TileCO.getRootSlot()).toHaveAttribute('aria-label', 'root aria');
+      await expect(await TileCO.getTooltipWrapperSlot()).toHaveAttribute('aria-label', 'tooltip-wrapper aria');
+      await expect(await TileCO.getWrapperSlot()).toHaveAttribute('aria-label', 'wrapper aria');
+      await expect(await TileCO.getLeftBorderSlot()).toHaveAttribute('aria-label', 'left-border aria');
+      await expect(await TileCO.getCentralContentSlot()).toHaveAttribute('aria-label', 'central-content aria');
+      await expect(await TileCO.getIconSlot()).toHaveAttribute('aria-label', 'icon aria');
+      await expect(await TileCO.getLabelSlot()).toHaveAttribute('aria-label', 'label aria');
+      await expect(await TileCO.getBadgeSlot()).toHaveAttribute('aria-label', 'badge aria');
+      await expect(await TileCO.getCloseButtonSlot()).toHaveAttribute('aria-label', 'close-button aria');
+    });
+
+    it('02: should have custom data-testid for each slot', async () => {
+      await expect(await TileCO.getRootSlot()).toHaveAttribute('data-testid', 'root data');
+      await expect(await TileCO.getTooltipWrapperSlot()).toHaveAttribute('data-testid', 'tooltip-wrapper data');
+      await expect(await TileCO.getWrapperSlot()).toHaveAttribute('data-testid', 'wrapper data');
+      await expect(await TileCO.getLeftBorderSlot()).toHaveAttribute('data-testid', 'left-border data');
+      await expect(await TileCO.getCentralContentSlot()).toHaveAttribute('data-testid', 'central-content data');
+      await expect(await TileCO.getIconSlot()).toHaveAttribute('data-testid', 'icon data');
+      await expect(await TileCO.getLabelSlot()).toHaveAttribute('data-testid', 'label data');
+      await expect(await TileCO.getBadgeSlot()).toHaveAttribute('data-testid', 'badge data');
+      await expect(await TileCO.getCloseButtonSlot()).toHaveAttribute('data-testid', 'close-button data');
+    });
+
+    it('03: should have custom lang for each slot', async () => {
+      await expect(await TileCO.getRootSlot()).toHaveAttribute('lang', 'pt');
+      await expect(await TileCO.getTooltipWrapperSlot()).toHaveAttribute('lang', 'es');
+      await expect(await TileCO.getWrapperSlot()).toHaveAttribute('lang', 'de');
+      await expect(await TileCO.getLeftBorderSlot()).toHaveAttribute('lang', 'en');
+      await expect(await TileCO.getCentralContentSlot()).toHaveAttribute('lang', 'fr');
+      await expect(await TileCO.getIconSlot()).toHaveAttribute('lang', 'it');
+      await expect(await TileCO.getLabelSlot()).toHaveAttribute('lang', 'nl');
+      await expect(await TileCO.getBadgeSlot()).toHaveAttribute('lang', 'sv');
+      await expect(await TileCO.getCloseButtonSlot()).toHaveAttribute('lang', 'ja');
+    });
+  });
+}

package/ds-chat/tile/slots/DSChatTile.slots.visual.spec.js

@@ -0,0 +1,18 @@
+// Tests for PUI-17908 (ds-chat-tile slots implementation)
+import { TileCO } from '../../components';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-18464 - DSChatTile:: slot variants - Visual', () => {
+    before(async () => {
+      const errorOnGo = await TileCO.slotsTestURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should display all tile slot variants', async () => {
+      const firstTile = await TileCO.getRootSlot();
+      await firstTile.waitForDisplayed();
+      const snapshot = await browser.percyCheckScreenshot(TileCO.snapshotPath('tile-slot-variants'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/ds-controlled-form/ds-combobox/DSComboboxCO.js

@@ -134,7 +134,7 @@ export default class DSComboboxCO extends PageObject {
   }
 
   static async getSimpleTruncateText() {
-    return $('[data-testid="DS-SimpleTruncateText"]');
+    return $('[data-testid="combobox-selected-values"]');
   }
 
   static async getNumberOptions() {
@@ -183,7 +183,7 @@ export default class DSComboboxCO extends PageObject {
   }
 
   static async getTooltip() {
-    return $('[data-testid="popover-container"]');
+    return $('[data-testid="ds-floating-wrapper-root"]');
   }
 
   // actions

package/ds-controlled-form/ds-combobox/creatable/DSCombobox.creatable-tooltip.func.spec.js

@@ -0,0 +1,47 @@
+import { Key } from 'webdriverio';
+import DSComboboxCO from '../DSComboboxCO';
+import { mouseOver } from '../../../helpers';
+
+const longText =
+  'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore ' +
+  'magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo.';
+
+// Tests for the fix introduced in PUI-16693 (ComboboxMulti suppresses the inaccessible
+// truncated-pill tooltip via the disableTruncationTooltip flag; the full value stays
+// readable from the list box). Hovering a truncated selected pill must NOT open a tooltip.
+// The open menu renders its own ds-floating-wrapper-root, so it is closed before asserting.
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-18659 - ComboboxV3:: truncated selected pill tooltip suppression - func', () => {
+    before('loading page and creating a truncated pill', async () => {
+      const errorOnGo = await DSComboboxCO.multiSelectCreatable.go();
+      if (errorOnGo) throw errorOnGo;
+
+      const combobox = await DSComboboxCO.getComboboxInput();
+      await combobox.setValue(longText);
+
+      const optionCreated = await DSComboboxCO.getOptionByIndex(0);
+      await optionCreated.click();
+
+      // close the menu so its FloatingWrapper (shares ds-floating-wrapper-root) is gone
+      await browser.keys(Key.Escape);
+      const menuList = await DSComboboxCO.getMenuList();
+      await menuList.waitForDisplayed({ reverse: true });
+    });
+
+    it('01: should not render a tooltip wrapper for the truncated selected pill', async () => {
+      const pill = await DSComboboxCO.getSelectedValues();
+      await expect(pill).toBeDisplayed();
+
+      const tooltip = await DSComboboxCO.getTooltip();
+      await expect(tooltip).not.toBeExisting();
+    });
+
+    it('02: should not open a tooltip when hovering the truncated pill', async () => {
+      const pill = await DSComboboxCO.getSimpleTruncateText();
+      await mouseOver(pill);
+
+      const tooltip = await DSComboboxCO.getTooltip();
+      await expect(tooltip).not.toBeExisting();
+    });
+  });
+}

package/ds-controlled-form/ds-combobox/creatable/DSCombobox.creatable.visual.spec.js

@@ -2,7 +2,7 @@
 /* eslint-disable max-len */
 /* eslint-disable max-lines */
 import DSComboboxCO from '../DSComboboxCO';
-import { type, mouseOver } from '../../../helpers';
+import { type } from '../../../helpers';
 
 if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
   describe('PUI-8449 - ComboboxV3:: Multi Select Creatable - basic - visual', () => {
@@ -28,30 +28,21 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       );
       await expect(snapshot).toEqual(0);
     });
-    // Defect PUI-16693 has been created to track this issue
-    it.skip('03: display tooltip for new option created', async () => {
+    // PUI-16693 (tooltip suppression on truncated pills) is now fixed; these creatable
+    // snapshots are reactivated. The tooltip-absence behavior is covered separately in
+    // DSCombobox.creatable-tooltip.func.spec.js.
+    it('03: should create and display a second long option in the menu', async () => {
       await browser.eyesOpen();
-      const pill = await DSComboboxCO.getSimpleTruncateText();
-      await mouseOver(pill);
-      const tooltip = await DSComboboxCO.getTooltip();
-      await tooltip.waitForDisplayed();
-      const snapshot = await browser.eyesCheckSnapshot(
-        DSComboboxCO.snapshotPath('comboboxV3-createable-option-created-tooltip'),
-      );
-      await expect(snapshot).toEqual(0);
-    });
-    // Defect PUI-16693 has been created to track this issue
-    it.skip('04: create a new long option', async () => {
-      await browser.eyesOpen();
-      const pill = await DSComboboxCO.getSelectedValues();
-      await mouseOver(pill, 400, 0);
-      const longText = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit';
-      await type(longText);
+      // the input keeps focus and the menu stays open after selecting in test 02, so type
+      // directly — clicking the input is intercepted by the overlapping aria-hidden input.
+      const secondLongText = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit';
+      await type(secondLongText);
+      const menuList = await DSComboboxCO.getMenuList();
+      await menuList.waitForDisplayed();
       const snapshot = await browser.eyesCheckSnapshot(DSComboboxCO.snapshotPath('comboboxV3-createable--new-option'));
       await expect(snapshot).toEqual(0);
     });
-    // Defect PUI-16693 has been created to track this issue
-    it.skip('05: should select new option', async () => {
+    it('04: should select the second created option', async () => {
       await browser.eyesOpen();
       const optionCreated = await DSComboboxCO.getOptionByIndex(0);
       await optionCreated.click();

package/ds-controlled-form/ds-combobox/disabled/DSCombobox.disabled.visual.spec.js

@@ -14,7 +14,12 @@ if (!browser.capabilities['ice:options'].isPhone) {
       await expect(snapshot).toEqual(0);
     });
     if (!browser.capabilities['ice:options'].isTablet) {
-      it('should display tooltip when hover truncated pill', async () => {
+      // SKIPPED pending PUI-18660 (defect): the PUI-16693 fix applies disableTruncationTooltip
+      // to every ComboboxMulti selected pill, including disabled/readOnly pills. In the disabled
+      // state the menu cannot be opened, so suppressing the tooltip leaves the truncated value
+      // inaccessible. Re-enable (asserting tooltip presence) once the flag is scoped to
+      // interactive pills only.
+      it.skip('should display tooltip when hover truncated pill', async () => {
         const truncatedPill = await DSComboboxCO.getPillByLabel('Luke Skywalker too long this text is super long');
         await mouseOver(truncatedPill, 20, 5);
         const tooltip = await DSComboboxCO.getTooltip();

package/ds-controlled-form/ds-controlled-checkbox/Basic/DSControlledCheckbox.axe-core.basic.func.spec.js

@@ -19,24 +19,24 @@ if (
       const checkbox = await DSControlledCheckboxCO.getCustomCheckbox();
       await checkbox.waitForExist();
       const result = await axeCoreCheck();
-      expect(result.length).toBe(0);
+      await expect(result).toHaveLength(0);
     });
     it('02: Evaluate checkbox accessibility with axe-core (focused)', async () => {
       await browser.keys(Key.Tab);
       const result = await axeCoreCheck();
-      expect(result.length).toBe(0);
+      await expect(result).toHaveLength(0);
     });
     it('03: Evaluate checkbox accessibility with axe-core (hovered)', async () => {
       const checkbox = await DSControlledCheckboxCO.getCustomCheckbox();
       await mouseOver(checkbox);
       const result = await axeCoreCheck();
-      expect(result.length).toBe(0);
+      await expect(result).toHaveLength(0);
     });
     it('04: Evaluate checkbox accessibility with axe-core (clicked)', async () => {
       const checkbox = await DSControlledCheckboxCO.getCustomCheckbox();
       await checkbox.click();
       const result = await axeCoreCheck();
-      expect(result.length).toBe(0);
+      await expect(result).toHaveLength(0);
     });
   });
 }

package/ds-controlled-form/ds-controlled-checkbox/Basic/DSControlledCheckbox.basic.visual.spec.js

@@ -0,0 +1,56 @@
+import { Key } from 'webdriverio';
+import { mouseOver } from '../../../helpers';
+import DSControlledCheckboxCO from '../DSControlledCheckboxCO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-18822 - DSControlledCheckbox: update to latest spec and typography- visual test', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSControlledCheckboxCO.basicURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01:  the checked checkbox is not focused', async () => {
+      const checkbox = await DSControlledCheckboxCO.getCustomCheckbox();
+      await checkbox.waitForExist();
+      const snapshot = await browser.percyCheckScreenshot();
+      await expect(snapshot).toEqual(0);
+    });
+
+    it('02: checkbox hover even when checked', async () => {
+      const controlBox = await DSControlledCheckboxCO.getCheckboxInputWrapper();
+      await controlBox.moveTo();
+      const snapshot = await browser.percyCheckScreenshot();
+      await expect(snapshot).toEqual(0);
+    });
+
+    it('03:  the checked checkbox is focused', async () => {
+      await browser.keys(Key.Tab);
+      const checkbox = await DSControlledCheckboxCO.getCustomCheckbox();
+      await expect(checkbox).toBeFocused();
+      const snapshot = await browser.percyCheckScreenshot();
+      await expect(snapshot).toEqual(0);
+    });
+
+    it('04: checkbox is focused but unchecked', async () => {
+      await browser.keys(Key.Space);
+      const checkbox = await DSControlledCheckboxCO.getCustomCheckbox();
+      await expect(checkbox).toBeFocused();
+      const snapshot = await browser.percyCheckScreenshot();
+      await expect(snapshot).toEqual(0);
+    });
+
+    it('05: checkbox not focused, not hovered when unchecked', async () => {
+      await browser.keys(Key.Tab);
+      await mouseOver(null, 400, 300);
+      const snapshot = await browser.percyCheckScreenshot();
+      await expect(snapshot).toEqual(0);
+    });
+
+    it('06: checkbox hover even when unchecked', async () => {
+      const controlBox = await DSControlledCheckboxCO.getCheckboxInputWrapper();
+      await controlBox.moveTo();
+      const snapshot = await browser.percyCheckScreenshot();
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/ds-controlled-form/ds-controlled-checkbox/DSControlledCheckboxCO.js

@@ -23,10 +23,16 @@ export default class DSControlledCheckboxCO extends PageObject {
 
   static applyAriaDisabled = new Urlbuilder(PATH_E2E_CHECKBOX, 'apply-aria-disabled-test');
 
+  static themeFontURL = new Urlbuilder(PATH_E2E_CHECKBOX, 'theme-font-family-test');
+
   static async getCheckbox() {
     return $('[data-testid="ds-checkbox"]');
   }
 
+  static async getCheckboxInputWrapper() {
+    return $('[data-testid="ds-checkbox-input-wrapper"]');
+  }
+
   static async getCustomCheckbox() {
     return $('[data-testid="custom-data-testid"]');
   }
@@ -58,7 +64,7 @@ export default class DSControlledCheckboxCO extends PageObject {
   static getCheckboxByIndex = async (index) => getElementByIndex(this.getCheckboxes, index);
 
   static async getCheckboxLabels() {
-    return $$('[data-testid="DS-SimpleTruncateText"]');
+    return $$('[data-testid="ds-checkbox-label"]');
   }
 
   static getCheckboxLabelByIndex = async (index) => getElementByIndex(this.getCheckboxLabels, index);
@@ -66,4 +72,12 @@ export default class DSControlledCheckboxCO extends PageObject {
   static snapshotPath(example = 'basic') {
     return PageObject.getSnapshotPathBuilder('DSControlledCheckbox', example, 'ds-controlled-checkbox');
   }
+
+  static async getThemedCheckboxLabel() {
+    return $('[data-testid="theme-font-sentinel"] [data-testid="ds-checkbox-label-typography"]');
+  }
+
+  static async getFallbackCheckboxLabel() {
+    return $('[data-testid="theme-font-fallback"] [data-testid="ds-checkbox-label-typography"]');
+  }
 }

package/ds-controlled-form/ds-controlled-checkbox/Disabled/DSControlledCheckbox.axe-core.disabled.func.spec.js

@@ -18,7 +18,7 @@ if (
       const checkbox = await DSControlledCheckboxCO.getCheckboxByIndex(0);
       await checkbox.waitForExist();
       const result = await axeCoreCheck();
-      expect(result.length).toBe(0);
+      await expect(result).toHaveLength(0);
     });
   });
 }

package/ds-controlled-form/ds-controlled-checkbox/Disabled/DSControlledCheckbox.disabled.visual.spec.js

@@ -11,7 +11,7 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       const checkbox = await DSControlledCheckboxCO.getCheckboxByLabel('Group');
       await checkbox.waitForDisplayed();
       await browser.keys(Key.Tab);
-      const snapshot = await browser.checkSnapshot(DSControlledCheckboxCO.snapshotPath('checkbox-disabled'));
+      const snapshot = await browser.percyCheckScreenshot();
       await expect(snapshot).toEqual(0);
     });
   });

package/ds-controlled-form/ds-controlled-checkbox/HasError/DSControlledCheckbox.axe-core.hasError.func.spec.js

@@ -19,24 +19,24 @@ if (
       const checkbox = await DSControlledCheckboxCO.getCheckboxByIndex(0);
       await checkbox.waitForExist();
       const result = await axeCoreCheck();
-      expect(result.length).toBe(0);
+      await expect(result).toHaveLength(0);
     });
     it('02: Evaluate checkbox accessibility with axe-core (focused)', async () => {
       await browser.keys(Key.Tab);
       const result = await axeCoreCheck();
-      expect(result.length).toBe(0);
+      await expect(result).toHaveLength(0);
     });
     it('03: Evaluate checkbox accessibility with axe-core (hovered)', async () => {
       const checkbox = await DSControlledCheckboxCO.getCheckboxByIndex(0);
       await mouseOver(checkbox);
       const result = await axeCoreCheck();
-      expect(result.length).toBe(0);
+      await expect(result).toHaveLength(0);
     });
     it('04: Evaluate checkbox accessibility with axe-core (clicked)', async () => {
       const checkbox = await DSControlledCheckboxCO.getCheckboxByIndex(1);
       await checkbox.click();
       const result = await axeCoreCheck();
-      expect(result.length).toBe(0);
+      await expect(result).toHaveLength(0);
     });
   });
 }

package/ds-controlled-form/ds-controlled-checkbox/HasError/DSControlledCheckbox.has-error.visual.spec.js

@@ -1,3 +1,4 @@
+import { Key } from 'webdriverio';
 import { mouseOver } from '../../../helpers';
 import DSControlledCheckboxCO from '../DSControlledCheckboxCO';
 
@@ -13,7 +14,76 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       await checkbox1.click();
       await checkbox1.click();
       await mouseOver(checkbox2);
-      const snapshot = await browser.checkSnapshot(DSControlledCheckboxCO.snapshotPath('checkbox-hasError'));
+      const snapshot = await browser.percyCheckScreenshot();
+      await expect(snapshot).toEqual(0);
+    });
+  });
+
+  describe('PUI-18849 - DSControlledCheckbox - hasError - Visual Test', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSControlledCheckboxCO.hasError.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01:  the partial selected checkbox is not focused', async () => {
+      const checkbox = await DSControlledCheckboxCO.getCheckboxByIndex(0);
+      await checkbox.waitForExist();
+      const snapshot = await browser.percyCheckScreenshot();
+      await expect(snapshot).toEqual(0);
+    });
+
+    it('02: checkbox hover even when partial selected', async () => {
+      const controlBox = await DSControlledCheckboxCO.getCheckboxByIndex(0);
+      await controlBox.moveTo();
+      const snapshot = await browser.percyCheckScreenshot();
+      await expect(snapshot).toEqual(0);
+    });
+
+    it('03:  the partial selected checkbox is focused', async () => {
+      await browser.keys(Key.Tab);
+      const checkbox = await DSControlledCheckboxCO.getCheckboxByIndex(0);
+      await expect(checkbox).toBeFocused();
+      const snapshot = await browser.percyCheckScreenshot();
+      await expect(snapshot).toEqual(0);
+    });
+
+    it('04: checkbox is focused but not selected', async () => {
+      await browser.keys(Key.Space);
+      await browser.keys(Key.Space);
+      const checkbox = await DSControlledCheckboxCO.getCheckboxByIndex(0);
+      await expect(checkbox).toBeFocused();
+      const snapshot = await browser.percyCheckScreenshot();
+      await expect(snapshot).toEqual(0);
+    });
+
+    it('05: checkbox not focused, not hovered when not selected', async () => {
+      await browser.keys(Key.Tab);
+      await mouseOver(null, 400, 300);
+      const snapshot = await browser.percyCheckScreenshot();
+      await expect(snapshot).toEqual(0);
+    });
+
+    it('06: checkbox hover even when not selected', async () => {
+      const controlBox = await DSControlledCheckboxCO.getCheckboxByIndex(0);
+      await controlBox.moveTo();
+      const snapshot = await browser.percyCheckScreenshot();
+      await expect(snapshot).toEqual(0);
+    });
+    it('07: the selected checkbox is focused', async () => {
+      await browser.keys(Key.Tab);
+      await browser.keys(Key.Space);
+      const controlBox = await DSControlledCheckboxCO.getCheckboxByIndex(0);
+      await mouseOver(controlBox);
+      const checkbox = await DSControlledCheckboxCO.getCheckboxByIndex(2);
+      await expect(checkbox).toBeFocused();
+      const snapshot = await browser.percyCheckScreenshot();
+      await expect(snapshot).toEqual(0);
+    });
+    it('08: the selected checkbox is hovered', async () => {
+      await browser.keys(Key.Tab);
+      const checkbox = await DSControlledCheckboxCO.getCheckboxByIndex(2);
+      await mouseOver(checkbox);
+      const snapshot = await browser.percyCheckScreenshot();
       await expect(snapshot).toEqual(0);
     });
   });