dimsum-e2e-tests 1.0.0-rc.1

package/ds-breadcrumb/DSBreadcrumb.visual.spec.js

@@ -0,0 +1,104 @@
+import DSBreadcrumbCO from './DSBreadcrumbCO';
+import { mouseOver } from '../helpers';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-3979 - Breadcrumb, with title', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSBreadcrumbCO.titleURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should display a title variant correctly', async () => {
+      const breadcrumb = await DSBreadcrumbCO.getBreadcrumb();
+      await breadcrumb.waitForDisplayed({ timeout: 5000 });
+      const snapshot = await browser.checkSnapshot(DSBreadcrumbCO.snapshotPath('title'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+
+  describe('PUI-3979 - Breadcrumb, without title', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSBreadcrumbCO.basicURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should display a trailing slash for non title variant', async () => {
+      const breadcrumb = await DSBreadcrumbCO.getBreadcrumb();
+      await breadcrumb.waitForDisplayed({ timeout: 5000 });
+      const otherBreadcrumb = await DSBreadcrumbCO.getBreadcrumbItems(2);
+      await mouseOver(otherBreadcrumb);
+      const snapshot = await browser.checkSnapshot(DSBreadcrumbCO.snapshotPath('non-title'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+
+  describe('PUI-6491 - Breadcrumb, Truncation - Visual Test', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSBreadcrumbCO.ucTruncatedURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should show every link truncated', async () => {
+      const breadcrumb = await DSBreadcrumbCO.getBreadcrumb();
+      await breadcrumb.waitForDisplayed({ timeout: 5000 });
+      const snapshot = await browser.checkSnapshot(DSBreadcrumbCO.snapshotPath('breadcrumb-all-truncated'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('should show one the links not truncated after mouse hover', async () => {
+      const breadcrumb = await DSBreadcrumbCO.getBreadcrumb();
+      await breadcrumb.waitForDisplayed({ timeout: 5000 });
+      const bcLink = await DSBreadcrumbCO.getBreadcrumbItem('Aenean non ante eu nunc volutpat');
+      if (browser.capabilities.browserName !== 'firefox') {
+        await mouseOver(bcLink);
+      } else {
+        await bcLink.moveTo();
+      }
+      const snapshot = await browser.checkSnapshot(DSBreadcrumbCO.snapshotPath('breadcrumb-one-not-truncated'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+
+  describe('PUI-9458 - Breadcrumb, Custom colors - Visual Test', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSBreadcrumbCO.colorsURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should breadcrumb of different custom colors', async () => {
+      const breadcrumb = await DSBreadcrumbCO.getBreadcrumb();
+      await breadcrumb.waitForDisplayed({ timeout: 5000 });
+      const otherBreadcrumb = await DSBreadcrumbCO.getBreadcrumbItems(2);
+      await mouseOver(otherBreadcrumb);
+      const snapshot = await browser.checkSnapshot(DSBreadcrumbCO.snapshotPath('breadcrumb-custom-colors'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+
+  describe('PUI-9459 - Breadcrumb, Above title - Visual Test', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSBreadcrumbCO.aboveTitle.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should show breadcrumb above title', async () => {
+      const breadcrumb = await DSBreadcrumbCO.getBreadcrumb();
+      await breadcrumb.waitForDisplayed({ timeout: 5000 });
+      const snapshot = await browser.checkSnapshot(DSBreadcrumbCO.snapshotPath('breadcrumb-above-title'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('should show hovered editable title', async () => {
+      const title = await DSBreadcrumbCO.getEditableTitle();
+      await mouseOver(title);
+      const snapshot = await browser.checkSnapshot(DSBreadcrumbCO.snapshotPath('breadcrumb-hovered-title'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+
+  describe('PUI-9462 - Breadcrumb, Active - Visual Test', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSBreadcrumbCO.activeURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should display the breadcrumb item 7 as active by default', async () => {
+      const breadcrumb = await DSBreadcrumbCO.getBreadcrumb();
+      await breadcrumb.waitForDisplayed({ timeout: 5000 });
+      const snapshot = await browser.checkSnapshot(DSBreadcrumbCO.snapshotPath('breadcrumb-active-7'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/ds-breadcrumb/DSBreadcrumbCO.js

@@ -0,0 +1,60 @@
+// eslint-disable-next-line import/no-relative-packages
+import { PATH_E2E_BREADCRUMB } from '../../environments/storybook/paths';
+import { PageObject, Urlbuilder } from '../helpers';
+
+export default class DSBreadcrumbCO extends PageObject {
+  static basicURL = new Urlbuilder(PATH_E2E_BREADCRUMB, 'basic-test');
+
+  static titleURL = new Urlbuilder(PATH_E2E_BREADCRUMB, 'title-test');
+
+  static onClickURL = new Urlbuilder(PATH_E2E_BREADCRUMB, 'on-click-test');
+
+  static hrefURL = new Urlbuilder(PATH_E2E_BREADCRUMB, 'href-test');
+
+  static activeURL = new Urlbuilder(PATH_E2E_BREADCRUMB, 'active-test');
+
+  static ucTruncatedURL = new Urlbuilder(PATH_E2E_BREADCRUMB, 'bread-crumb-truncated');
+
+  static containerProps = new Urlbuilder(PATH_E2E_BREADCRUMB, 'container-props-test');
+
+  static colorsURL = new Urlbuilder(PATH_E2E_BREADCRUMB, 'color-test');
+
+  static aboveTitle = new Urlbuilder(PATH_E2E_BREADCRUMB, 'above-title-test');
+
+  static asURL = new Urlbuilder(PATH_E2E_BREADCRUMB, 'as-test');
+
+  // Snapshots
+  static snapshotPath(example = 'basic') {
+    return PageObject.getSnapshotPathBuilder('Breadcrumb', example);
+  }
+
+  // selectors
+  static async getBreadcrumb() {
+    return $('[data-testid="breadcrumb-nav-container"]');
+  }
+
+  static async getBreadcrumbItems(index) {
+    return $$('//li[@data-testid="breadcrumb-item-container"]/a')[index];
+  }
+
+  static async getBreadcrumbItem(text) {
+    return $(`a*=${text}`);
+  }
+
+  static async getCounter(customText) {
+    return $(`h3*=${customText}`);
+  }
+
+  static async getBreadcrumbCustomId() {
+    return $(`[id="my-custom-id"]`);
+  }
+
+  static async getEditableTitle() {
+    return $(`[data-testid="ds-page-header-editable-title"]`);
+  }
+
+  static async getItemColor(text) {
+    const color = await (await this.getBreadcrumbItem(text)).getCSSProperty('color');
+    return color.parsed.hex;
+  }
+}

package/ds-button-group/DSButtonGropu.visual.spec.js

@@ -0,0 +1,16 @@
+import DSButtonGroupCO from './DSButtonGroupCO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-5602 - ButtonGroup- visual tests', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSButtonGroupCO.showcaseURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('button group showcase', async () => {
+      const button = await DSButtonGroupCO.getButtons(0);
+      await button.waitForDisplayed({ timeout: 10000 });
+      const snapshot = await browser.checkSnapshot(DSButtonGroupCO.snapshotPath('button-group-showcase'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/ds-button-group/DSButtonGroupCO.js

@@ -0,0 +1,20 @@
+import { PATH_END_OF_LIFE_BUTTON_GROUP } from '../../environments/storybook/paths';
+import { PageObject, Urlbuilder } from '../helpers';
+
+export default class DSButtonCO extends PageObject {
+  // Atomic
+  static showcaseURL = new Urlbuilder(PATH_END_OF_LIFE_BUTTON_GROUP, 'showcase');
+
+  // Snapshot
+  static snapshotPath(example = 'basic') {
+    return PageObject.getSnapshotPathBuilder('ButtonGroup', example);
+  }
+
+  // selectors
+  static async getButtons(index) {
+    return $$('[data-testid="button-wrapper"]')[index];
+  }
+
+  // actions
+  // utils
+}

package/ds-button-v1/DSButton.func.spec.js

@@ -0,0 +1,23 @@
+import DSButtonCO from './DSButtonCO';
+import { mouseOver } from '../helpers';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-6229 - Button enabled/disabled - should show tooltip', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSButtonCO.tooltipURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('with disabled state having a wrapper', async () => {
+      const target = await DSButtonCO.getDisabledButton();
+      await mouseOver(target, 75, 14);
+      const tooltip = await DSButtonCO.getTooltip1();
+      await expect(tooltip).toBeDisplayed();
+    });
+    it('with enabled state', async () => {
+      const target = await DSButtonCO.getEnabledButton();
+      await mouseOver(target, 75, 14);
+      const tooltip = await DSButtonCO.getTooltip2();
+      await expect(tooltip).toBeDisplayed();
+    });
+  });
+}

package/ds-button-v1/DSButton.visual.spec.js

@@ -0,0 +1,16 @@
+import DSButtonCO from './DSButtonCO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-3479 - Button - visual tests', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSButtonCO.showcaseURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('button showcase', async () => {
+      const button = await DSButtonCO.getButtons(0);
+      await button.waitForDisplayed({ timeout: 5000 });
+      const snapshot = await browser.checkSnapshot(DSButtonCO.snapshotPath('button-showcase'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/ds-button-v1/DSButtonCO.js

@@ -0,0 +1,38 @@
+import { PATH_END_OF_LIFE_BUTTON, PATH_E2E_BUTTON } from '../../environments/storybook/paths';
+import { PageObject, Urlbuilder } from '../helpers';
+export default class DSButtonCO extends PageObject {
+  // Atomic
+  static showcaseURL = new Urlbuilder(PATH_END_OF_LIFE_BUTTON, 'showcase');
+
+  // use case
+  static tooltipURL = new Urlbuilder(PATH_E2E_BUTTON, 'button-with-tooltip');
+
+  // Snapshot
+  static snapshotPath(example = 'basic') {
+    return PageObject.getSnapshotPathBuilder('Button', example);
+  }
+
+  // selectors
+  static async getButtons(index) {
+    return $$('[data-testid="button-wrapper"]')[index];
+  }
+
+  static async getEnabledButton() {
+    return $('[data-testid="button-enable"]');
+  }
+
+  static async getDisabledButton() {
+    return $('[data-testid="disabled-wrapper"]');
+  }
+
+  static async getTooltip1() {
+    return $('[data-testid="tooltip-1"]');
+  }
+
+  static async getTooltip2() {
+    return $('[data-testid="tooltip-2"]');
+  }
+
+  // actions
+  // utils
+}

package/ds-button-v2/DSButtonV2.axe-core.func.spec.js

@@ -0,0 +1,22 @@
+import { axeCoreCheck } from '../helpers';
+import DSButtonV2CO from './DSButtonV2CO';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-10223 - ButtonV2 - axe core', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSButtonV2CO.interactionStates.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: Evaluate checkbox accessibility with axe-core', async () => {
+      const button = await DSButtonV2CO.getButtonByIndex(0);
+      await button.waitForDisplayed({ timeout: 5000 });
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+  });
+}

package/ds-button-v2/DSButtonV2.func.spec.js

@@ -0,0 +1,139 @@
+import { Key } from 'webdriverio';
+import DSButtonV2CO from './DSButtonV2CO';
+import { mouseOver, type } from '../helpers';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-9507 - ButtonV2 - React events', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSButtonV2CO.callbacks.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should perform mouseOver action and increase the counter by one', async () => {
+      const button = await DSButtonV2CO.getButtonByIndex(0);
+      await button.waitForDisplayed({ timeout: 5000 });
+      await mouseOver(button);
+      const testData = await (await DSButtonV2CO.getTestData(5)).getText();
+      await expect(testData).toEqual('MouseOver counter 1');
+    });
+    it('02: should perform click action and increase the counter by one (also focus counter)', async () => {
+      const button = await DSButtonV2CO.getButtonByIndex(0);
+      await button.click();
+      if (browser.capabilities.browserName === 'Safari') {
+        // Safaris doesn't mantain focus on click
+        await browser.keys([Key.Shift, Key.Tab]); // Focus with keyboard to match other browsers
+      }
+      const testData = await (await DSButtonV2CO.getTestData(2)).getText();
+      await expect(testData).toEqual('Click counter 1');
+      const testData2 = await (await DSButtonV2CO.getTestData(3)).getText();
+      await expect(testData2).toEqual('Focus counter 1');
+    });
+    // eslint-disable-next-line max-len
+    it('03: should perform keyDown action (enter and space) and increase the counter by two (also click counter)', async () => {
+      await browser.keys(Key.Return);
+      await browser.keys(Key.Space);
+      const testData = await (await DSButtonV2CO.getTestData(1)).getText();
+      await expect(testData).toEqual('KeyDown counter 2');
+      const testData2 = await (await DSButtonV2CO.getTestData(2)).getText();
+      await expect(testData2).toEqual('Click counter 3');
+    });
+    // eslint-disable-next-line max-len
+    it('04: should perform keyDown action (NOT enter and space) and increase the counter by one (NOT click counter)', async () => {
+      await type('j');
+      const testData = await (await DSButtonV2CO.getTestData(1)).getText();
+      await expect(testData).toEqual('KeyDown counter 3');
+      const testData2 = await (await DSButtonV2CO.getTestData(2)).getText();
+      await expect(testData2).toEqual('Click counter 3');
+    });
+    it('05: should perform blur action and increase the counter by one', async () => {
+      const textUsedToBlur = await DSButtonV2CO.getTestData(1);
+      await textUsedToBlur.click();
+      const testData = await (await DSButtonV2CO.getTestData(4)).getText();
+      await expect(testData).toEqual('Blur counter 1');
+    });
+    it('06: should focus with keyboard and check all the counters', async () => {
+      await browser.keys([Key.Shift, Key.Tab]);
+      const testData1 = await (await DSButtonV2CO.getTestData(1)).getText();
+      const testData2 = await (await DSButtonV2CO.getTestData(2)).getText();
+      const testData3 = await (await DSButtonV2CO.getTestData(3)).getText();
+      const testData4 = await (await DSButtonV2CO.getTestData(4)).getText();
+      const testData5 = await (await DSButtonV2CO.getTestData(5)).getText();
+      await expect(testData1).toEqual('KeyDown counter 3');
+      await expect(testData2).toEqual('Click counter 3');
+      await expect(testData3).toEqual('Focus counter 2');
+      await expect(testData4).toEqual('Blur counter 1');
+      await expect(testData5).toEqual('MouseOver counter 1');
+    });
+  });
+
+  describe('PUI-9508 - ButtonV2 - Toggle, pressed attribute', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSButtonV2CO.asToggle.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should press the button as a toggle and have its aria-attribute as true', async () => {
+      const button = await DSButtonV2CO.getButtonByIndex(0);
+      await button.waitForDisplayed({ timeout: 5000 });
+      await button.click();
+      const isPressed = await button.getAttribute('aria-pressed');
+      await expect(isPressed).toEqual('true');
+    });
+    it('02: should press again the button as a toggle and have its aria-attribute as false', async () => {
+      const button = await DSButtonV2CO.getButtonByIndex(0);
+      await button.waitForDisplayed({ timeout: 5000 });
+      await button.click();
+      const isPressed = await button.getAttribute('aria-pressed');
+      await expect(isPressed).toEqual('false');
+    });
+  });
+
+  describe('PUI-9641 - ButtonV2 - Tooltip enabled/disabled, mouse/keyboard', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSButtonV2CO.tooltip.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should hover enabled button and display tooltip', async () => {
+      const button = await DSButtonV2CO.getButtonByIndex(1);
+      await mouseOver(button);
+      const tooltip = await DSButtonV2CO.getTooltip();
+      await expect(tooltip).toBeDisplayedInViewport();
+    });
+    it('02: should hover disabled button and display tooltip', async () => {
+      const button = await DSButtonV2CO.getButtonByIndex(0);
+      await mouseOver(button);
+      const tooltip = await DSButtonV2CO.getTooltip();
+      await expect(tooltip).toBeDisplayedInViewport();
+    });
+    it('03: should not display tooltip when not hovering the button', async () => {
+      const button = await DSButtonV2CO.getButtonByIndex(0);
+      await mouseOver(button, 200, 200);
+      const tooltip = await DSButtonV2CO.getTooltip();
+      await expect(tooltip).not.toBeDisplayedInViewport();
+    });
+    it('04: should focus with tab enabled button and display tooltip', async () => {
+      await browser.keys(Key.Tab);
+      const tooltip = await DSButtonV2CO.getTooltip();
+      await expect(tooltip).toBeDisplayedInViewport();
+    });
+  });
+
+  describe('PUI-9642 - ButtonV2 - Button, onClick close popups even when disabled', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSButtonV2CO.disabledTest.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should expand popup (cant be closed with click at the disabled generic button)', async () => {
+      const appPickerTrigger = await DSButtonV2CO.getToolbarItemByIndex(0);
+      await appPickerTrigger.waitForDisplayed({ timeout: 5000 });
+      await appPickerTrigger.click();
+      const appPicker = await $$('[data-testid="app-picker__wrapper"]');
+      await expect(appPicker).toBeDisplayedInViewport();
+    });
+    it('02: should close the popup when clicking the disabled ds-button-v2', async () => {
+      const button = await DSButtonV2CO.getButtonByIndex(0);
+      await button.waitForDisplayed({ timeout: 5000 });
+      await button.click();
+      const appPicker = await $$('[data-testid="app-picker__wrapper"]');
+      await expect(appPicker).not.toBeDisplayedInViewport();
+    });
+  });
+}

package/ds-button-v2/DSButtonV2.visual.spec.js

@@ -0,0 +1,153 @@
+import { Key } from 'webdriverio';
+import DSButtonV2CO from './DSButtonV2CO';
+import { mouseOver } from '../helpers';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-7782 - ButtonV2 - Interaction States showcase', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSButtonV2CO.interactionStates.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should display button showcase correctly', async () => {
+      const button = await DSButtonV2CO.getButtonByIndex(0);
+      await button.waitForDisplayed({ timeout: 5000 });
+      const snapshot = await browser.checkSnapshot(DSButtonV2CO.snapshotPath('ds-button-v2-interaction-states'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+
+  describe('PUI-9509 - ButtonV2 - Toggle + Real interaction states', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSButtonV2CO.asToggle.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should display the button as a toggle with default state', async () => {
+      const button = await DSButtonV2CO.getButtonByIndex(0);
+      await button.waitForDisplayed({ timeout: 5000 });
+      const snapshot = await browser.checkSnapshot(DSButtonV2CO.snapshotPath('ds-button-toggle-default'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('should display the button as a toggle with focus state and pressed', async () => {
+      await browser.keys(Key.Tab);
+      await browser.keys(Key.Enter);
+      const snapshot = await browser.checkSnapshot(DSButtonV2CO.snapshotPath('ds-button-toggle-focus'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('should display the button as a toggle with focus + hover state', async () => {
+      const button = await DSButtonV2CO.getButtonByIndex(0);
+      await mouseOver(button);
+      const snapshot = await browser.checkSnapshot(DSButtonV2CO.snapshotPath('ds-button-toggle-focusandhover'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('should display the button as a toggle with hover state', async () => {
+      await browser.keys(Key.Tab);
+      const button = await DSButtonV2CO.getButtonByIndex(0);
+      await mouseOver(button);
+      const snapshot = await browser.checkSnapshot(DSButtonV2CO.snapshotPath('ds-button-toggle-hover'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+
+  describe('PUI-7892 - ButtonV2 - Variants showcase', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSButtonV2CO.showcaseURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should display button showcase correctly', async () => {
+      const button = await DSButtonV2CO.getButtonByIndex(0);
+      await button.waitForDisplayed({ timeout: 5000 });
+      const snapshot = await browser.checkSnapshot(DSButtonV2CO.snapshotPath('ds-button-v2-showcase'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+
+  describe('PUI-7891 - ButtonV2 - enable/disabled - should show tooltip - keyboard', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSButtonV2CO.tooltip.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should display tooltip over enabled text button', async () => {
+      const button = await DSButtonV2CO.getButtonByIndex(1);
+      await button.waitForDisplayed({ timeout: 5000 });
+      await browser.keys(Key.Tab);
+      const tooltip = await DSButtonV2CO.getTooltip();
+      await tooltip.waitForDisplayed({ timeout: 5000 });
+      const snapshot = await browser.checkSnapshot(DSButtonV2CO.snapshotPath('ds-button-v2-tooltip-focused-btn'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('should display tooltip over enabled icon button', async () => {
+      await browser.keys(Key.Tab);
+      const tooltip = await DSButtonV2CO.getTooltip();
+      await tooltip.waitForDisplayed({ timeout: 5000 });
+      const snapshot = await browser.checkSnapshot(DSButtonV2CO.snapshotPath('ds-button-v2-tooltip-focused-icon-btn'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+
+  describe('PUI-8371 - ButtonV2 - Sizes showcase', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSButtonV2CO.sizes.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should display the buttons v2 different sizes', async () => {
+      const snapshot = await browser.checkSnapshot(DSButtonV2CO.snapshotPath('ds-button-v2-sizes'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+
+  describe('PUI-7890 - ButtonV2 - enable/disabled - should show tooltip - hover', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSButtonV2CO.tooltip.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should display tooltip over enabled text button', async () => {
+      const button = await DSButtonV2CO.getButtonByIndex(1);
+      await button.waitForDisplayed({ timeout: 5000 });
+      mouseOver(button);
+      const tooltip = await DSButtonV2CO.getTooltip();
+      await tooltip.waitForDisplayed({ timeout: 5000 });
+      const snapshot = await browser.checkSnapshot(DSButtonV2CO.snapshotPath('ds-button-v2-tooltip-hover-enabled-btn'));
+      await expect(snapshot).toEqual(0);
+    });
+    // known issue in Safari - react
+    // https://github.com/facebook/react/issues/4251
+    // https://github.com/facebook/react/issues/19419
+    if (browser.capabilities.browserName !== 'Safari') {
+      it('should display tooltip over disabled text button', async () => {
+        const button = await DSButtonV2CO.getButtonByIndex(0);
+        mouseOver(button);
+        const tooltip = await DSButtonV2CO.getTooltip();
+        await tooltip.waitForDisplayed({ timeout: 5000 });
+        const snapshot = await browser.checkSnapshot(
+          DSButtonV2CO.snapshotPath('ds-button-v2-tooltip-hover-disabled-btn'),
+        );
+        await expect(snapshot).toEqual(0);
+      });
+    }
+    it('should display tooltip over enabled icon button', async () => {
+      const button = await DSButtonV2CO.getButtonByIndex(3);
+      mouseOver(button);
+      const tooltip = await DSButtonV2CO.getTooltip();
+      await tooltip.waitForDisplayed({ timeout: 5000 });
+      const snapshot = await browser.checkSnapshot(
+        DSButtonV2CO.snapshotPath('ds-button-v2-tooltip-hover-enabled-icon-btn'),
+      );
+      await expect(snapshot).toEqual(0);
+    });
+    // known issue in Safari - react
+    // https://github.com/facebook/react/issues/4251
+    // https://github.com/facebook/react/issues/19419
+    if (browser.capabilities.browserName !== 'Safari') {
+      it('should display tooltip over disabled icon button', async () => {
+        const button = await DSButtonV2CO.getButtonByIndex(2);
+        mouseOver(button);
+        const tooltip = await DSButtonV2CO.getTooltip();
+        await tooltip.waitForDisplayed({ timeout: 5000 });
+        const snapshot = await browser.checkSnapshot(
+          DSButtonV2CO.snapshotPath('ds-button-v2-tooltip-hover-disabled-icon-btn'),
+        );
+        await expect(snapshot).toEqual(0);
+      });
+    }
+  });
+}

package/ds-button-v2/DSButtonV2CO.js

@@ -0,0 +1,43 @@
+import { PATH_E2E_BUTTON_V2 } from '../../environments/storybook/paths';
+import { PageObject, Urlbuilder } from '../helpers';
+export default class DSButtonV2CO extends PageObject {
+  // Atomic
+  static showcaseURL = new Urlbuilder(PATH_E2E_BUTTON_V2, 'showcase-test');
+
+  static asToggle = new Urlbuilder(PATH_E2E_BUTTON_V2, 'button-as-toggle-test');
+
+  static callbacks = new Urlbuilder(PATH_E2E_BUTTON_V2, 'callbacks-test');
+
+  static disabledTest = new Urlbuilder(PATH_E2E_BUTTON_V2, 'disabled-test');
+
+  static tooltip = new Urlbuilder(PATH_E2E_BUTTON_V2, 'button-with-tooltip-test');
+
+  static sizes = new Urlbuilder(PATH_E2E_BUTTON_V2, 'size-test');
+
+  static interactionStates = new Urlbuilder(PATH_E2E_BUTTON_V2, 'interaction-states-showcase-test');
+
+  // Snapshot
+  static snapshotPath(example = 'basic') {
+    return PageObject.getSnapshotPathBuilder('ButtonV2', example);
+  }
+
+  // selectors
+  static async getButtonByIndex(index) {
+    return $$('[data-testid="ds-button"]')[index];
+  }
+
+  static async getToolbarItemByIndex(index) {
+    return $$('[data-testid="gh-toolbar-item"]')[index];
+  }
+
+  static async getTooltip() {
+    return $('[data-testid="ds-tooltip-v3-tooltip-text-wrapper"]');
+  }
+
+  static async getTestData(index) {
+    return $(`[data-testid="test-data-${index}"]`);
+  }
+
+  // actions
+  // utils
+}