dimsum-e2e-tests 3.57.0-next.2 → 3.57.0-next.22

package/ds-form-combobox-single/slots/DSComboboxSingle.slots.visual.spec.js

@@ -0,0 +1,53 @@
+/* eslint-disable max-lines */
+import DSComboboxSingleCO from '../DSComboboxSingleCO';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-17270 - ComboboxSingle:: Slots - Controlled Menu and Sections -Visual', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSComboboxSingleCO.controlledMenuStateWithSectionsSlotsTest.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should display basic combobox single with customized slots', async () => {
+      await browser.eyesOpen();
+      const combobox = await DSComboboxSingleCO.getComboboxRootSlot();
+      await combobox.waitForDisplayed();
+      const snapshot = await browser.eyesCheckSnapshot(DSComboboxSingleCO.snapshotPath('combo-single-slots-basic'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+
+  describe('PUI-17271 - ComboboxSingle:: Slots - Loading Indicator -Visual', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSComboboxSingleCO.loadingIndicatorSlotsTest.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should display combobox single with loading indicator with customized slots', async () => {
+      await browser.eyesOpen();
+      const combobox = await DSComboboxSingleCO.getComboboxRootSlot();
+      await combobox.click();
+      const snapshot = await browser.eyesCheckSnapshot(
+        DSComboboxSingleCO.snapshotPath('combo-single-slots-loading-indicator'),
+      );
+      await expect(snapshot).toEqual(0);
+    });
+  });
+
+  describe('PUI-17273 - ComboboxSingle:: Slots - Skeleton -Visual', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSComboboxSingleCO.skeletonSlotsTest.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should display basic combobox single with skeleton with customized slots', async () => {
+      await browser.eyesOpen();
+      const combobox = await DSComboboxSingleCO.getComboboxRootSlot();
+      await combobox.click();
+      const snapshot = await browser.eyesCheckSnapshot(DSComboboxSingleCO.snapshotPath('combo-single-slots-skeleton'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/ds-form-layout-blocks/form-layout-block-item/DSFormLayoutBlockItem.axe-core.func.spec.js

@@ -142,10 +142,13 @@ if (
       const result = await axeCoreCheck();
       expect(result.length).toBe(0);
     });
-    it('02: should have required attribute for required formLayoutBlock label', async () => {
+    it('02: should have required attribute and aria-hidden for required formLayoutBlock label', async () => {
       const formLayout = await DSFormLayoutBlockItemCO.getBlockContainersByIndex(0);
       await formLayout.waitForDisplayed();
+      const star = await DSFormLayoutBlockItemCO.getRequiredStarFromindex();
+      const ariaHidden = await star.getAttribute('aria-hidden');
       const isRequired = await formLayout.getAttribute('required');
+      expect(ariaHidden).toEqual('true');
       expect(isRequired).toBe('true');
     });
   });

package/ds-form-layout-blocks/form-layout-block-item/DSFormLayoutBlockItemCO.js

@@ -43,6 +43,10 @@ export default class DSFormLayoutBlockItemCO extends PageObject {
     return $$('[data-testid="ds-inputtext-input"]')[index];
   }
 
+  static async getRequiredStarFromIndex(index = 0) {
+    return $$('[data-testid="ds-formlayoutblockitem-mark"]')[index];
+  }
+
   static async getTextFocuseableByIndex(index = 0) {
     return $$(`[data-testid="ds-input-text-root"]`)[index];
   }

package/{ds-toggle → ds-form-toggle}/DSToggle.axe-core.func.spec.js

@@ -13,7 +13,7 @@ if (
 ) {
   describe('PUI-11929 - DSControlledToggle - Axe-Core - showcase', () => {
     before('loading page', async () => {
-      const errorOnGo = await DSToggleCO.showOffURL.go();
+      const errorOnGo = await DSToggleCO.fullShowcase.go();
       if (errorOnGo) throw errorOnGo;
     });
     it('01: should pass axe-core check for showcase example', async () => {
@@ -27,10 +27,14 @@ if (
       expect(result.length).toBe(0);
     });
     it('03: should pass axe-core check for showcase example - readOnly interaction', async () => {
-      await tabStops(6);
+      await tabStops(3);
       const result = await axeCoreCheck();
       expect(result.length).toBe(0);
     });
+    it('04: all toggles should have role switch', async () => {
+      const toggleRoles = await $$('button[role="switch"]');
+      expect(toggleRoles.length).toBe(32);
+    });
   });
   describe('PUI-14182 - [Toggle] applyAriaDisabled prop - axe-core test', () => {
     before('loading page', async () => {

package/{ds-toggle → ds-form-toggle}/DSToggle.func.spec.js

@@ -100,23 +100,28 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
   });
   describe('PUI-8814 - DSControlledToggle:: Tabbing', () => {
     before('loading page', async () => {
-      const errorOnGo = await DSToggleCO.showOffURL.go();
+      const errorOnGo = await DSToggleCO.fullShowcase.go();
       if (errorOnGo) throw errorOnGo;
       await (await DSToggleCO.getToggle()).waitForExist();
     });
     it('01: should tab through the basic toggles to the last basic toggle', async () => {
-      await tabStops(6);
-      const toggle = await DSToggleCO.getToggleFocuseableByIndex(4);
+      await tabStops(2);
+      const toggle = await DSToggleCO.getToggleFocuseableByIndex(1);
       await expect(toggle).toBeFocused();
     });
-    it('02: should tab and skip all three disabled toggles to the first enabled toggle, next row', async () => {
-      await browser.keys(Key.Tab);
-      const toggle = await DSToggleCO.getToggleFocuseableByIndex(11);
+    it('02: should tab and skip all disabled toggles to the first enabled toggle, next row', async () => {
+      await tabStops(5);
+      const toggle = await DSToggleCO.getToggleFocuseableByIndex(8);
       await expect(toggle).toBeFocused();
     });
     it('03: should tab through the readonly toggles to the last readonly toggle', async () => {
-      await tabStops(5);
-      const toggle = await DSToggleCO.getToggleFocuseableByIndex(16);
+      await tabStops(3);
+      const toggle = await DSToggleCO.getToggleFocuseableByIndex(11);
+      await expect(toggle).toBeFocused();
+    });
+    it('04: should tab through the aria-disabled toggles to the last aria-disabled toggle', async () => {
+      await tabStops(2);
+      const toggle = await DSToggleCO.getToggleFocuseableByIndex(13);
       await expect(toggle).toBeFocused();
     });
   });

package/{ds-toggle → ds-form-toggle}/DSToggle.visual.spec.js

@@ -4,12 +4,12 @@ import DSToggleCO from './DSToggleCO';
 if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
   describe('PUI-6757 - DSControlledToggle - Visual Test - showcase', () => {
     before('loading page', async () => {
-      const errorOnGo = await DSToggleCO.showOffURL.go();
+      const errorOnGo = await DSToggleCO.fullShowcase.go();
       if (errorOnGo) throw errorOnGo;
     });
     it('01: should display all DSControlledToggle styles correctly', async () => {
       await (await DSToggleCO.getToggleByIndex(0)).waitForExist();
-      const snapshot = await browser.checkSnapshot(DSToggleCO.snapshotPath('show-off'));
+      const snapshot = await browser.checkSnapshot(DSToggleCO.snapshotPath('full-showcase'));
       await expect(snapshot).toEqual(0);
     });
   });

package/{ds-toggle → ds-form-toggle}/DSToggleCO.js

@@ -2,7 +2,7 @@ import { PATH_E2E_TOGGLE } from '../paths';
 import { PageObject, Urlbuilder } from '../helpers';
 
 export default class DSToggleCO extends PageObject {
-  static showOffURL = new Urlbuilder(PATH_E2E_TOGGLE, 'show-off-test');
+  static fullShowcase = new Urlbuilder(PATH_E2E_TOGGLE, 'full-showcase-test');
 
   static basicURL = new Urlbuilder(PATH_E2E_TOGGLE, 'basic-test');
 

package/ds-menu-button/submenu/DSMenuButton.axe-core.subMenu.func.spec.js

@@ -9,8 +9,7 @@ if (
     browser.capabilities.browserName === 'Chrome') ||
   browser.capabilities.browserName === 'chrome'
 ) {
-  // unskip after PUI-16416 is fixed
-  describe.skip('PUI-14644 - DSMenuButton:: Submenu Menu Item && Action Menu Item - AxeCore', () => {
+  describe('PUI-14644 - DSMenuButton:: Submenu Menu Item && Action Menu Item - AxeCore', () => {
     before('loading page', async () => {
       const errorOnGo = await DSMenuButtonCO.withSubmenuMenuItem.go();
       if (errorOnGo) throw errorOnGo;

package/ds-read-more/DSReadMore.width-change.visual.spec.js

@@ -0,0 +1,85 @@
+import { Key } from 'webdriverio';
+import DSReadMoreCO from './DSReadMoreCO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-17358 - Read More:: width change -Visual', () => {
+    beforeEach('loading page', async () => {
+      const errorOnGo = await DSReadMoreCO.widthChange.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should display readmore at 100px width - read more', async () => {
+      await browser.eyesOpen();
+      const snapshot = await browser.eyesCheckSnapshot(DSReadMoreCO.snapshotPath('width-100-readmore'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('02: should display readmore at 100px width - read less', async () => {
+      await browser.eyesOpen();
+      await browser.keys(Key.Tab);
+      await browser.keys(Key.Enter);
+      await browser.keys(Key.Tab);
+      await browser.keys(Key.Enter);
+      const snapshot = await browser.eyesCheckSnapshot(DSReadMoreCO.snapshotPath('width-100-readless'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('03: should display readmore at 200px width - read more', async () => {
+      await browser.eyesOpen();
+      await $('button*=Change the widths').click();
+      const snapshot = await browser.eyesCheckSnapshot(DSReadMoreCO.snapshotPath('width-200-readmore'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('04: should display readmore at 200px width - read less', async () => {
+      await browser.eyesOpen();
+      await $('button*=Change the widths').click();
+      await browser.keys([Key.Shift, Key.Tab]);
+      await browser.keys([Key.Shift, Key.Tab]);
+      await browser.keys([Key.Shift, Key.Tab]);
+      await browser.keys(Key.Enter);
+      await browser.keys([Key.Shift, Key.Tab]);
+      await browser.keys(Key.Enter);
+      const snapshot = await browser.eyesCheckSnapshot(DSReadMoreCO.snapshotPath('width-200-readless'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('05: should display readmore at 300px width - read more', async () => {
+      await browser.eyesOpen();
+      await $('button*=Change the widths').click();
+      await $('button*=Change the widths').click();
+      const snapshot = await browser.eyesCheckSnapshot(DSReadMoreCO.snapshotPath('width-300-readmore'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('06: should display readmore at 300px width - read less', async () => {
+      await browser.eyesOpen();
+      await $('button*=Change the widths').click();
+      await $('button*=Change the widths').click();
+      await browser.keys([Key.Shift, Key.Tab]);
+      await browser.keys([Key.Shift, Key.Tab]);
+      await browser.keys([Key.Shift, Key.Tab]);
+      await browser.keys(Key.Enter);
+      await browser.keys([Key.Shift, Key.Tab]);
+      await browser.keys(Key.Enter);
+      const snapshot = await browser.eyesCheckSnapshot(DSReadMoreCO.snapshotPath('width-300-readless'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('07: should display readmore at 400px width - read more', async () => {
+      await browser.eyesOpen();
+      await $('button*=Change the widths').click();
+      await $('button*=Change the widths').click();
+      await $('button*=Change the widths').click();
+      const snapshot = await browser.eyesCheckSnapshot(DSReadMoreCO.snapshotPath('width-400-readmore'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('08: should display readmore at 400px width - read less', async () => {
+      await browser.eyesOpen();
+      await $('button*=Change the widths').click();
+      await $('button*=Change the widths').click();
+      await $('button*=Change the widths').click();
+      await browser.keys([Key.Shift, Key.Tab]);
+      await browser.keys([Key.Shift, Key.Tab]);
+      await browser.keys([Key.Shift, Key.Tab]);
+      await browser.keys(Key.Enter);
+      await browser.keys([Key.Shift, Key.Tab]);
+      await browser.keys(Key.Enter);
+      const snapshot = await browser.eyesCheckSnapshot(DSReadMoreCO.snapshotPath('width-400-readless'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}