dimsum-e2e-tests 1.0.0-rc.1

package/ds-eol/ds-search-field/SearchField.func.spec.js

@@ -0,0 +1,109 @@
+import { Key } from 'webdriverio';
+import SearchFieldCO from './SearchFieldCO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-4628 - SearchField, search funcionality', () => {
+    before(async () => {
+      const errorOnGo = await SearchFieldCO.withoutLookupIndicator.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: searchField should be displayed', async () => {
+      const comboBoxField = await SearchFieldCO.getCombobox(0);
+      await expect(comboBoxField).toBeDisplayed();
+    });
+    it('02: option should be selected', async () => {
+      await (await SearchFieldCO.getDropDownBtn()).click();
+      await (await SearchFieldCO.getComboboxOption(1)).click();
+      await browser.keys(Key.Tab);
+      // eslint-disable-next-line wdio/no-pause
+      await browser.pause(500);
+      const textInput = await SearchFieldCO.getTextInput(1);
+      await expect(textInput).toHaveTextContaining('Lorem ipsum dolor sit amet consectetur adipiscing elit');
+    });
+    it('03: should filter a value correctly', async () => {
+      await (await SearchFieldCO.getImput()).setValue('test');
+      const comboOptions = await SearchFieldCO.getComboboxOptions();
+      await expect(comboOptions).toHaveLength(2);
+      await (await SearchFieldCO.getComboboxOption(0)).click();
+    });
+    it('04: should display modal for advanced search', async () => {
+      await (await SearchFieldCO.getDropDownBtn()).click();
+      await (await SearchFieldCO.getComboboxOption(3)).click();
+      const modalBtn = await SearchFieldCO.getModalStandardBtn();
+      await expect(modalBtn).toBeDisplayed();
+    });
+    it('05: should display option selected in advanced search', async () => {
+      await (await SearchFieldCO.getRadioBtn(4)).click();
+      await (await SearchFieldCO.getApplyBtn()).click();
+      await browser.keys(Key.Tab);
+      const textInput = await SearchFieldCO.getTextInput(1);
+      await expect(textInput).toHaveTextContaining('name 4');
+    });
+  });
+  describe('PUI-5843 - SearchField,  Modal should not open when typing', () => {
+    before(async () => {
+      const errorOnGo = await SearchFieldCO.withoutLookupIndicator.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should not open modal when typing', async () => {
+      const textInput = await SearchFieldCO.getImput();
+      await textInput.click();
+      await browser.keys('test');
+      const modalBtn = await SearchFieldCO.getModalStandardBtn();
+      await expect(modalBtn).not.toBeDisplayed();
+    });
+  });
+  describe('PUI-5845 - SearchField, Modal search behavior - Filtering', () => {
+    before(async () => {
+      const errorOnGo = await SearchFieldCO.modalStandaloneURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should filter grid rows', async () => {
+      await SearchFieldCO.executeSearchOnModal('9');
+      const names = await SearchFieldCO.getRowsNames();
+      const filtered = names.filter((name) => !name.includes('9'));
+      await expect(filtered).toHaveLength(0);
+    });
+  });
+  describe('PUI-5851 - SearchField, Modal active tab callback', () => {
+    before(async () => {
+      const errorOnGo = await SearchFieldCO.tabsCallbackInSearchFieldURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should show activeTab as standardFields', async () => {
+      const activeTab = await SearchFieldCO.getActiveTab();
+      await expect(activeTab).toHaveTextContaining('standardFields');
+    });
+    it('02: should show activeTab as additionalFields', async () => {
+      await (await SearchFieldCO.getDropDownBtn(0)).click();
+      await (await SearchFieldCO.getComboboxOption(4)).click();
+      await (await SearchFieldCO.getModalExtraBtn()).click();
+      await (await SearchFieldCO.getApplyBtn()).click();
+      const activeTab = await SearchFieldCO.getActiveTab();
+      await expect(activeTab).toHaveTextContaining('additionalFields');
+    });
+  });
+  describe('PUI-5835 - SearchField, Modal search behavior', () => {
+    before(async () => {
+      const errorOnGo = await SearchFieldCO.modalStandaloneURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should add the shearch value to the pills', async () => {
+      await SearchFieldCO.executeSearchOnModal('filter one');
+      const pillText = await SearchFieldCO.getPillsText();
+      await expect(pillText).toContain('filter one');
+    });
+    it('02: should not display the pills anymore', async () => {
+      await (await SearchFieldCO.getClearButton()).click();
+      const removePillBtns = await SearchFieldCO.getRemovePillButtons();
+      await expect(removePillBtns).toHaveLength(0);
+    });
+    it('03: should remove a pill correctly', async () => {
+      await SearchFieldCO.executeSearchOnModal('filter one');
+      await SearchFieldCO.executeSearchOnModal('filter two');
+      await (await SearchFieldCO.getRemovePillButtons())[1].click();
+      const removePillBtns = await SearchFieldCO.getRemovePillButtons();
+      await expect(removePillBtns).toHaveLength(1);
+    });
+  });
+}

package/ds-eol/ds-search-field/SearchField.visual.spec.js

@@ -0,0 +1,86 @@
+import { Key } from 'webdriverio';
+import SearchFieldCO from './SearchFieldCO';
+import { type } from '../../helpers';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-11996 - SearchField: After migration -Visual', () => {
+    before(async () => {
+      const errorOnGo = await SearchFieldCO.migratedURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: searchField should be displayed', async () => {
+      await browser.eyesOpen();
+      const comboBoxField = await SearchFieldCO.getComboInputByIndex(0);
+      await comboBoxField.waitForDisplayed();
+      const snapshot = await browser.eyesCheckSnapshot(SearchFieldCO.snapshotPath('searchfield-migrated-default'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('02: searchField should be expanded', async () => {
+      await browser.eyesOpen();
+      const comboBoxField = await SearchFieldCO.getComboInputByIndex(0);
+      await comboBoxField.click();
+      const snapshot = await browser.eyesCheckSnapshot(SearchFieldCO.snapshotPath('searchfield-migrated-expanded'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('03: searchField should be populated', async () => {
+      await browser.eyesOpen();
+      const comboBoxField = await SearchFieldCO.getComboInputByIndex(0);
+      await comboBoxField.waitForDisplayed();
+      await browser.keys(Key.Enter);
+      const snapshot = await browser.eyesCheckSnapshot(SearchFieldCO.snapshotPath('searchfield-migrated-populated'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('04: searchField should have advanced configuration modal expanded', async () => {
+      await browser.eyesOpen();
+      const advancedButton = await SearchFieldCO.getButtonByindex(0);
+      await advancedButton.click();
+      const snapshot = await browser.eyesCheckSnapshot(SearchFieldCO.snapshotPath('searchfield-migrated-advanced'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+
+  describe('PUI-1997 - SearchField: After migration: queryBuilder example -Visual', () => {
+    before(async () => {
+      const errorOnGo = await SearchFieldCO.migratedURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: searchField should be displayed (expanded output)', async () => {
+      await browser.eyesOpen();
+      const comboBoxField = await SearchFieldCO.getOutputAccordion();
+      await comboBoxField.click();
+      const snapshot = await browser.eyesCheckSnapshot(
+        SearchFieldCO.snapshotPath('searchfield-migrated-queryb-default'),
+      );
+      await expect(snapshot).toEqual(0);
+    });
+    it('02: searchField should be expanded', async () => {
+      await browser.eyesOpen();
+      const comboBoxField = await SearchFieldCO.getComboInputByIndex(1);
+      await comboBoxField.click();
+      const snapshot = await browser.eyesCheckSnapshot(
+        SearchFieldCO.snapshotPath('searchfield-migrated-queryb-expanded'),
+      );
+      await expect(snapshot).toEqual(0);
+    });
+    it('03: searchField should be populated', async () => {
+      await browser.eyesOpen();
+      await browser.keys(Key.Enter);
+      await browser.keys(Key.Tab);
+      await browser.keys(Key.Tab);
+      await type('10');
+      const snapshot = await browser.eyesCheckSnapshot(
+        SearchFieldCO.snapshotPath('searchfield-migrated-queryb-populated'),
+      );
+      await expect(snapshot).toEqual(0);
+    });
+    it('04: searchField should be advanced expanded', async () => {
+      await browser.eyesOpen();
+      const advancedButton = await SearchFieldCO.getButtonByindex(1);
+      await advancedButton.click();
+      const snapshot = await browser.eyesCheckSnapshot(
+        SearchFieldCO.snapshotPath('searchfield-migrated-queryb-advanced'),
+      );
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/ds-eol/ds-search-field/SearchFieldCO.js

@@ -0,0 +1,117 @@
+import { Key } from 'webdriverio';
+import { PATH_SEARCH_FIELD, PATH_E2E_SEARCHFIELD } from '../../../environments/storybook/paths';
+import { PageObject, Urlbuilder, type } from '../../helpers';
+
+export default class QueryBuilderCO extends PageObject {
+  static withoutLookupIndicator = new Urlbuilder(PATH_SEARCH_FIELD, 'without-lookup-indicator');
+
+  static migratedURL = new Urlbuilder(PATH_E2E_SEARCHFIELD, 'migrated-test');
+
+  static modalStandaloneURL = new Urlbuilder(PATH_SEARCH_FIELD, 'modal-search-field-standalone');
+
+  static tabsCallbackInSearchFieldURL = new Urlbuilder(PATH_SEARCH_FIELD, 'tabs-callback-in-search-field');
+
+  static async getDropDownBtn() {
+    return $('[data-testid="combobox-dropdown-btn"]');
+  }
+
+  static async getComboboxOption(index) {
+    return $$('[data-testid="combobox-option"]')[index];
+  }
+
+  static async getComboboxOptions() {
+    return $$('[data-testid="combobox-option"]');
+  }
+
+  static async getButtonByindex(index = 0) {
+    return $$('[data-testid="ds-button"]')[index];
+  }
+
+  static async getComboInputByIndex(index = 0) {
+    return $$('[data-testid="combobox-input"]')[index];
+  }
+
+  static async getCombobox(index) {
+    return $$('[data-testid="combobox"]')[index];
+  }
+
+  static async getTextInput(index) {
+    return $$('//div[@data-testid="combobox"]//span')[index];
+  }
+
+  static async getClearButton() {
+    return $('//span[@data-testid="button-label"]/span[contains(text(), "CLEAR")]');
+  }
+
+  // static async getImput() {
+  //   return $('#react-select-2-input');
+  // }
+
+  static async getImput() {
+    return $('[data-testid="combobox"]').$('input');
+  }
+
+  static async getOutputAccordion() {
+    return $('[data-testid="ds-accordion-item-header-addon"]');
+  }
+
+  static async getPillsText() {
+    const pillsText = [];
+    // eslint-disable-next-line no-restricted-syntax, no-unused-vars
+    for (const pill of await $$('[data-testid="removable-pill"]')) {
+      // eslint-disable-next-line no-await-in-loop
+      pillsText.push(await (await pill.$('span')).getText());
+    }
+    return pillsText;
+  }
+
+  static async getModalExtraBtn() {
+    return $('#additionalFields-label');
+  }
+
+  static async getModalStandardBtn() {
+    return $('#standardFields-label');
+  }
+
+  static async getRadioBtn(index) {
+    return $$('[data-testid="column-metaData.selected"]')[index];
+  }
+
+  static async getMoadlSearchBox() {
+    return $('[data-testid="ds-input_main-component"]');
+  }
+
+  static async getApplyBtn() {
+    return $('span*=Apply');
+  }
+
+  static async getActiveTab() {
+    return $('#ds-sb-main > div > p');
+  }
+
+  static async getRowsNames() {
+    return $$('[data-testid="column-name"]').map((elem) => elem.getText());
+  }
+
+  static async getRemovePillButtons() {
+    return $$('[data-testid="remove-pill-button"]');
+  }
+
+  // Snapshots
+  static snapshotPath(example = 'basic') {
+    return PageObject.getSnapshotPathBuilder('SearchField', example);
+  }
+
+  static async executeSearchOnModal(queryString) {
+    const searchBox = await this.getMoadlSearchBox();
+    await searchBox.click();
+    await type(queryString);
+    await browser.keys(Key.Enter);
+    await searchBox.click();
+    // eslint-disable-next-line no-restricted-syntax, no-unused-vars
+    for (const qString of queryString) {
+      // eslint-disable-next-line no-await-in-loop
+      await browser.keys(Key.Backspace);
+    }
+  }
+}

package/ds-form/Checkbox/DSCheckbox.func.spec.js

@@ -0,0 +1,69 @@
+import DSCheckboxCO from './DSCheckboxCO';
+import { mouseOver, isChecked } from '../../helpers';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-3300 - Checkbox show tick', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCheckboxCO.fullShowcaseURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should show tick when clicked', async () => {
+      await DSCheckboxCO.clickCheckbox(0);
+      const checkBoxChecked = await (await DSCheckboxCO.getCheckbox(0)).getAttribute('aria-checked');
+      await expect(checkBoxChecked).toEqual('true');
+    });
+  });
+  describe('PUI-5350 - Semantic grouping', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCheckboxCO.groupURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should use fieldset and legend for groups', async () => {
+      const legend = await $('legend');
+      const fieldset = await $('fieldset');
+      await expect(legend).toBeDisplayed();
+      await expect(fieldset).toBeDisplayed();
+    });
+  });
+  describe('PUI-4575 - Checkbox, with tooltip', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCheckboxCO.withTooltip.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should be displayed tooltip', async () => {
+      await mouseOver(null, 20, 20);
+      const tooltip = await DSCheckboxCO.getTooltip();
+      await expect(tooltip).toBeDisplayed();
+    });
+    it('should tick when label is clicked', async () => {
+      await (await DSCheckboxCO.getLabel()).click();
+      const checkbox = await DSCheckboxCO.getCheckbox();
+      const checkBoxChecked = await isChecked(checkbox);
+      await expect(checkBoxChecked).toBe(true);
+    });
+    it('should uncheck checkbox', async () => {
+      const checkbox = await DSCheckboxCO.getClickableCheckbox();
+      await checkbox.click();
+      const checkBoxChecked = await isChecked(checkbox);
+      await expect(checkBoxChecked).toBe(false);
+    });
+  });
+  describe('PUI-6905 - Checkbox, with label', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCheckboxCO.withLabel.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should tick when label is clicked', async () => {
+      await (await DSCheckboxCO.getLabel()).click();
+      const checkbox = await DSCheckboxCO.getCheckbox();
+      const checkBoxChecked = await isChecked(checkbox);
+      await expect(checkBoxChecked).toBe(true);
+    });
+    it('should untick when label is clicked again', async () => {
+      await (await DSCheckboxCO.getLabel()).click();
+      const checkbox = await DSCheckboxCO.getCheckbox();
+      const checkBoxChecked = await isChecked(checkbox);
+      await expect(checkBoxChecked).toBe(false);
+    });
+  });
+}

package/ds-form/Checkbox/DSCheckbox.keyboard.navigation.func.spec.js

@@ -0,0 +1,64 @@
+import { Key } from 'webdriverio';
+import DSCheckboxCO from './DSCheckboxCO';
+import { isChecked } from '../../helpers';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-6417 - Checkbox:: keyboard navigation', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCheckboxCO.groupURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('1st checkbox should be focused', async () => {
+      await browser.keys(Key.Tab);
+      const firstCheckbox = await DSCheckboxCO.getCheckbox(0);
+      const isCheckBoxActive = await DSCheckboxCO.isActiveElement(firstCheckbox);
+      await expect(isCheckBoxActive).toBe(true);
+    });
+    it('1st checkbox should be selected', async () => {
+      await browser.keys(Key.Space);
+      const firstCheckbox = await DSCheckboxCO.getCheckbox(0);
+      const isCheckBoxActive = await DSCheckboxCO.isActiveElement(firstCheckbox);
+      const checkBoxChecked = await isChecked(firstCheckbox);
+      await expect(isCheckBoxActive).toBe(true);
+      await expect(checkBoxChecked).toBe(true);
+    });
+    it('navigate to second group of checkboxes', async () => {
+      await browser.keys(Key.Tab);
+      await browser.keys(Key.Tab);
+      await browser.keys(Key.Tab);
+      await browser.keys(Key.Tab);
+      const firstCheckbox = await DSCheckboxCO.getCheckbox(0);
+      const fifthCheckbox = await DSCheckboxCO.getCheckbox(4);
+      const checkBoxChecked = await isChecked(firstCheckbox);
+      const isCheckBoxActive = await DSCheckboxCO.isActiveElement(fifthCheckbox);
+      await expect(checkBoxChecked).toBe(true);
+      await expect(isCheckBoxActive).toBe(true);
+    });
+    it('5th checkbox should be checked', async () => {
+      await browser.keys(Key.Space);
+      const firstCheckbox = await DSCheckboxCO.getCheckbox(0);
+      const fifthCheckbox = await DSCheckboxCO.getCheckbox(4);
+      const isFirstChecked = await isChecked(firstCheckbox);
+      const isFifthChecked = await isChecked(fifthCheckbox);
+      const isFifthActive = await DSCheckboxCO.isActiveElement(fifthCheckbox);
+      await expect(isFirstChecked).toBe(true);
+      await expect(isFifthChecked).toBe(true);
+      await expect(isFifthActive).toBe(true);
+    });
+    it('navigate to 1st checkbox and uncheck it', async () => {
+      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.Shift, Key.Tab]);
+      await browser.keys(Key.Space);
+      const firstCheckbox = await DSCheckboxCO.getCheckbox(0);
+      const fifthCheckbox = await DSCheckboxCO.getCheckbox(4);
+      const isFirstChecked = await isChecked(firstCheckbox);
+      const isFifthChecked = await isChecked(fifthCheckbox);
+      const isFirstActive = await DSCheckboxCO.isActiveElement(firstCheckbox);
+      await expect(isFirstChecked).toBe(false);
+      await expect(isFifthChecked).toBe(true);
+      await expect(isFirstActive).toBe(true);
+    });
+  });
+}

package/ds-form/Checkbox/DSCheckbox.visual.spec.js

@@ -0,0 +1,37 @@
+import DSCheckboxCO from './DSCheckboxCO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-3301 - Checkbox - visual test', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCheckboxCO.fullShowcaseURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('Showcase', async () => {
+      await (await DSCheckboxCO.getCheckbox(0)).waitForDisplayed({ timeout: 5000 });
+      const snapshot = await browser.checkSnapshot(DSCheckboxCO.snapshotPath('show-case'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}
+describe('PUI-3302 - Checkbox - Group horizontal and vertical', () => {
+  before('loading page', async () => {
+    const errorOnGo = await DSCheckboxCO.groupURL.go();
+    if (errorOnGo) throw errorOnGo;
+  });
+  it('Group horizontal and vertical', async () => {
+    await (await DSCheckboxCO.getCheckbox(0)).waitForDisplayed({ timeout: 5000 });
+    const snapshot = await browser.checkSnapshot(DSCheckboxCO.snapshotPath('checkbox-group'));
+    await expect(snapshot).toEqual(0);
+  });
+});
+describe('PUI-5484 - Checkbox - wrapping rule', () => {
+  before('loading page', async () => {
+    const errorOnGo = await DSCheckboxCO.wrap.go();
+    if (errorOnGo) throw errorOnGo;
+  });
+  it('should display checkbox label wrapped', async () => {
+    await (await DSCheckboxCO.getCheckbox()).waitForDisplayed({ timeout: 5000 });
+    const snapshot = await browser.checkSnapshot(DSCheckboxCO.snapshotPath('group-vertical'));
+    await expect(snapshot).toEqual(0);
+  });
+});

package/ds-form/Checkbox/DSCheckboxCO.js

@@ -0,0 +1,60 @@
+import { PATH_END_OF_LIFE_CHECKBOX } from '../../../environments/storybook/paths';
+import { PageObject, Urlbuilder } from '../../helpers';
+export default class DSCheckboxCO extends PageObject {
+  // Atomic
+  static groupURL = new Urlbuilder(PATH_END_OF_LIFE_CHECKBOX, 'group');
+
+  static withTooltip = new Urlbuilder(PATH_END_OF_LIFE_CHECKBOX, 'with-tooltip');
+
+  static wrap = new Urlbuilder(PATH_END_OF_LIFE_CHECKBOX, 'wrap');
+
+  static fullShowcaseURL = new Urlbuilder(PATH_END_OF_LIFE_CHECKBOX, 'full-show-case');
+
+  static withLabel = new Urlbuilder(PATH_END_OF_LIFE_CHECKBOX, 'with-label');
+
+  static getUrl(component = 'basic') {
+    return PageObject.getUrl(PATH_END_OF_LIFE_CHECKBOX, component);
+  }
+
+  // Snapshot
+  static snapshotPath(example = 'basic') {
+    return PageObject.getSnapshotPathBuilder('Checkbox', example);
+  }
+
+  // selectors
+  static async getClickableCheckbox() {
+    return $('//span[@data-testid="ds-checkbox"]/ancestor::span');
+  }
+
+  static async getCheckbox(idx) {
+    if (idx) {
+      return $$('[data-testid="ds-checkbox"]')[idx];
+    }
+    return $('[data-testid="ds-checkbox"]');
+  }
+
+  static async getCheckboxChecked(idx) {
+    if (idx) {
+      return $$('//span[contains(@aria-checked,"true")]')[idx];
+    }
+    return $('//span[contains(@aria-checked,"true")]');
+  }
+
+  static async clickCheckbox(idx) {
+    return (await this.getCheckbox(idx)).click();
+  }
+
+  static async getTooltip() {
+    return $('[data-testid="popper-container"]');
+  }
+
+  static async getLabel() {
+    return $('//label[@data-testid="ds-checkbox-label"]/span[2]');
+  }
+
+  static async isActiveElement(element) {
+    const key = 'element-6066-11e4-a52e-4f735466cecf';
+    const selected = await browser.getActiveElement();
+    return element[key] === selected[key];
+  }
+}