dimsum-e2e-tests 3.22.0-next.36

package/ds-codeeditor/DSCodeEditor.visual.spec.js

@@ -0,0 +1,28 @@
+import DSCodeEditorCO from './DSCodeEditorCO';
+
+if (!browser.capabilities['ice:options'].isPhone) {
+  describe('PUI-3683', () => {
+    describe('DSCodeEditor - open modal', () => {
+      before('loading page', async () => {
+        const errorOnGo = await DSCodeEditorCO.modalURL.go();
+        if (errorOnGo) throw errorOnGo;
+      });
+      it('Editor with modal', async () => {
+        await (await DSCodeEditorCO.getCodeEditor()).waitForDisplayed();
+        const checkSnapshot = await browser.checkSnapshot(DSCodeEditorCO.snapshotPath('with-modal'));
+        await expect(checkSnapshot).toEqual(0);
+      });
+    });
+    describe('DSCodeEditor - without modal', () => {
+      before('loading page', async () => {
+        const errorOnGo = await DSCodeEditorCO.basicURL.go();
+        if (errorOnGo) throw errorOnGo;
+      });
+      it('Editor without modal', async () => {
+        await (await DSCodeEditorCO.getCodeEditor()).waitForDisplayed();
+        const checkSnapshot = await browser.checkSnapshot(DSCodeEditorCO.snapshotPath('without-modal'));
+        await expect(checkSnapshot).toEqual(0);
+      });
+    });
+  });
+}

package/ds-codeeditor/DSCodeEditorCO.js

@@ -0,0 +1,17 @@
+import { PATH_CODE_EDITOR } from '../../environments/storybook/paths';
+import { PageObject, Urlbuilder } from '../helpers';
+
+export default class DSCodeEditorCO extends PageObject {
+  static basicURL = new Urlbuilder(PATH_CODE_EDITOR, 'basic');
+
+  static modalURL = new Urlbuilder(PATH_CODE_EDITOR, 'modal');
+
+  static async getCodeEditor() {
+    return $('#ace-code-edior');
+  }
+
+  // Snapshots
+  static snapshotPath(example = 'basic') {
+    return PageObject.getSnapshotPathBuilder('CodeEditor', example, 'ds-codeeditor');
+  }
+}

package/ds-comments-card/DSComments.axe-core.func.spec.js

@@ -0,0 +1,66 @@
+import { mouseOver, axeCoreCheck, type } from '../helpers';
+import DSCommentsCO from './DSCommentsCO';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone && browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe.skip('PUI-10808 - DSCommentsCard, Basic -AxeCore test', () => {
+    // unskip after PUI-11706 is fixed
+    before('loading page', async () => {
+      const errorOnGo = await DSCommentsCO.basicURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: basic DSCommentsCard to be axe-core compliant', async () => {
+      const readmore = await DSCommentsCO.getReadMoreByIndex(0);
+      await readmore.click();
+      const commentBtn = await DSCommentsCO.getButtonByIndex(0);
+      await commentBtn.click();
+      await mouseOver(commentBtn);
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+  });
+  describe('PUI-10807 - DSCommentsCard, Dialog -AxeCore test', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCommentsCO.dialogURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: DSComment Card within a dialog (empty) to be axe-core compliant', async () => {
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+    it('02: DSComment Card within a dialog (one comment) to be axe-core compliant', async () => {
+      const input = await DSCommentsCO.getInput();
+      await input.click();
+      await type('Vote for Pedro');
+      const postButton = await DSCommentsCO.getButtonByIndex(0);
+      await postButton.click();
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+    it('03: DSComment Card within a dialog (two comments) to be axe-core compliant', async () => {
+      const input = await DSCommentsCO.getInput();
+      await input.click();
+      await type('Vote for Juan');
+      const postButton = await DSCommentsCO.getButtonByIndex(0);
+      await postButton.click();
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+  });
+  describe('PUI-10806 - DSCommentsCard, Accordion -AxeCore test', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCommentsCO.accordionURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: DSComment Card within a accordion to be axe-core compliant', async () => {
+      const readmore = await DSCommentsCO.getReadMoreByIndex(0);
+      await readmore.click();
+      const readmore2 = await DSCommentsCO.getReadMoreByIndex(2);
+      await readmore2.click();
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+  });
+}

package/ds-comments-card/DSComments.func.spec.js

@@ -0,0 +1,56 @@
+import { Key } from 'webdriverio';
+import DSCommentsCO from './DSCommentsCO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-10809 - DSCommentsCard, TabStops -Visual test', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCommentsCO.basicURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should click and focus the third card', async () => {
+      // first card doesn't count since it has a custom data-testid
+      const commentCard = await DSCommentsCO.getCardFocuseableByIndex(2);
+      await browser.keys(Key.Tab);
+      await browser.keys(Key.Tab);
+      await browser.keys(Key.Tab);
+      await browser.keys(Key.Tab);
+      await expect(commentCard).toBeFocused();
+    });
+    it('02: should press tab and focus the next card', async () => {
+      await browser.keys(Key.Tab);
+      const nextCard = await DSCommentsCO.getCardFocuseableByIndex(3);
+      await expect(nextCard).toBeFocused();
+    });
+    it('03: should press tab and focus the button of that card', async () => {
+      await browser.keys(Key.Tab);
+      const nextCardButton = await DSCommentsCO.getButtonByIndex(0);
+      await expect(nextCardButton).toBeFocused();
+    });
+    it('04: should tab and focus the readmore of the card', async () => {
+      await browser.keys(Key.Tab);
+      const nextCardReadmore = await DSCommentsCO.getReadMoreByIndex(1);
+      await expect(nextCardReadmore).toBeFocused();
+    });
+  });
+  if (
+    (!browser.capabilities['ice:options'].isPhone &&
+      !browser.capabilities['ice:options'].isTablet &&
+      browser.capabilities.browserName === 'Chrome') ||
+    browser.capabilities.browserName === 'chrome'
+  ) {
+    // to be skipped after PUI-11677 is fixed
+    describe.skip('PUI-11679 - CommentsCard:: InnerRef Test', () => {
+      before('loading page', async () => {
+        const errorOnGo = await DSCommentsCO.innerRefURL.go();
+        if (errorOnGo) throw errorOnGo;
+      });
+      it('01: should set focus to CommentsCard component upon button click', async () => {
+        const commentCard = await DSCommentsCO.getCardByIndex(0);
+        await commentCard.waitForDisplayed();
+        const triggerBtn = await DSCommentsCO.getTriggerBtn();
+        await triggerBtn.click();
+        await expect(commentCard).toBeFocused();
+      });
+    });
+  }
+}

package/ds-comments-card/DSComments.visual.spec.js

@@ -0,0 +1,68 @@
+import { Key } from 'webdriverio';
+import { mouseOver, type } from '../helpers';
+import DSCommentsCO from './DSCommentsCO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-10803 - DSCommentsCard, Basic -Visual test', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCommentsCO.basicURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should be display DSComment card basic example', async () => {
+      await browser.keys(Key.Tab);
+      const snapshot = await browser.checkSnapshot(DSCommentsCO.snapshotPath('dscomments-basic'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('02: should be display DSComment card basic example interacted', async () => {
+      const readmore = await DSCommentsCO.getReadMoreByIndex(0);
+      await readmore.click();
+      const commentBtn = await DSCommentsCO.getButtonByIndex(0);
+      await commentBtn.click();
+      await mouseOver(commentBtn);
+      const snapshot = await browser.checkSnapshot(DSCommentsCO.snapshotPath('dscomments-interacted'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+  describe('PUI-10804 - DSCommentsCard, Dialog -Visual test', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCommentsCO.dialogURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should be display DSComment card within a dialog', async () => {
+      const snapshot = await browser.checkSnapshot(DSCommentsCO.snapshotPath('dscomments-dialog'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('02: should be display DSComment card within a dialog with one commnent', async () => {
+      const input = await DSCommentsCO.getInput();
+      await input.click();
+      await type('Vote for Pedro');
+      const postButton = await DSCommentsCO.getButtonByIndex(0);
+      await postButton.click();
+      const snapshot = await browser.checkSnapshot(DSCommentsCO.snapshotPath('dscomments-one-comment'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('03: should be display DSComment card within a dialog with more height to allow for two comments', async () => {
+      const input = await DSCommentsCO.getInput();
+      await input.click();
+      await type('Vote for Juan');
+      const postButton = await DSCommentsCO.getButtonByIndex(0);
+      await postButton.click();
+      const snapshot = await browser.checkSnapshot(DSCommentsCO.snapshotPath('dscomments-two-comment'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+  describe('PUI-10805 - DSCommentsCard, Accordion -Visual test', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCommentsCO.accordionURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should be display DSComment card within an accordion', async () => {
+      const readmore = await DSCommentsCO.getReadMoreByIndex(0);
+      await readmore.click();
+      const readmore2 = await DSCommentsCO.getReadMoreByIndex(2);
+      await readmore2.click();
+      const snapshot = await browser.checkSnapshot(DSCommentsCO.snapshotPath('dscomments-accordion'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/ds-comments-card/DSCommentsCO.js

@@ -0,0 +1,41 @@
+import { PATH_E2E_COMMENTSCARD } from '../../environments/storybook/paths';
+import { PageObject, Urlbuilder } from '../helpers';
+
+export default class DSCommentsCO extends PageObject {
+  static basicURL = new Urlbuilder(PATH_E2E_COMMENTSCARD, 'basic-test');
+
+  static accordionURL = new Urlbuilder(PATH_E2E_COMMENTSCARD, 'inside-accordion-test');
+
+  static dialogURL = new Urlbuilder(PATH_E2E_COMMENTSCARD, 'inside-dialog-test');
+
+  static innerRefURL = new Urlbuilder(PATH_E2E_COMMENTSCARD, 'inner-ref');
+
+  static async getReadMoreByIndex(index = 0) {
+    return $$('[data-testid="ds-read_more-button"]')[index];
+  }
+
+  static async getButtonByIndex(index = 0) {
+    return $$('[data-testid="ds-button"]')[index];
+  }
+
+  static async getInput() {
+    return $('[data-testid="ds-controlled-large-text-input"]');
+  }
+
+  static async getCardByIndex(index = 0) {
+    return $$('[data-testid="ds-comment-card-root"]')[index];
+  }
+
+  static async getCardFocuseableByIndex(index = 0) {
+    return $$('[data-testid="ds-comment-card-left"]')[index];
+  }
+
+  static getTriggerBtn() {
+    return $('[data-testid="trigger-btn"]');
+  }
+
+  // Snapshots
+  static snapshotPath(example = 'basic') {
+    return PageObject.getSnapshotPathBuilder('Comments', example, 'ds-comments');
+  }
+}

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

@@ -0,0 +1,206 @@
+/* eslint-disable import/namespace */
+/* eslint-disable import/no-relative-packages */
+/* eslint-disable max-lines */
+import { Key } from 'webdriverio';
+import { PATH_COMBOBOX_V3_EXAMPLES, PATH_E2E_COMBOBOX_V3 } from '../../../environments/storybook/paths';
+import { PageObject, Urlbuilder } from '../../helpers';
+
+export default class DSComboboxCO extends PageObject {
+  // STORIES
+  static disabled = new Urlbuilder(PATH_E2E_COMBOBOX_V3, 'disabled-fixed-width');
+
+  static errorState = new Urlbuilder(PATH_COMBOBOX_V3_EXAMPLES, 'error-state');
+
+  static insideForm = new Urlbuilder(PATH_COMBOBOX_V3_EXAMPLES, 'inside-form');
+
+  static loadingURL = new Urlbuilder(PATH_E2E_COMBOBOX_V3, 'loading-test');
+
+  static filterByGroup = new Urlbuilder(PATH_COMBOBOX_V3_EXAMPLES, 'filter-by-group');
+
+  static singleSelectFixedWidth = new Urlbuilder(PATH_E2E_COMBOBOX_V3, 'single-select-fixed-width');
+
+  static inline = new Urlbuilder(PATH_E2E_COMBOBOX_V3, 'inline-fixed-width');
+
+  static withFormLayoutBlockItem = new Urlbuilder(PATH_E2E_COMBOBOX_V3, 'with-form-layout-block-item');
+
+  static multiSelectFixedWidth = new Urlbuilder(PATH_E2E_COMBOBOX_V3, 'multi-select-fixed-width');
+
+  static multiSelect = new Urlbuilder(PATH_COMBOBOX_V3_EXAMPLES, 'multi-select');
+
+  static TenThousandOptionsFixedWidth = new Urlbuilder(PATH_E2E_COMBOBOX_V3, 'ten-thousand-options-fixed-width');
+
+  static multiSelectCreatable = new Urlbuilder(PATH_E2E_COMBOBOX_V3, 'multi-select-creatable');
+
+  static insideDialog = new Urlbuilder(PATH_E2E_COMBOBOX_V3, 'inside-dialog-e-2-e');
+
+  static advancedFocus = new Urlbuilder(PATH_E2E_COMBOBOX_V3, 'advanced-focus-management-test');
+
+  static onlySelectable = new Urlbuilder(PATH_COMBOBOX_V3_EXAMPLES, 'only-selectable');
+
+  static inlineDropDownPill = new Urlbuilder(PATH_E2E_COMBOBOX_V3, 'inline-drop-down-pill');
+
+  // COMBOBOX - INPUT
+  static async getCombobox() {
+    return $('[data-testid="combobox-container"]');
+  }
+
+  static async getComboboxWrapper() {
+    return $('[data-testid="combobox-controls-wrapper"]');
+  }
+
+  static async getComboboxByIndex(index) {
+    return $$('[data-testid="combobox-container"]')[index];
+  }
+
+  static async getDropDownMenuBtn() {
+    return $('[data-testid="combobox-dropdown-btn"]');
+  }
+
+  static async getDropDownMenuBtnByIndex(index) {
+    return $$('[data-testid="combobox-dropdown-btn"]')[index];
+  }
+
+  static async getComboboxInput() {
+    return $('[data-testid="combobox-input"]');
+  }
+
+  static async getComboboxInputByIndex(index) {
+    return $$('[data-testid="combobox-input"]')[index];
+  }
+
+  static async getSelectedValues() {
+    return $('[data-testid="combobox-selected-values"]');
+  }
+
+  static async getSelectedItemsA11Y() {
+    return $('[data-testid="combobox-ally-selected-values"]');
+  }
+
+  // MENU
+  static async getSelectAllCheckbox() {
+    return $('#select-all-checkbox');
+  }
+
+  static async getSelectedOptionsToggle() {
+    return $('[data-testid="combobox-selected-options-toggle"]');
+  }
+
+  static async getMenuList() {
+    return $('[data-testid="combobox-menu-list"]');
+  }
+
+  static async getNoMatchesFoundMsg() {
+    return $('div*=No Matches Found');
+  }
+
+  static async getZeroSelectedMsg() {
+    return $('div*=0 SELECTED');
+  }
+
+  static async getComboListbox() {
+    return $('#combo-listbox');
+  }
+
+  // PILLS
+  static async getPills() {
+    return $$('[data-testid="ds-pill-wrapper"]');
+  }
+
+  static async getPillByLabel(label) {
+    return $(`[data-testid="ds-pill-wrapper"][data-label="${label}"]`);
+  }
+
+  static async getPillCloseBtn() {
+    return $('[data-testid="ds-pill-close-icon"]');
+  }
+
+  static async getPillDropDownBtn() {
+    return $('[data-testid="ds-pill-dropdown-chevron"]');
+  }
+
+  static async getPillCloseBtnByIndex(index) {
+    return $$('[data-testid="ds-pill-close-icon"]')[index];
+  }
+
+  // OPTIONS
+  static async getOptionByLabel(label) {
+    return $(`//li[@data-testid="combobox-option"]//span[contains(text(), "${label}")]/ancestor::li`);
+  }
+
+  static async getOptionByIndex(index) {
+    return $$('[data-testid="combobox-option"]')[index];
+  }
+
+  static async getOptions() {
+    return $$('[data-testid="combobox-option"]');
+  }
+
+  static async getNumberOptions() {
+    return $$('[data-testid="combobox-option"]').length;
+  }
+
+  // OTHER SELECTORS
+  static async getSubmitBtn() {
+    return $('button*=Submit');
+  }
+
+  static async getOpenDialogBtn() {
+    return $('[data-testid="open-dialog-button"]');
+  }
+
+  static async isChecked(checkBox) {
+    const checked = await checkBox.getProperty('checked');
+    if (checked === true || checked === 'true') {
+      return true;
+    }
+    return false;
+  }
+
+  static async getCheckbox() {
+    return $('[data-testid="ds-checkbox-container"]').$('span');
+  }
+
+  static async getCheckboxByIndex(index) {
+    return $$('//div[@data-testid="ds-checkbox-container"]/span')[index];
+  }
+
+  static async getCheckboxByLabel(label) {
+    return $(`//label[@data-testid="ds-checkbox-label"]/span[contains(text(),"${label}")]`);
+  }
+
+  static async getInputText() {
+    return $('[data-testid="input-text"]');
+  }
+
+  static async getToggleComboInline() {
+    return $('button*=Toggle Combobox Inline');
+  }
+
+  static async getDsButton() {
+    return $('[data-testid="ds-button"]');
+  }
+
+  static async getTooltip() {
+    return $('[data-testid="popover-container"]');
+  }
+
+  // actions
+
+  static async openMenuUsingKeyboard() {
+    await browser.keys(Key.Tab);
+    await browser.keys(Key.Enter);
+    const menuList = await this.getMenuList();
+    await menuList.waitForDisplayed();
+  }
+
+  static async openMenuListMouse() {
+    const dropdownMenuBtn = await DSComboboxCO.getDropDownMenuBtn();
+    await dropdownMenuBtn.click();
+    const menuList = await DSComboboxCO.getMenuList();
+    await menuList.waitForDisplayed();
+  }
+
+  static snapshotPath(example = 'basic') {
+    return PageObject.getSnapshotPathBuilder('DSComboboxV3', example, 'ds-combobox');
+  }
+}

package/ds-controlled-form/ds-combobox/DSComboboxbox.axe-core.spec.js

@@ -0,0 +1,36 @@
+/* eslint-disable prettier/prettier */
+/* eslint-disable max-len */
+/* eslint-disable max-lines */
+import { axeCoreCheck } from '../../helpers';
+import DSComboboxCO from './DSComboboxCO';
+import { Key } from 'webdriverio';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  // Unskip after PUI10912 is fixed
+  describe.skip('PUI-10911 - ComboboxV3:: Advanced focus management, useRef - func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSComboboxCO.advancedFocus.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: Should focus the first errored combobox after pressing the Save button and be axecore compliant', async () => {
+      const saveButton = await DSComboboxCO.getDsButton();
+      await saveButton.click();
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+    it('02: Should populate the focused combo, press the button again and focus the remaining errored combo being axecore compliant', async () => {
+      await browser.keys(Key.Enter);
+      await browser.keys(Key.ArrowDown);
+      await browser.keys(Key.Enter);
+      const saveButton = await DSComboboxCO.getDsButton();
+      await saveButton.click();
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+  });
+}

package/ds-controlled-form/ds-combobox/DSComboboxbox.func.spec.js

@@ -0,0 +1,28 @@
+/* eslint-disable wdio/no-pause */
+/* eslint-disable max-lines */
+import { Key } from 'webdriverio';
+import DSComboboxCO from './DSComboboxCO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-9375 - ComboboxV3:: Advanced focus management, useRef - func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSComboboxCO.advancedFocus.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('Should focus the first errored combobox after pressing the Save button', async () => {
+      const saveButton = await DSComboboxCO.getDsButton();
+      await saveButton.click();
+      const combo = await DSComboboxCO.getComboboxInputByIndex(0);
+      await expect(combo).toBeFocused();
+    });
+    it('Should populate the focused combo, press the button again and focus the remaining errored combo', async () => {
+      await browser.keys(Key.Enter);
+      await browser.keys(Key.ArrowDown);
+      await browser.keys(Key.Enter);
+      const saveButton = await DSComboboxCO.getDsButton();
+      await saveButton.click();
+      const combo = await DSComboboxCO.getComboboxInputByIndex(3);
+      await expect(combo).toBeFocused();
+    });
+  });
+}