dimsum-e2e-tests 3.22.0-next.36

package/ds-wysiwyg/DSWysiwyg.func.spec.js

@@ -0,0 +1,234 @@
+/* eslint-disable max-lines */
+import { Key } from 'webdriverio';
+import DSWysiwygCO from './DSWysiwygCO';
+import { type, mouseOver } from '../helpers';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-4767 - [WYSIWYG] - Open second text editor', () => {
+    before(async () => {
+      const errorOnGo = await DSWysiwygCO.basicURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('Modal with second editor is displayed', async () => {
+      await (await DSWysiwygCO.getInsertBtn()).waitForDisplayed();
+      await (await DSWysiwygCO.getInsertBtn()).click();
+      await (await DSWysiwygCO.getComboOption(0)).click();
+      const modalToolbar = await DSWysiwygCO.getModalToolbar();
+      await expect(modalToolbar).toBeDisplayed();
+    });
+    it('HTML is displayed', async () => {
+      const textInputModal = await DSWysiwygCO.textInputModal();
+      await textInputModal.click();
+      await type('Test');
+      await (await DSWysiwygCO.showHTMLBtnModal()).click();
+      const htmlModal = await DSWysiwygCO.showHTMLModal();
+      const textareaContent = await htmlModal.getText();
+      await expect(textareaContent).toBe('<p>Test</p>');
+    });
+    it('Text is displayed', async () => {
+      await (await DSWysiwygCO.showTextBtn()).click();
+      const txtModal = await DSWysiwygCO.textInputModal();
+      await expect(txtModal).toHaveTextContaining('Test');
+    });
+  });
+
+  describe('PUI-4625 - [WYSIWYG] - View source of generated HTML', () => {
+    before(async () => {
+      const errorOnGo = await DSWysiwygCO.basicURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('HTML is displayed', async () => {
+      await (await DSWysiwygCO.showHTMLBtn()).click({ x: 10 });
+      const htmlModal = await DSWysiwygCO.showHTML();
+      await expect(htmlModal).toHaveTextContaining('<h1>Hello</h1>');
+    });
+    it('Text is displayed', async () => {
+      await (await DSWysiwygCO.showTextBtn()).click();
+      const text = await DSWysiwygCO.showText();
+      await expect(text).toHaveTextContaining('Hello');
+    });
+  });
+  describe('PUI-6257 - WYSIWYG, Show HTML/TEXT without custom toolbar', () => {
+    before(async () => {
+      const errorOnGo = await DSWysiwygCO.withoutCustomToolbarURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('HTML is displayed', async () => {
+      await (await DSWysiwygCO.showHTMLBtn()).click({ x: 10 });
+      const htmlText = await DSWysiwygCO.showHTML();
+      await expect(htmlText).toHaveTextContaining('<p>Hello</p>');
+    });
+    it('Text is displayed', async () => {
+      await (await DSWysiwygCO.showTextBtn()).click();
+      const text = await DSWysiwygCO.showText();
+      await expect(text).toHaveTextContaining('Hello');
+    });
+  });
+  describe('PUI-6283 - WYSIWYG, Pressing space after adding a hyperlink', () => {
+    before(async () => {
+      const errorOnGo = await DSWysiwygCO.basicURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should display the value of the textarea properly', async () => {
+      await (await DSWysiwygCO.getTextInput()).waitForDisplayed();
+      await (await DSWysiwygCO.getTextInput()).click();
+      await DSWysiwygCO.selectText({ charCount: 5 });
+      await (await DSWysiwygCO.getInsertLinkBtn()).click({ x: 10 });
+      await (await DSWysiwygCO.getSavePopupLink()).click();
+      await (await DSWysiwygCO.getTextInput()).click();
+      await browser.keys(Key.Space);
+      await type('test string');
+      const text = await DSWysiwygCO.showText();
+      await expect(text).toHaveTextContaining('Hello test string');
+    });
+  });
+  describe('PUI-6755 - WYSIWYG, Protocol prefixed URL', () => {
+    before(async () => {
+      const errorOnGo = await DSWysiwygCO.basicURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should display the url properly prefixed', async () => {
+      await (await DSWysiwygCO.getTextInput()).waitForDisplayed();
+      await (await DSWysiwygCO.getTextInput()).click();
+      await DSWysiwygCO.selectText({ charCount: 5 });
+      await (await DSWysiwygCO.getInsertLinkBtn()).click({ x: 10 });
+      await (await DSWysiwygCO.getPopulLinkInput()).click();
+      await DSWysiwygCO.deleteText(5);
+      await type('https://google.com');
+      await (await DSWysiwygCO.getSavePopupLink()).click();
+      const urlInEditor = await DSWysiwygCO.getURLInEditor('https://google.com');
+      await expect(urlInEditor).toExist();
+    });
+  });
+  describe('PUI-6826 - WYSIWYG, mailto link formatting', () => {
+    before(async () => {
+      const errorOnGo = await DSWysiwygCO.basicURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should display the mailto url without prefix', async () => {
+      await (await DSWysiwygCO.getTextInput()).waitForDisplayed();
+      await (await DSWysiwygCO.getTextInput()).click();
+      await DSWysiwygCO.selectText({ charCount: 5 });
+      await (await DSWysiwygCO.getInsertLinkBtn()).click({ x: 10 });
+      await (await DSWysiwygCO.getPopulLinkInput()).click();
+      await DSWysiwygCO.deleteText(5);
+      await type('mailto:dimsum@elliemae.com');
+      await (await DSWysiwygCO.getSavePopupLink()).click();
+      const urlInEditor = await DSWysiwygCO.getURLInEditor('mailto:dimsum@elliemae.com');
+      await expect(urlInEditor).toExist();
+    });
+  });
+  describe('PUI-6827 - WYSIWYG, Template link formatting', () => {
+    before(async () => {
+      const errorOnGo = await DSWysiwygCO.basicURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should display the {{template_url}} without formatting', async () => {
+      await (await DSWysiwygCO.getTextInput()).waitForDisplayed();
+      await (await DSWysiwygCO.getTextInput()).click();
+      await DSWysiwygCO.selectText({ charCount: 5 });
+      await (await DSWysiwygCO.getInsertLinkBtn()).click({ x: 10 });
+      await (await DSWysiwygCO.getPopulLinkInput()).click();
+      await DSWysiwygCO.deleteText(5);
+      await type('{{template_url}}');
+      await (await DSWysiwygCO.getSavePopupLink()).click();
+      const urlInEditor = await DSWysiwygCO.getURLInEditor('{{template_url}}');
+      await expect(urlInEditor).toExist();
+    });
+  });
+  describe('PUI-7292 - WYSIWYG, Removing hyperlink', () => {
+    before(async () => {
+      const errorOnGo = await DSWysiwygCO.basicURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should insert the hyperlink correctly', async () => {
+      await (await DSWysiwygCO.getTextInput()).waitForDisplayed();
+      await (await DSWysiwygCO.getTextInput()).click();
+      await DSWysiwygCO.selectText({ charCount: 5 });
+      await (await DSWysiwygCO.getInsertLinkBtn()).click({ x: 10 });
+      await (await DSWysiwygCO.getSavePopupLink()).click();
+      const urlinEditor = await DSWysiwygCO.getURLInEditor('https://www.Hello');
+      await expect(urlinEditor).toExist();
+    });
+    it('should remove the hyperlink correctly', async () => {
+      await (await DSWysiwygCO.getURLInEditor('https://www.Hello')).click();
+      await (await DSWysiwygCO.getRemovePopupLink()).waitForDisplayed();
+      await (await DSWysiwygCO.getRemovePopupLink()).click();
+      const urlInEditor = await DSWysiwygCO.getURLInEditor('https://www.Hello');
+      await expect(urlInEditor).not.toExist();
+    });
+  });
+
+  // Copy&paste is not working in Firefox -- defect PUI-7369
+  if (browser.capabilities.browserName !== 'Firefox') {
+    describe('PUI-7367 - WYSIWYG, copy/paste hyperlink', () => {
+      before(async () => {
+        const errorOnGo = await DSWysiwygCO.basicURL.go();
+        if (errorOnGo) throw errorOnGo;
+      });
+      it('should insert the hyperlink correctly', async () => {
+        await (await DSWysiwygCO.getTextInput()).waitForDisplayed();
+        await (await DSWysiwygCO.getTextInput()).click();
+        await DSWysiwygCO.selectText({ charCount: 5 });
+        await (await DSWysiwygCO.getInsertLinkBtn()).click({ x: 10 });
+        await (await DSWysiwygCO.getHyperlinkDialogInput()).setValue('{{Hello.url}}');
+        await (await DSWysiwygCO.getSavePopupLink()).click();
+        const urlInEditor = await DSWysiwygCO.getURLInEditor('{{Hello.url}}');
+        await expect(urlInEditor).toExist();
+      });
+      it('copy & paste hyperlink', async () => {
+        await (await DSWysiwygCO.getTextInput()).waitForDisplayed();
+        await (await DSWysiwygCO.getTextInput()).click();
+        await DSWysiwygCO.selectText({ charCount: 5 });
+        if (browser.capabilities.browserName === 'Safari') {
+          await browser.keys([Key.Command, 'C']);
+          await browser.keys([Key.Command, 'V']);
+          await browser.keys([Key.Command, 'V']);
+        } else {
+          await browser.keys([Key.Control, 'c']);
+          await browser.keys([Key.Control, 'v']);
+          await browser.keys([Key.Control, 'v']);
+        }
+        const urlInEditorLenght = (await DSWysiwygCO.getURLsInEditor('{{Hello.url}}')).length;
+        await expect(urlInEditorLenght).toBe(2);
+      });
+    });
+  }
+
+  describe('PUI-11105 - [WYSIWYG] - Close second text editor', () => {
+    before(async () => {
+      const errorOnGo = await DSWysiwygCO.basicURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: Modal with second editor is displayed', async () => {
+      await (await DSWysiwygCO.getInsertBtn()).waitForDisplayed();
+      await (await DSWysiwygCO.getInsertBtn()).click();
+      await (await DSWysiwygCO.getComboOption(0)).click();
+      const modalToolbar = await DSWysiwygCO.getModalToolbar();
+      await expect(modalToolbar).toBeDisplayed();
+    });
+    it('02: First modal is displayed after closing the second one', async () => {
+      const modalClose = await DSWysiwygCO.getModalClose();
+      await modalClose.click();
+      const htmlModal = await DSWysiwygCO.showHTMLBtn();
+      await expect(htmlModal).toBeDisplayed();
+    });
+  });
+
+  describe('PUI-7841 - WYSIWYG, Tooltip displayed -Func', () => {
+    before(async () => {
+      const errorOnGo = await DSWysiwygCO.basicURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should display tooltip when hovering a SHOW HTML button', async () => {
+      await mouseOver(await DSWysiwygCO.showHTMLBtn());
+      const tooltip = await DSWysiwygCO.getTooltip();
+      await expect(tooltip).toBeDisplayed('');
+    });
+    it('should display tooltip when hovering any regular action button', async () => {
+      await mouseOver(await DSWysiwygCO.getBlotCenterAlingBtn());
+      const tooltip = await DSWysiwygCO.getTooltip();
+      await expect(tooltip).toBeDisplayed('');
+    });
+  });
+}

package/ds-wysiwyg/DSWysiwyg.image-positioning.func.spec.js

@@ -0,0 +1,43 @@
+import DSWysiwygCO from './DSWysiwygCO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-8423 - [WYSIWYG] - Image positioning - functional', () => {
+    before(async () => {
+      const errorOnGo = await DSWysiwygCO.imagePositioning.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('change image alignment to the center', async () => {
+      const image = DSWysiwygCO.getImage();
+      await image.click();
+      const centerBtn = await DSWysiwygCO.getBlotCenterAlingBtn();
+      await centerBtn.click();
+      const showHTML = await DSWysiwygCO.showHTMLBtn();
+      await showHTML.click();
+      const htmlText = await DSWysiwygCO.showHTML();
+      const expectedHtml = 'text-align: center';
+      await expect(htmlText).toHaveTextContaining(expectedHtml);
+    });
+    it('change image alignment to the right', async () => {
+      const showTextBtn = await DSWysiwygCO.showTextBtn();
+      await showTextBtn.click();
+      const rightBtn = await DSWysiwygCO.getBlotRightAlingBtn();
+      await rightBtn.click();
+      const showHTML = await DSWysiwygCO.showHTMLBtn();
+      await showHTML.click();
+      const htmlText = await DSWysiwygCO.showHTML();
+      const expectedHtml = '<p style="text-align: right;">';
+      await expect(htmlText).toHaveTextContaining(expectedHtml);
+    });
+    it('change image alignment to the left', async () => {
+      const showTextBtn = await DSWysiwygCO.showTextBtn();
+      await showTextBtn.click();
+      const leftBtn = await DSWysiwygCO.getBlotLeftAlingBtn();
+      await leftBtn.click();
+      const showHTML = await DSWysiwygCO.showHTMLBtn();
+      await showHTML.click();
+      const htmlText = await DSWysiwygCO.showHTML();
+      const expectedHtml = '<p>';
+      await expect(htmlText).toHaveTextContaining(expectedHtml);
+    });
+  });
+}

package/ds-wysiwyg/DSWysiwyg.visual.spec.js

@@ -0,0 +1,81 @@
+import { Key } from 'webdriverio';
+import DSWysiwygCO from './DSWysiwygCO';
+import { type } from '../helpers';
+
+if (
+  !browser.capabilities['ice:options'].isPhone &&
+  !browser.capabilities['ice:options'].isTablet &&
+  browser.capabilities.browserName !== 'Firefox'
+) {
+  describe('PUI-7363 - [WYSIWYG] - open hyperlink dialog in a mondal', () => {
+    before(async () => {
+      const errorOnGo = await DSWysiwygCO.inAModal.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('hyperlink dialog should be displayed correctly', async () => {
+      await browser.eyesOpen();
+      await (await DSWysiwygCO.getTextInput()).setValue('Hello');
+      await DSWysiwygCO.selectText({ charCount: 5 });
+      await (await DSWysiwygCO.getInsertLinkBtn()).click();
+      await (await DSWysiwygCO.getSavePopupLink()).waitForDisplayed();
+      const snapshot = await browser.eyesCheckSnapshot(DSWysiwygCO.snapshotPath('ds-wysiwyg-modal-hyperlink-dialog'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+
+  describe('PUI-8072 - [WYSIWYG] - Complex input shouldnt break the component', () => {
+    before(async () => {
+      const errorOnGo = await DSWysiwygCO.basicURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('Should properly display the WYSIWYG after complex input is received', async () => {
+      await browser.eyesOpen();
+      const showHtmlBtn = await DSWysiwygCO.getShowBtn();
+      await showHtmlBtn.click();
+      await browser.keys(Key.Tab);
+      await browser.keys(Key.Tab);
+      await browser.keys(Key.Tab);
+      await type(
+        // eslint-disable-next-line max-len
+        '<p>New to eSigning? <a href="http://help.elliemae.com/videos/eSigningCC/index.html" rel="noopener noreferrer" target="_blank">Click here to watch a video</a> that walks you through the eSigning process and explains how to use this website to view, sign, and return the requested loan documents.</p>',
+      );
+      const snapshot = await browser.eyesCheckSnapshot(DSWysiwygCO.snapshotPath('ds-wysiwyg-complex-input'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-8422 - [WYSIWYG] - Image positioning - visual', () => {
+    before(async () => {
+      const errorOnGo = await DSWysiwygCO.imagePositioning.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('change image alignment to the center', async () => {
+      await browser.eyesOpen();
+      const image = DSWysiwygCO.getImage();
+      await image.click();
+      const centerBtn = await DSWysiwygCO.getBlotCenterAlingBtn();
+      await centerBtn.click();
+      const snapshot = await browser.eyesCheckSnapshot(DSWysiwygCO.snapshotPath('ds-wysiwyg-image-position-center'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('change image alignment to the right', async () => {
+      await browser.eyesOpen();
+      const rightBtn = await DSWysiwygCO.getBlotRightAlingBtn();
+      await rightBtn.click();
+      const snapshot = await browser.eyesCheckSnapshot(DSWysiwygCO.snapshotPath('ds-wysiwyg-image-position-right'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+  describe('PUI-10957 - [WYSIWYG] - hideToolbar prop - visual', () => {
+    before(async () => {
+      const errorOnGo = await DSWysiwygCO.hideToolbar.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: toolbar should not be displayed', async () => {
+      await browser.eyesOpen();
+      const snapshot = await browser.eyesCheckSnapshot(DSWysiwygCO.snapshotPath('ds-wysiwyg-hide-toolbar'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/ds-wysiwyg/DSWysiwygCO.js

@@ -0,0 +1,166 @@
+/* eslint-disable max-lines */
+/* eslint-disable import/no-relative-packages */
+import { Key } from 'webdriverio';
+import { PATH_WYSIWYGEDITOR, PATH_E2E_WYSIWYGEDITOR } from '../../environments/storybook/paths';
+import { PageObject, Urlbuilder, getElementByIndex } from '../helpers';
+
+export default class DSWysiwygCO extends PageObject {
+  static basicURL = new Urlbuilder(PATH_E2E_WYSIWYGEDITOR, 'basic');
+
+  static withoutCustomToolbarURL = new Urlbuilder(PATH_E2E_WYSIWYGEDITOR, 'without-custom-toolbar');
+
+  static inAModal = new Urlbuilder(PATH_WYSIWYGEDITOR, 'in-a-modal');
+
+  static imagePositioning = new Urlbuilder(PATH_E2E_WYSIWYGEDITOR, 'image-positioning');
+
+  static hideToolbar = new Urlbuilder(PATH_E2E_WYSIWYGEDITOR, 'hide-toolbar');
+
+  static async getInsertBtn() {
+    return $('//button[@aria-label="Insert"]');
+  }
+
+  static async getTooltip() {
+    return $('[data-testid="ds-tooltip-v3-tooltip-text-wrapper"]');
+  }
+
+  static async getComboOption(index) {
+    return $$('//li[@role="menuitem"]')[index];
+  }
+
+  static async getUid(index = 0) {
+    return $$('.quill-wysiwyg-editor')[index].getAttribute('data-uid');
+  }
+
+  static async getModalToolbar() {
+    return $('#custom-toolbar-2');
+  }
+
+  static async showHTML() {
+    return $('textarea');
+  }
+
+  static async showHTMLBtn() {
+    return $('//button[contains(text(),"SHOW HTML")]');
+  }
+
+  static async showTextBtn() {
+    return $('//button[contains(text(),"SHOW TEXT")]');
+  }
+
+  static async showText() {
+    const uid = await this.getUid();
+    return $(`#wysiwyg-text-container-${uid}`);
+  }
+
+  static async showTextModal() {
+    const uid = await this.getUid(1);
+    return $$(`#wysiwyg-text-container-${uid}`)[1];
+  }
+
+  static async showHTMLModal() {
+    return $$('textarea')[1];
+  }
+
+  static async showHTMLBtnModal() {
+    return $$('//button[contains(text(),"SHOW HTML")]')[1];
+  }
+
+  static async showTextBtnModal() {
+    return $$('//button[contains(text(),"SHOW TEXT")]')[1];
+  }
+
+  static async textInputModal() {
+    const uid = await this.getUid(1);
+    return $(`#wysiwyg-text-container-${uid} div div:nth-child(1)`);
+  }
+
+  static async getTextInput() {
+    const uid = await this.getUid();
+    return $(`#wysiwyg-text-container-${uid} div div:nth-child(1)`);
+  }
+
+  static async getTextArea() {
+    return $('[id="wysiwyg-text-container"]');
+  }
+
+  static async getInsertLinkBtn() {
+    return $('.ql-link');
+  }
+
+  static async getSavePopupLink() {
+    return $('.ql-tooltip.ql-editing .ql-action');
+  }
+
+  static async getRemovePopupLink() {
+    return $('.ql-remove');
+  }
+
+  static async getPopulLinkInput() {
+    return $('.ql-tooltip.ql-editing input[type="text"]');
+  }
+
+  static async selectText({ charCount = 1, leftSelection = true }) {
+    for (let count = 0; count < charCount; count += 1) {
+      // eslint-disable-next-line no-await-in-loop
+      await browser.keys([Key.Shift, leftSelection ? Key.ArrowLeft : Key.ArrowRight]);
+    }
+  }
+
+  static async deleteText(charCount) {
+    for (let count = 0; count < charCount; count += 1) {
+      // eslint-disable-next-line no-await-in-loop
+      await browser.keys(Key.Backspace);
+    }
+  }
+
+  static async getHyperlinkDialogInput() {
+    return $('//input[@data-formula="e=mc^2"]');
+  }
+
+  static async getURLInEditor(url) {
+    return $(`//h1/a[@href="${url}"]`);
+  }
+
+  static async getURLIn(index) {
+    return $$('//h1/a')[index];
+  }
+
+  static async getURLsInEditor(url) {
+    return $$(`//h1/a[@href="${url}"]`);
+  }
+
+  static async getBtns() {
+    return $$('[data-testid="ds-tooltip-v3-trigger-wrapper"]');
+  }
+
+  static getShowBtn = async () => getElementByIndex(this.getBtns, 19);
+
+  static getImage() {
+    return $('p > img');
+  }
+
+  static getBlotFormatter() {
+    return $('.blot-formatter__overlay');
+  }
+
+  static getBlotRightAlingBtn() {
+    return $('[class="ql-align"][value="right"]');
+  }
+
+  static getBlotCenterAlingBtn() {
+    return $('[class="ql-align"][value="center"]');
+  }
+
+  static getBlotLeftAlingBtn() {
+    return $('[class="ql-align"][value=""]');
+  }
+
+  static getModalClose() {
+    return $('[data-testid="modal-button-close"]');
+  }
+
+  // Snapshots
+  static snapshotPath(example = 'basic') {
+    return PageObject.getSnapshotPathBuilder('DSWysiwyg', example, 'ds-wysiwyg');
+  }
+}

package/ds-zipcode-search/DSZipCodeSearch.func.spec.js

@@ -0,0 +1,55 @@
+import DSZipCodeSearchCO from './DSZipCodeSearchCO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('ZipCodeSearch - applies mask only on 6th character', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSZipCodeSearchCO.basic.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it("should not add '-' at 5 digits", async () => {
+      const input = await DSZipCodeSearchCO.getFirstInput();
+      await input.click();
+      await DSZipCodeSearchCO.typeNumbers('12345');
+      const inputValue = await input.getValue();
+      await expect(inputValue).toEqual('12345');
+    });
+    it("should add '-' after the 6th digit", async () => {
+      const input = await DSZipCodeSearchCO.getFirstInput();
+      await input.click();
+      await DSZipCodeSearchCO.typeNumbers('6');
+      const inputValue = await input.getValue();
+      await expect(inputValue).toEqual('12345-6');
+    });
+    it("should remove '-' if 6th digit is removed", async () => {
+      const input = await DSZipCodeSearchCO.getFirstInput();
+      await input.click();
+      await DSZipCodeSearchCO.triggerBackspace(1);
+      const inputValue = await input.getValue();
+      await expect(inputValue).toEqual('12345');
+    });
+  });
+  describe('PUI-5938 - ZipCodeSearch, tabindex prop', () => {
+    before(async () => {
+      const errorOnGo = await DSZipCodeSearchCO.basic.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should support tabindex prop', async () => {
+      await (await DSZipCodeSearchCO.getFirstInput()).waitForDisplayed({ timeout: 10000 });
+      const firstInputTabIndex = await (await DSZipCodeSearchCO.getFirstInput()).getAttribute('tabindex');
+      await expect(firstInputTabIndex).toEqual('2');
+    });
+  });
+
+  describe('PUI-9770 - ZipCodeSearch, passing an int instead of an string', () => {
+    before(async () => {
+      const errorOnGo = await DSZipCodeSearchCO.passingFloatTest.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should display the component even when given wrong type of data', async () => {
+      const input = await DSZipCodeSearchCO.getFirstInput();
+      await input.click();
+      const inputValue = await input.getValue();
+      await expect(inputValue).toEqual('68');
+    });
+  });
+}

package/ds-zipcode-search/DSZipCodeSearchCO.js

@@ -0,0 +1,37 @@
+import { Key } from 'webdriverio';
+import { PATH_ZIP_CODE_SEARCH, PATH_E2E_ZIPCODESEARCH } from '../../environments/storybook/paths';
+import { PageObject, Urlbuilder } from '../helpers';
+
+export default class DSZipCodeSearchCO extends PageObject {
+  // Atomic
+  static basic = new Urlbuilder(PATH_ZIP_CODE_SEARCH, 'basic');
+
+  static passingFloatTest = new Urlbuilder(PATH_E2E_ZIPCODESEARCH, 'passing-float-instead-test');
+
+  // selectors
+  static async getFirstInput() {
+    return $('[data-testid="ds-input_main-component"]');
+  }
+
+  static async typeNumbers(chars = '1234567890') {
+    // const input = this.getInput();
+    const numbers = [...chars];
+    // input.click();
+    // eslint-disable-next-line no-restricted-syntax
+    for (const char of numbers) {
+      // https://github.com/webdriverio/webdriverio/issues/5092
+      // using keys char by char results in correct order
+      // eslint-disable-next-line no-await-in-loop
+      await browser.keys(char);
+    }
+  }
+
+  static async triggerBackspace(number = 1) {
+    for (let x = 0; x < number; x += 1) {
+      // eslint-disable-next-line no-await-in-loop
+      await browser.keys(Key.Backspace);
+    }
+  }
+  // actions
+  // utils
+}

package/ds-zoom/DSZoom.func.spec.js

@@ -0,0 +1,17 @@
+import DSZoomCO from './DSZoomCO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-5934 - Zoom - with form item layout', () => {
+    before(async () => {
+      const errorOnGo = await DSZoomCO.withFormItemLayout.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should select correctly an option from menu', async () => {
+      await (await DSZoomCO.getCombobox()).waitForDisplayed();
+      await (await DSZoomCO.getCombobox()).click();
+      await (await DSZoomCO.getComboboxOption('25%')).click();
+      const comboBoxValue = await DSZoomCO.getComboboxValue();
+      await expect(comboBoxValue).toHaveTextContaining('25%');
+    });
+  });
+}

package/ds-zoom/DSZoom.visual.spec.js

@@ -0,0 +1,26 @@
+import DSZoomCO from './DSZoomCO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-5931 - Zoom - visual test, other options', () => {
+    before(async () => {
+      const errorOnGo = await DSZoomCO.otherOptions.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should display zoom correctly', async () => {
+      await (await DSZoomCO.getCombobox(0)).waitForDisplayed();
+      const snapshot = await browser.checkSnapshot(DSZoomCO.snapshotPath('other-options'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+  describe('PUI-5932 - Zoom - visual test, with form item layout', () => {
+    before(async () => {
+      const errorOnGo = await DSZoomCO.withFormItemLayout.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('should display zoom with form item layout', async () => {
+      await (await DSZoomCO.getCombobox()).waitForDisplayed();
+      const snapshot = await browser.checkSnapshot(DSZoomCO.snapshotPath('with-form-item-layout'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}