dimsum-e2e-tests 1.0.36 → 1.2.0

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);
     });
   });

package/ds-controlled-form/ds-controlled-checkbox/Mixed/DSControlledCheckbox.axe-core.mixed.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(2);
       await checkbox.click();
       const result = await axeCoreCheck();
-      expect(result.length).toBe(0);
+      await expect(result).toHaveLength(0);
     });
   });
 }

package/ds-controlled-form/ds-controlled-checkbox/Mixed/DSControlledCheckbox.mixed.func.spec.js

@@ -1,6 +1,4 @@
 /* eslint-disable max-lines */
-/* eslint-disable wdio/no-pause */
-import { Key } from 'webdriverio';
 import DSControlledCheckboxCO from '../DSControlledCheckboxCO';
 
 if (
@@ -13,11 +11,18 @@ if (
       const errorOnGo = await DSControlledCheckboxCO.mixed.go();
       if (errorOnGo) throw errorOnGo;
     });
-    it('should have custom data-testid for group container', async () => {
-      const checkboxGroup = await DSControlledCheckboxCO.getCheckboxGroup();
-      await expect(checkboxGroup).toBeDisplayed();
-    });
-    it('should check all the checkboxes when checking the global one', async () => {
+    if (
+      (!browser.capabilities['ice:options'].isPhone &&
+        !browser.capabilities['ice:options'].isTablet &&
+        browser.capabilities.browserName === 'chrome') ||
+      browser.capabilities.browserName === 'Chrome'
+    ) {
+      it('01: Should have a custom data-testid for the group container', async () => {
+        const checkboxGroup = await DSControlledCheckboxCO.getCheckboxGroup();
+        await expect(checkboxGroup).toBeDisplayed();
+      });
+    }
+    it('02: Should check all checkboxes when the global checkbox is selected', async () => {
       const globalCheckbox = await DSControlledCheckboxCO.getCheckboxByIndex(0);
       await globalCheckbox.click();
       const checkedCheckbox = await DSControlledCheckboxCO.isChecked(globalCheckbox);
@@ -29,7 +34,7 @@ if (
       await expect(checkedCheckbox2).toBe(true);
       await expect(checkedCheckbox3).toBe(true);
     });
-    it('should uncheck all the checkboxes when unchecking the global one', async () => {
+    it('03: Should uncheck all checkboxes when the global checkbox is deselected', async () => {
       const globalCheckbox = await DSControlledCheckboxCO.getCheckboxByIndex(0);
       await globalCheckbox.click();
       await globalCheckbox.click();
@@ -42,48 +47,25 @@ if (
       await expect(checkedCheckbox2).toBe(false);
       await expect(checkedCheckbox3).toBe(false);
     });
-    it('should check the global checkbox when checking all the others', async () => {
+    it('04: Should check the global checkbox when all other checkboxes are selected', async () => {
       const checkbox = await DSControlledCheckboxCO.getCheckboxByIndex(2);
       await checkbox.click();
       const checkedCheckbox = await DSControlledCheckboxCO.isChecked(checkbox);
       await expect(checkedCheckbox).toBe(true);
     });
-    it('should uncheck the global checkbox when unchecking all the others', async () => {
+    it('05: Should uncheck the global checkbox when all other checkboxes are deselected', async () => {
       const checkbox = await DSControlledCheckboxCO.getCheckboxByIndex(1);
       await checkbox.click();
       const checkedCheckbox = await DSControlledCheckboxCO.isChecked(checkbox);
       await expect(checkedCheckbox).toBe(false);
     });
-  });
-  describe('PUI-8649 - DSControlledCheckbox:: Keyboard behavior global checkbox', () => {
-    before('loading page', async () => {
-      const errorOnGo = await DSControlledCheckboxCO.mixed.go();
-      if (errorOnGo) throw errorOnGo;
-    });
-    it('should check all the checkboxes when checking the global one', async () => {
-      await browser.keys(Key.Tab);
-      await browser.keys(Key.Space);
+    it('06: Should check and focus the global checkbox when label is clicked', async () => {
       const globalCheckbox = await DSControlledCheckboxCO.getCheckboxByIndex(0);
+      const checkboxLabel = await DSControlledCheckboxCO.getCheckboxByLabel('All Condiments');
+      await checkboxLabel.click();
       const checkedCheckbox = await DSControlledCheckboxCO.isChecked(globalCheckbox);
-      const checkbox2 = await DSControlledCheckboxCO.getCheckboxByIndex(1);
-      const checkedCheckbox2 = await DSControlledCheckboxCO.isChecked(checkbox2);
-      const checkbox3 = await DSControlledCheckboxCO.getCheckboxByIndex(2);
-      const checkedCheckbox3 = await DSControlledCheckboxCO.isChecked(checkbox3);
+      await expect(globalCheckbox).toBeFocused(true);
       await expect(checkedCheckbox).toBe(true);
-      await expect(checkedCheckbox2).toBe(true);
-      await expect(checkedCheckbox3).toBe(true);
-    });
-    it('should uncheck all the checkboxes when unchecking the global one', async () => {
-      await browser.keys(Key.Space);
-      const globalCheckbox = await DSControlledCheckboxCO.getCheckboxByIndex(0);
-      const checkedCheckbox = await DSControlledCheckboxCO.isChecked(globalCheckbox);
-      const checkbox2 = await DSControlledCheckboxCO.getCheckboxByIndex(1);
-      const checkedCheckbox2 = await DSControlledCheckboxCO.isChecked(checkbox2);
-      const checkbox3 = await DSControlledCheckboxCO.getCheckboxByIndex(2);
-      const checkedCheckbox3 = await DSControlledCheckboxCO.isChecked(checkbox3);
-      await expect(checkedCheckbox).toBe(false);
-      await expect(checkedCheckbox2).toBe(false);
-      await expect(checkedCheckbox3).toBe(false);
     });
   });
 }

package/ds-controlled-form/ds-controlled-checkbox/Mixed/DSControlledCheckbox.mixed.keyboard-nav.func.spec.js

@@ -0,0 +1,51 @@
+/* eslint-disable max-lines */
+/* eslint-disable wdio/no-pause */
+import { Key } from 'webdriverio';
+import DSControlledCheckboxCO from '../DSControlledCheckboxCO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-8649 - DSControlledCheckbox:: Mixed - Keyboard navigation', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSControlledCheckboxCO.mixed.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: Should check all checkboxes when the global checkbox is selected', async () => {
+      await browser.keys(Key.Tab);
+      await browser.keys(Key.Space);
+      const globalCheckbox = await DSControlledCheckboxCO.getCheckboxByIndex(0);
+      const checkedCheckbox = await DSControlledCheckboxCO.isChecked(globalCheckbox);
+      const checkbox2 = await DSControlledCheckboxCO.getCheckboxByIndex(1);
+      const checkedCheckbox2 = await DSControlledCheckboxCO.isChecked(checkbox2);
+      const checkbox3 = await DSControlledCheckboxCO.getCheckboxByIndex(2);
+      const checkedCheckbox3 = await DSControlledCheckboxCO.isChecked(checkbox3);
+      await expect(checkedCheckbox).toBe(true);
+      await expect(checkedCheckbox2).toBe(true);
+      await expect(checkedCheckbox3).toBe(true);
+    });
+    it('02: Should uncheck all checkboxes when the global checkbox is deselected.', async () => {
+      await browser.keys(Key.Space);
+      const globalCheckbox = await DSControlledCheckboxCO.getCheckboxByIndex(0);
+      const checkedCheckbox = await DSControlledCheckboxCO.isChecked(globalCheckbox);
+      const checkbox2 = await DSControlledCheckboxCO.getCheckboxByIndex(1);
+      const checkedCheckbox2 = await DSControlledCheckboxCO.isChecked(checkbox2);
+      const checkbox3 = await DSControlledCheckboxCO.getCheckboxByIndex(2);
+      const checkedCheckbox3 = await DSControlledCheckboxCO.isChecked(checkbox3);
+      await expect(checkedCheckbox).toBe(false);
+      await expect(checkedCheckbox2).toBe(false);
+      await expect(checkedCheckbox3).toBe(false);
+    });
+    it('03: Should check the 2nd checkbox, and the global checkbox should reflect a mixed state', async () => {
+      await browser.keys(Key.Tab);
+      await browser.keys(Key.Return);
+      const globalCheckbox = await DSControlledCheckboxCO.getCheckboxByIndex(0);
+      const checkedCheckbox = await globalCheckbox.getProperty('checked');
+      const checkbox2 = await DSControlledCheckboxCO.getCheckboxByIndex(1);
+      const checkedCheckbox2 = await DSControlledCheckboxCO.isChecked(checkbox2);
+      const checkbox3 = await DSControlledCheckboxCO.getCheckboxByIndex(2);
+      const checkedCheckbox3 = await DSControlledCheckboxCO.isChecked(checkbox3);
+      await expect(checkedCheckbox).toBe('mixed');
+      await expect(checkedCheckbox2).toBe(true);
+      await expect(checkedCheckbox3).toBe(false);
+    });
+  });
+}

package/ds-controlled-form/ds-controlled-checkbox/Mixed/DSControlledCheckbox.mixed.visual.spec.js

@@ -1,20 +1,18 @@
 import { mouseOver } from '../../../helpers';
 import DSControlledCheckboxCO from '../DSControlledCheckboxCO';
 
-if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
-  describe('PUI-7100 - DSControlledCheckbox - Visual Test - mixed', () => {
-    before('loading page', async () => {
-      const errorOnGo = await DSControlledCheckboxCO.mixed.go();
-      if (errorOnGo) throw errorOnGo;
-    });
-    it('should display checkbox mixed styles correctly', async () => {
-      const checkbox1 = await DSControlledCheckboxCO.getCheckboxByIndex(1);
-      const checkbox2 = await DSControlledCheckboxCO.getCheckboxByIndex(2);
-      await checkbox1.click();
-      await checkbox1.click();
-      await mouseOver(checkbox2);
-      const snapshot = await browser.checkSnapshot(DSControlledCheckboxCO.snapshotPath('checkbox-mixed'));
-      await expect(snapshot).toEqual(0);
-    });
+describe('PUI-7100 - DSControlledCheckbox - Visual Test - mixed', () => {
+  before('loading page', async () => {
+    const errorOnGo = await DSControlledCheckboxCO.mixed.go();
+    if (errorOnGo) throw errorOnGo;
   });
-}
+  it('should display checkbox mixed styles correctly', async () => {
+    const checkbox1 = await DSControlledCheckboxCO.getCheckboxByIndex(1);
+    const checkbox2 = await DSControlledCheckboxCO.getCheckboxByIndex(2);
+    await checkbox1.click();
+    await checkbox1.click();
+    await mouseOver(checkbox2);
+    const snapshot = await browser.percyCheckScreenshot();
+    await expect(snapshot).toEqual(0);
+  });
+});

package/ds-controlled-form/ds-controlled-checkbox/ReadOnly/DSControlledCheckbox.axe-core.read-only.func.spec.js

@@ -17,18 +17,18 @@ 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);
     });
   });
 }

package/ds-controlled-form/ds-controlled-checkbox/ReadOnly/DSControlledCheckbox.read-only.visual.spec.js

@@ -14,7 +14,7 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       await checkbox1.click();
       await checkbox1.click();
       await mouseOver(checkbox2);
-      const snapshot = await browser.eyesCheckSnapshot(DSControlledCheckboxCO.snapshotPath('checkbox-readOnly'));
+      const snapshot = await browser.percyCheckScreenshot();
       await expect(snapshot).toEqual(0);
     });
   });

package/ds-controlled-form/ds-controlled-checkbox/WithTooltip/DSControlledCheckbox.axe-core.with-tooltip.func.spec.js

@@ -16,7 +16,7 @@ if (
       const checkboxLabel = await DSControlledCheckboxCO.getCheckboxLabelByIndex(4);
       await mouseOver(checkboxLabel);
       const result = await axeCoreCheck();
-      expect(result.length).toBe(0);
+      await expect(result).toHaveLength(0);
     });
   });
 }

package/ds-controlled-form/ds-controlled-checkbox/WithTooltip/DSControlledCheckbox.with-tooltip.visual.spec.js

@@ -11,9 +11,7 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       await browser.eyesOpen();
       const checkboxLabel = await DSControlledCheckboxCO.getCheckboxLabelByIndex(4);
       await mouseOver(checkboxLabel);
-      const snapshot = await browser.eyesCheckSnapshot(
-        DSControlledCheckboxCO.snapshotPath('checkbox-tooltip-longword'),
-      );
+      const snapshot = await browser.percyCheckScreenshot();
       await expect(snapshot).toEqual(0);
     });
   });

package/ds-controlled-form/ds-controlled-checkbox/WrapLabel/DSControlledCheckbox.axe-core.wrap-label.func.spec.js

@@ -16,7 +16,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/WrapLabel/DSControlledCheckbox.wrap-label.visual.spec.js

@@ -10,7 +10,7 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       await browser.eyesOpen();
       const checkbox = await DSControlledCheckboxCO.getCheckboxByIndex(1);
       await checkbox.waitForExist();
-      const snapshot = await browser.eyesCheckSnapshot(DSControlledCheckboxCO.snapshotPath('checkbox-wrapped'));
+      const snapshot = await browser.percyCheckScreenshot();
       await expect(snapshot).toEqual(0);
     });
   });

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

@@ -0,0 +1,25 @@
+import { Key } from 'webdriverio';
+import DSControlledCheckboxCO from '../DSControlledCheckboxCO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-14379 - [ControlledCheckbox] applyAriaDisabled prop - visual Test', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSControlledCheckboxCO.applyAriaDisabled.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: The first aria-disabled checkbox should be focused - click', async () => {
+      await browser.eyesOpen();
+      const firstcheckbox = await DSControlledCheckboxCO.getCheckboxByIndex(0);
+      await firstcheckbox.click();
+      const snapshot = await browser.percyCheckScreenshot();
+      await expect(snapshot).toEqual(0);
+    });
+    it('02: The second aria-disabled checkbox should be focused - KB nav', async () => {
+      await browser.eyesOpen();
+      await browser.keys(Key.Tab);
+      await browser.keys(Key.Enter);
+      const snapshot = await browser.percyCheckScreenshot();
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

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

@@ -0,0 +1,24 @@
+/* eslint-disable max-lines */
+/* eslint-disable wdio/no-pause */
+import DSControlledCheckboxCO from '../DSControlledCheckboxCO';
+import { axeCoreCheck } from '../../../helpers';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-14378 - [ControlledCheckbox] Disabled: Axe Core Accessibility', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSControlledCheckboxCO.applyAriaDisabled.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should display checkbox with aria-disabled and pass axe-core scan', async () => {
+      const checkbox = await DSControlledCheckboxCO.getCheckboxByIndex(1);
+      await checkbox.click();
+      const result = await axeCoreCheck();
+      await expect(result).toHaveLength(0);
+    });
+  });
+}

package/ds-controlled-form/ds-controlled-checkbox/slots/DSControlledCheckbox.slots.func.spec.js

@@ -0,0 +1,78 @@
+import DSControlledCheckboxCO from '../DSControlledCheckboxCO';
+
+// Slot surface added when the DSControlledCheckbox 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-18976 - DSControlledCheckbox:: label typography and tooltip slots - Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSControlledCheckboxCO.slotsTest.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should have custom aria-* for each rendered label slot', async () => {
+      const root = await DSControlledCheckboxCO.getSlotsRoot();
+      const inputWrapper = await DSControlledCheckboxCO.getSlotsInputWrapper();
+      const input = await DSControlledCheckboxCO.getSlotsInput();
+      const label = await DSControlledCheckboxCO.getSlotsLabel();
+      const labelTypography = await DSControlledCheckboxCO.getSlotsLabelTypography();
+      const truncatedLabel = await DSControlledCheckboxCO.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 DSControlledCheckboxCO.getSlotsRoot();
+      const inputWrapper = await DSControlledCheckboxCO.getSlotsInputWrapper();
+      const input = await DSControlledCheckboxCO.getSlotsInput();
+      const label = await DSControlledCheckboxCO.getSlotsLabel();
+      const labelTypography = await DSControlledCheckboxCO.getSlotsLabelTypography();
+      const truncatedLabel = await DSControlledCheckboxCO.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 DSControlledCheckboxCO.getSlotsRoot();
+      const inputWrapper = await DSControlledCheckboxCO.getSlotsInputWrapper();
+      const input = await DSControlledCheckboxCO.getSlotsInput();
+      const label = await DSControlledCheckboxCO.getSlotsLabel();
+      const labelTypography = await DSControlledCheckboxCO.getSlotsLabelTypography();
+      const truncatedLabel = await DSControlledCheckboxCO.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 DSControlledCheckboxCO.getSlotsTruncatedLabel();
+      await truncatedLabel.moveTo();
+      const tooltipContainer = await DSControlledCheckboxCO.getSlotsTooltipContainer();
+      await tooltipContainer.waitForDisplayed();
+      const tooltipText = await DSControlledCheckboxCO.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-checkbox/theme-font/DSControlledCheckbox.theme-font.func.spec.js

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

package/ds-controlled-form/ds-controlled-inputgroup/DSControlledInputGroupCO.js

@@ -2,15 +2,15 @@ import { PATH_E2E_CONTROLLED_FORM_INPUT_GROUP } from '../../../environments/stor
 import { PageObject, Urlbuilder, getElementByIndex } from '../../helpers';
 
 export default class DSControlledInputGroupCO extends PageObject {
-  static basicURL = new Urlbuilder(PATH_E2E_CONTROLLED_FORM_INPUT_GROUP, 'basic');
+  static basicURL = new Urlbuilder(PATH_E2E_CONTROLLED_FORM_INPUT_GROUP, 'basic-test');
 
-  static protectedURL = new Urlbuilder(PATH_E2E_CONTROLLED_FORM_INPUT_GROUP, 'protected-input');
+  static protectedURL = new Urlbuilder(PATH_E2E_CONTROLLED_FORM_INPUT_GROUP, 'protected-input-test');
 
-  static autocompleteURL = new Urlbuilder(PATH_E2E_CONTROLLED_FORM_INPUT_GROUP, 'with-auto-complete');
+  static autocompleteURL = new Urlbuilder(PATH_E2E_CONTROLLED_FORM_INPUT_GROUP, 'with-auto-complete-test');
 
-  static comboboxURL = new Urlbuilder(PATH_E2E_CONTROLLED_FORM_INPUT_GROUP, 'with-combobox');
+  static comboboxURL = new Urlbuilder(PATH_E2E_CONTROLLED_FORM_INPUT_GROUP, 'with-combobox-test');
 
-  static formitemURL = new Urlbuilder(PATH_E2E_CONTROLLED_FORM_INPUT_GROUP, 'with-form-item-layout');
+  static formitemURL = new Urlbuilder(PATH_E2E_CONTROLLED_FORM_INPUT_GROUP, 'with-form-item-layout-test');
 
   static async getButton() {
     return $('[data-testid="ds-button"]');
@@ -22,28 +22,14 @@ export default class DSControlledInputGroupCO extends PageObject {
 
   static getButtonByIndex = async (index) => getElementByIndex(this.getButtons, index);
 
-  static async getInput() {
-    return $('[data-testid="ds-input-text-input"]');
-  }
-
-  static async getInputValue(value) {
-    return $(`[data-testid="ds-input-text-input"][value="${value}"]`);
-  }
-
-  static async getInputs() {
-    return $$('[data-testid="ds-input-text-input"]');
-  }
-
-  static getInputByIndex = async (index) => getElementByIndex(this.getInputs, index);
-
   static getRightAddons() {
-    return $$('[data-testid="ds-button-right-addon"]');
+    return $$('[data-testid="ds-input-group-right-addon"]');
   }
 
   static getRightAddOnByIndex = async (index) => getElementByIndex(this.getRightAddons, index);
 
   static getLeftAddons() {
-    return $$('[data-testid="ds-button-left-addon"]');
+    return $$('[data-testid="ds-input-group-left-addon"]');
   }
 
   static getLeftAddOnByIndex = async (index) => getElementByIndex(this.getLeftAddons, index);