dimsum-e2e-tests 1.0.36 → 1.2.0

package/ds-controlled-form/ds-controlled-inputgroup/autocomplete/DSControlledInputGroup.autocomplete.axe-core.func.spec.js

@@ -1,6 +1,7 @@
 /* eslint-disable max-len */
 import { Key } from 'webdriverio';
 import DSControlledInputGroupCO from '../DSControlledInputGroupCO';
+import DSInputTextCO from '../../ds-input-text/DSInputTextCO';
 import { axeCoreCheck, type } from '../../../helpers';
 
 if (
@@ -15,13 +16,13 @@ if (
       if (errorOnGo) throw errorOnGo;
     });
     it('01: should pass axe-core scan without violations', async () => {
-      const input = await DSControlledInputGroupCO.getInputByIndex(0);
+      const input = await DSInputTextCO.getInputTextByIndex(0);
       await input.waitForDisplayed();
       const result = await axeCoreCheck();
       expect(result.length).toBe(0);
     });
     it('02: should pass axe-core scan without violations after type', async () => {
-      const input = await DSControlledInputGroupCO.getInputByIndex(0);
+      const input = await DSInputTextCO.getInputTextByIndex(0);
       await input.waitForDisplayed();
       await browser.keys(Key.Tab);
       await browser.keys(Key.Tab);
@@ -32,7 +33,7 @@ if (
       expect(result.length).toBe(0);
     });
     it('03: should pass axe-core scan without violations after select an option', async () => {
-      const input = await DSControlledInputGroupCO.getInputByIndex(0);
+      const input = await DSInputTextCO.getInputTextByIndex(0);
       await input.waitForDisplayed();
       await browser.keys(Key.Tab);
       await browser.keys(Key.Tab);
@@ -40,9 +41,7 @@ if (
       const menuList = await DSControlledInputGroupCO.getAutocompleteMenuList();
       await menuList.waitForDisplayed();
       await browser.keys(Key.Enter);
-      const inputValue = await DSControlledInputGroupCO.getInputValue(
-        'Luke Skywalker too long this text is super long',
-      );
+      const inputValue = await DSInputTextCO.getInputValue('Luke Skywalker too long this text is super long');
       await inputValue.waitForDisplayed();
       const result = await axeCoreCheck();
       expect(result.length).toBe(0);

package/ds-controlled-form/ds-controlled-inputgroup/basic/DSControlledInputGroup.basic.axe-core.func.spec.js

@@ -1,5 +1,6 @@
 /* eslint-disable max-len */
 import DSControlledInputGroupCO from '../DSControlledInputGroupCO';
+import DSInputTextCO from '../../ds-input-text/DSInputTextCO';
 import { axeCoreCheck } from '../../../helpers';
 
 if (
@@ -14,13 +15,13 @@ if (
       if (errorOnGo) throw errorOnGo;
     });
     it('01: should pass axe-core scan without violations', async () => {
-      const input = await DSControlledInputGroupCO.getInputByIndex(0);
+      const input = await DSInputTextCO.getInputTextByIndex(0);
       await input.waitForDisplayed();
       const result = await axeCoreCheck();
       expect(result.length).toBe(0);
     });
     it('02: should pass axe-core scan without violations after type', async () => {
-      const input = await DSControlledInputGroupCO.getInputByIndex(0);
+      const input = await DSInputTextCO.getInputTextByIndex(0);
       await input.setValue('Test');
       const result = await axeCoreCheck();
       expect(result.length).toBe(0);

package/ds-controlled-form/ds-controlled-inputgroup/basic/DSControlledInputGroup.basic.visual.spec.js

@@ -1,4 +1,5 @@
 import DSControlledInputGroupCO from '../DSControlledInputGroupCO';
+import DSInputTextCO from '../../ds-input-text/DSInputTextCO';
 import { mouseOver } from '../../../helpers';
 
 if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
@@ -9,7 +10,7 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
     });
     it('should display the basic group inputs correctly - hover addon', async () => {
       await browser.eyesOpen();
-      const input = await DSControlledInputGroupCO.getInputByIndex(1);
+      const input = await DSInputTextCO.getInputTextByIndex(1);
       const addon = await DSControlledInputGroupCO.getButtonByIndex(2);
       await input.click();
       await mouseOver(addon);
@@ -20,7 +21,7 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
     });
     it('should display the basic group inputs correctly - hover input', async () => {
       await browser.eyesOpen();
-      const input = await DSControlledInputGroupCO.getInputByIndex(0);
+      const input = await DSInputTextCO.getInputTextByIndex(0);
       const addon = await DSControlledInputGroupCO.getButtonByIndex(1);
       await addon.click();
       await mouseOver(input);

package/ds-controlled-form/ds-controlled-inputgroup/form-item-layout/DSControlledInputGroup.form-item-layout.axe-core.func.spec.js

@@ -1,5 +1,6 @@
 /* eslint-disable max-len */
 import DSControlledInputGroupCO from '../DSControlledInputGroupCO';
+import DSInputTextCO from '../../ds-input-text/DSInputTextCO';
 import { axeCoreCheck } from '../../../helpers';
 
 if (
@@ -14,7 +15,7 @@ if (
       if (errorOnGo) throw errorOnGo;
     });
     it('01: should pass axe-core scan without violations', async () => {
-      const input = await DSControlledInputGroupCO.getInputByIndex(0);
+      const input = await DSInputTextCO.getInputTextByIndex(0);
       await input.waitForDisplayed();
       const result = await axeCoreCheck();
       expect(result.length).toBe(0);

package/ds-controlled-form/ds-controlled-inputgroup/form-item-layout/DSControlledInputGroup.form-item-layout.func.spec.js

@@ -1,4 +1,5 @@
 import DSControlledInputGroupCO from '../DSControlledInputGroupCO';
+import DSInputTextCO from '../../ds-input-text/DSInputTextCO';
 
 if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
   describe('PUI-8336 - DSControlledInputGroupCO - Disable input addon -func ', () => {
@@ -7,13 +8,13 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       if (errorOnGo) throw errorOnGo;
     });
     it('should display the input default', async () => {
-      const input = await DSControlledInputGroupCO.getInput();
+      const input = await DSInputTextCO.getInputText();
       await expect(input).toBeClickable();
     });
     it('should display the input disabled after clicking the disable addon', async () => {
       const disableAddon = await DSControlledInputGroupCO.getLeftAddOnByIndex(0);
       await disableAddon.click();
-      const input = await DSControlledInputGroupCO.getInput();
+      const input = await DSInputTextCO.getInputText();
       await expect(input).toBeDisabled();
     });
   });

package/ds-controlled-form/ds-controlled-inputgroup/protected/DSControlledInputGroup.protected.axe-core.func.spec.js

@@ -1,5 +1,6 @@
 /* eslint-disable max-len */
 import DSControlledInputGroupCO from '../DSControlledInputGroupCO';
+import DSInputTextCO from '../../ds-input-text/DSInputTextCO';
 import { axeCoreCheck } from '../../../helpers';
 
 if (
@@ -14,13 +15,13 @@ if (
       if (errorOnGo) throw errorOnGo;
     });
     it('01: should pass axe-core scan without violations', async () => {
-      const input = await DSControlledInputGroupCO.getInputByIndex(0);
+      const input = await DSInputTextCO.getInputTextByIndex(0);
       await input.waitForDisplayed();
       const result = await axeCoreCheck();
       expect(result.length).toBe(0);
     });
     it('02: should pass axe-core scan without violations after type', async () => {
-      const input = await DSControlledInputGroupCO.getInputByIndex(0);
+      const input = await DSInputTextCO.getInputTextByIndex(0);
       await input.setValue('Test');
       const result = await axeCoreCheck();
       expect(result.length).toBe(0);

package/ds-controlled-form/ds-controlled-inputgroup/protected/DSControlledInputGroup.protected.func.spec.js

@@ -1,5 +1,6 @@
 import { type } from '../../../helpers';
 import DSControlledInputGroupCO from '../DSControlledInputGroupCO';
+import DSInputTextCO from '../../ds-input-text/DSInputTextCO';
 
 if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
   describe('PUI-8650 - DSControlledInputGroupCO - No text value on html - Visual Test ', () => {
@@ -8,7 +9,7 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       if (errorOnGo) throw errorOnGo;
     });
     it('01: should not get the text value from the html', async () => {
-      const input = await DSControlledInputGroupCO.getInput();
+      const input = await DSInputTextCO.getInputText();
       await input.click();
       await type('Obi Juan Quenovi');
       const try1 = await input.getText();

package/ds-controlled-form/ds-controlled-inputgroup/protected/DSControlledInputGroup.protected.visual.spec.js

@@ -1,5 +1,6 @@
 import { type } from '../../../helpers';
 import DSControlledInputGroupCO from '../DSControlledInputGroupCO';
+import DSInputTextCO from '../../ds-input-text/DSInputTextCO';
 
 if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
   describe('PUI-8335 - DSControlledInputGroupCO - Addons - Visual Test ', () => {
@@ -8,7 +9,7 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       if (errorOnGo) throw errorOnGo;
     });
     it('01: should display the protected group input populated', async () => {
-      const input = await DSControlledInputGroupCO.getInput();
+      const input = await DSInputTextCO.getInputText();
       await input.click();
       await type('Obi Juan Quenovi');
       const snapshot = await browser.checkSnapshot(DSControlledInputGroupCO.snapshotPath('protectedinput-populated'));

package/ds-controlled-form/ds-input-text/DSInputText.clearable.keyboard.func.spec.js

@@ -27,7 +27,7 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
     it('04: should type the input correctly', async () => {
       const input = await DSInputTextCO.getInputText();
       await type('1t2e3s5t');
-      await expect(input).toHaveValueContaining('1t2e3s5t');
+      await expect(input).toHaveValue(expect.stringContaining('1t2e3s5t'));
     });
     it('05: should focus the clear btn correctly', async () => {
       const clearBtn = await DSInputTextCO.getClearBtn();
@@ -39,7 +39,7 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       const clearBtn = await DSInputTextCO.getClearBtn();
       const input = await DSInputTextCO.getInputText();
       await expect(clearBtn).not.toBeDisplayed();
-      await expect(input).toHaveValueContaining('');
+      await expect(input).toHaveValue(expect.stringContaining(''));
     });
   });
 }

package/ds-controlled-form/ds-input-text/DSInputText.func.spec.js

@@ -1,3 +1,4 @@
+/* eslint-disable max-len */
 /* eslint-disable max-lines */
 import { Key } from 'webdriverio';
 import { type } from '../../helpers';
@@ -9,14 +10,14 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       const errorOnGo = await DSInputTextCO.clearable.go();
       if (errorOnGo) throw errorOnGo;
     });
-    it('should write some text on the input and change the input value', async () => {
+    it('01: should write some text on the input and change the input value', async () => {
       const input = await DSInputTextCO.getInputText();
       await input.click();
       await type('Hola');
       const inputValue = await input.getAttribute('value');
       await expect(inputValue).toEqual('Hola');
     });
-    it('should erase the content from within the input and have an empty value for the input', async () => {
+    it('02: should erase the content from within the input and have an empty value for the input', async () => {
       const input = await DSInputTextCO.getInputText();
       await input.click();
       await browser.keys(Key.Backspace);
@@ -33,44 +34,45 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       const errorOnGo = await DSInputTextCO.autocompleteURL.go();
       if (errorOnGo) throw errorOnGo;
     });
-    it('should not open the autocomplete list if there are no characters even with focus', async () => {
+    it('01: should not open the autocomplete list if there are no characters even with focus', async () => {
       const input = await DSInputTextCO.getInputText();
       await input.click();
       const autocompleteList = await DSInputTextCO.getAutocompleteMenuList();
       await expect(autocompleteList).not.toBeDisplayedInViewport();
     });
-    it('should display autocomplete list after getting one character in the input', async () => {
+    it('02: should display autocomplete list after getting one character in the input', async () => {
       await type('4');
       const autocompleteList = await DSInputTextCO.getAutocompleteMenuList();
       await expect(autocompleteList).toBeDisplayedInViewport();
     });
-    it('should not close the autocomplete list after getting more characters', async () => {
+    it('03: should not close the autocomplete list after getting more characters', async () => {
       await type('4');
       const autocompleteList = await DSInputTextCO.getAutocompleteMenuList();
       await expect(autocompleteList).toBeDisplayedInViewport();
     });
-    it('should close the autocomplete list after getting more characters which dont match any option', async () => {
+    it('04: should close the autocomplete list after getting more characters which dont match any option', async () => {
       await type('Z');
       const autocompleteList = await DSInputTextCO.getAutocompleteMenuList();
       await expect(autocompleteList).not.toBeDisplayedInViewport();
     });
-    it('should display autocomplete options after erasing the character which caused a mismatch', async () => {
+    it('05: should display autocomplete options after erasing the character which caused a mismatch', async () => {
       await browser.keys(Key.Backspace);
       const autocompleteList = await DSInputTextCO.getAutocompleteMenuList();
       await expect(autocompleteList).toBeDisplayedInViewport();
     });
-    it('should not close the autocomplete list after deleting a character if there are characters left', async () => {
+    it('06: should not close the autocomplete list after deleting a character if there are characters left', async () => {
       await browser.keys(Key.Backspace);
       const autocompleteList = await DSInputTextCO.getAutocompleteMenuList();
       await expect(autocompleteList).toBeDisplayedInViewport();
     });
-    it('should close the autocomplete list after deleting a character if there are no characters left', async () => {
+    it('07: should close the autocomplete list after deleting a character if there are no characters left', async () => {
       await browser.keys(Key.Backspace);
       const autocompleteList = await DSInputTextCO.getAutocompleteMenuList();
       await expect(autocompleteList).not.toBeDisplayedInViewport();
     });
-    it('should select the first autocomplete list item and change the value of the input', async () => {
+    it('08: should select the first autocomplete list item and change the value of the input', async () => {
       await type('4');
+      await browser.keys(Key.ArrowDown);
       await browser.keys(Key.Enter);
       const input = await DSInputTextCO.getInputText();
       const autocompleteList = await DSInputTextCO.getAutocompleteMenuList();
@@ -85,7 +87,7 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       const errorOnGo = await DSInputTextCO.autocompleteURL.go();
       if (errorOnGo) throw errorOnGo;
     });
-    it('should click an autocomplete option and the input should have that value', async () => {
+    it('01: should click an autocomplete option and the input should have that value', async () => {
       const input = await DSInputTextCO.getInputText();
       await input.click();
       await type('44');
@@ -103,7 +105,7 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       const errorOnGo = await DSInputTextCO.clearable.go();
       if (errorOnGo) throw errorOnGo;
     });
-    it('should click an autocomplete option and the input should have that value', async () => {
+    it('01: should click an autocomplete option and the input should have that value', async () => {
       const input = await DSInputTextCO.getInputText();
       await input.click();
       await type('Hola');

package/ds-controlled-form/ds-input-text/DSInputTextCO.js

@@ -1,14 +1,17 @@
 // eslint-disable-next-line import/no-relative-packages
+import { DSInputTextDataTestIds } from '@elliemae/ds-legacy-form-input-text';
 import { PATH_E2E_CONTROLLEDINPUT } from '../../../environments/storybook/paths';
 import { PageObject, Urlbuilder, getElementByIndex } from '../../helpers';
 
-export default class DSLargeInputCO extends PageObject {
+export default class DSInputTextCO extends PageObject {
   static clearable = new Urlbuilder(PATH_E2E_CONTROLLEDINPUT, 'clearable-E-2-e');
 
   static formLayoutBlockURL = new Urlbuilder(PATH_E2E_CONTROLLEDINPUT, 'with-form-layout-block-item');
 
   static stylesURL = new Urlbuilder(PATH_E2E_CONTROLLEDINPUT, 'default-styles');
 
+  static slotsURL = new Urlbuilder(PATH_E2E_CONTROLLEDINPUT, 'slots-test');
+
   static disabledURL = new Urlbuilder(PATH_E2E_CONTROLLEDINPUT, 'disabled-test');
 
   static sizesURL = new Urlbuilder(PATH_E2E_CONTROLLEDINPUT, 'sizes-E-2-e');
@@ -19,6 +22,14 @@ export default class DSLargeInputCO extends PageObject {
 
   static autocompleteURL = new Urlbuilder(PATH_E2E_CONTROLLEDINPUT, 'with-autocomplete');
 
+  static applyAriaDisabled = new Urlbuilder(PATH_E2E_CONTROLLEDINPUT, 'apply-aria-disabled-test');
+
+  static placeholderURL = new Urlbuilder(PATH_E2E_CONTROLLEDINPUT, 'place-holder-test');
+
+  static readOnly = new Urlbuilder(PATH_E2E_CONTROLLEDINPUT, 'read-only-test');
+
+  static applyAriaDisabledOnChange = new Urlbuilder(PATH_E2E_CONTROLLEDINPUT, 'apply-aria-disabled-change');
+
   static async getAutocompleteMenuList() {
     return $('[data-testid="autocomplete-menu-list"]');
   }
@@ -29,22 +40,34 @@ export default class DSLargeInputCO extends PageObject {
 
   static getAutocompleteOptionByIndex = async (index) => getElementByIndex(this.getAutocompleteOptions, index);
 
-  static async getInputTexContainer() {
-    return $('//input[@data-testid="ds-input-text"]/ancestor::div');
-  }
-
   static async getInputText() {
-    return $('[data-testid="ds-input-text-input"]');
+    return $(`[data-testid="${DSInputTextDataTestIds.INPUT}"]`);
   }
 
   static async getInputTexts() {
-    return $$('[data-testid="ds-input-text-input"]');
+    return $$(`[data-testid="${DSInputTextDataTestIds.INPUT}"]`);
+  }
+
+  static async getInputValue(value) {
+    return $(`[data-testid="${DSInputTextDataTestIds.INPUT}"][value="${value}"]`);
   }
 
   static getInputTextByIndex = async (index) => getElementByIndex(this.getInputTexts, index);
 
   static async getClearBtn() {
-    return $('[data-testid="ds-input-text-clear-button"]');
+    return $(`[data-testid="${DSInputTextDataTestIds.CLEAR_BUTTON}"]`);
+  }
+
+  static async getInputSlotByIndex(index = 0) {
+    return $$(`[data-dimsum-slot="dsInputtextInput"]`)[index];
+  }
+
+  static async getRootSlotByIndex(index = 0) {
+    return $$(`[data-dimsum-slot="dsInputtextRoot"]`)[index];
+  }
+
+  static async getClearBtnSlotByIndex(index = 0) {
+    return $$(`[data-dimsum-slot="dsButtonRoot"]`)[index];
   }
 
   static snapshotPath(example = 'basic') {

package/ds-controlled-form/ds-input-text/aria-disabled/DSInputText.aria-disabled.axe-core.func.spec.js

@@ -0,0 +1,23 @@
+/* eslint-disable max-lines */
+import { axeCoreCheck } from '../../../helpers';
+import DSInputTextCO from '../DSInputTextCO';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-14407 - [InputText] applyAriaDisabled prop - axe-core test', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSInputTextCO.applyAriaDisabled.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: first aria-disabled Input should be focused and pass axe-core scan', async () => {
+      const input1 = await DSInputTextCO.getInputTextByIndex(0);
+      await input1.click();
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+  });
+}

package/ds-controlled-form/ds-input-text/aria-disabled/DSInputText.aria-disabled.func.spec.js

@@ -0,0 +1,42 @@
+/* eslint-disable max-lines */
+import DSInputTextCO from '../DSInputTextCO';
+import { type } from '../../../helpers';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-15257 - [InputText] applyAriaDisabled prop - func test', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSInputTextCO.applyAriaDisabled.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: first aria-disabled Input should not display the caret', async () => {
+      const input1 = await DSInputTextCO.getInputTextByIndex(0);
+      await input1.click();
+      const caretColor = await input1.getCSSProperty('caret-color');
+      const caretValue = caretColor.value;
+      await expect(caretValue).toBe('rgba(0,0,0,0)');
+    });
+  });
+  describe('PUI-15686 - [InputText] applyAriaDisabled - onChange - func test', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSInputTextCO.applyAriaDisabledOnChange.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: first aria-disabled Input should not allow to type', async () => {
+      const input1 = await DSInputTextCO.getInputTextByIndex(0);
+      await input1.click();
+      await type('This is a test');
+      await expect(input1).toHaveValue('');
+    });
+    it('02: second aria-disabled Input should not change the value', async () => {
+      const input1 = await DSInputTextCO.getInputTextByIndex(1);
+      await input1.click();
+      await type('This is a test');
+      await expect(input1).toHaveValue('Some Value');
+    });
+  });
+}

package/ds-controlled-form/ds-input-text/aria-disabled/DSInputText.aria-disabled.visual.spec.js

@@ -0,0 +1,28 @@
+/* eslint-disable max-lines */
+/* eslint-disable prettier/prettier */
+import { Key } from 'webdriverio';
+import DSInputTextCO from '../DSInputTextCO';
+import { type } from '../../../helpers';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-14406 - [InputText] applyAriaDisabled prop - visual Test', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSInputTextCO.applyAriaDisabled.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: first aria-disabled Input should be focused', async () => {
+      await browser.eyesOpen();
+      const firstInput = await DSInputTextCO.getInputTextByIndex(0);
+      await firstInput.click();
+      const snapshot = await browser.eyesCheckSnapshot(DSInputTextCO.snapshotPath('input-text-aria-disabled-mouse'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('02: second aria-disabled InputText should be focused and value not changed', async () => {
+      await browser.eyesOpen();
+      await browser.keys(Key.Tab);
+      await type('Test');
+      const snapshot = await browser.eyesCheckSnapshot(DSInputTextCO.snapshotPath('input-text-aria-disabled-kb-nav'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/ds-controlled-form/ds-input-text/placeholder/DSInputText.placeholder.visual.spec.js

@@ -0,0 +1,15 @@
+import DSInputTextCO from '../DSInputTextCO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-14538 - [InputText] placeholder prop - visual Test', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSInputTextCO.placeholderURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should display a showcase of InputText component with the prop placeholder', async () => {
+      await browser.eyesOpen();
+      const snapshot = await browser.eyesCheckSnapshot(DSInputTextCO.snapshotPath('input-text-placeholder'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/ds-controlled-form/ds-input-text/read-only/DSInputText.read-only.axe-core.func.spec.js

@@ -0,0 +1,23 @@
+/* eslint-disable max-lines */
+import { axeCoreCheck } from '../../../helpers';
+import DSInputTextCO from '../DSInputTextCO';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-15331 - [InputText] readOnly prop - axe-core test', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSInputTextCO.readOnly.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: first readOnly Input should be focused and pass axe-core scan', async () => {
+      const input1 = await DSInputTextCO.getInputTextByIndex(0);
+      await input1.click();
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+  });
+}

package/ds-controlled-form/ds-input-text/read-only/DSInputText.read-only.func.spec.js

@@ -0,0 +1,23 @@
+/* eslint-disable max-lines */
+import DSInputTextCO from '../DSInputTextCO';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-15332 - [InputText] readOnly prop - func test', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSInputTextCO.readOnly.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: first readOnly Input should not display the caret', async () => {
+      const input1 = await DSInputTextCO.getInputTextByIndex(0);
+      await input1.click();
+      const caretColor = await input1.getCSSProperty('caret-color');
+      const caretValue = caretColor.value;
+      await expect(caretValue).toBe('rgba(0,0,0,0)');
+    });
+  });
+}

package/ds-controlled-form/ds-input-text/read-only/DSInputText.read-only.visual.spec.js

@@ -0,0 +1,28 @@
+/* eslint-disable max-lines */
+/* eslint-disable prettier/prettier */
+import { Key } from 'webdriverio';
+import DSInputTextCO from '../DSInputTextCO';
+import { type } from '../../../helpers';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-15330 - [InputText] readOnly prop - visual Test', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSInputTextCO.readOnly.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: first read-only Input should be focused', async () => {
+      await browser.eyesOpen();
+      const firstInput = await DSInputTextCO.getInputTextByIndex(0);
+      await firstInput.click();
+      const snapshot = await browser.eyesCheckSnapshot(DSInputTextCO.snapshotPath('input-text-read-only-mouse'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('02: second read-only InputText should be focused and value not changed', async () => {
+      await browser.eyesOpen();
+      await browser.keys(Key.Tab);
+      await type('Test');
+      const snapshot = await browser.eyesCheckSnapshot(DSInputTextCO.snapshotPath('input-text-read-only-kb-nav'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/ds-controlled-form/ds-input-text/slots/DSInputText.slots.axe-core.func.spec.js

@@ -0,0 +1,23 @@
+/* eslint-disable max-lines */
+import { axeCoreCheck } from '../../../helpers';
+import DSInputTextCO from '../DSInputTextCO';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-15312 - DSControlledInputText: Slots -AxeCore', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSInputTextCO.slotsURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should have customized slots input text and pass axe-core scan', async () => {
+      const input1 = await DSInputTextCO.getRootSlotByIndex();
+      await input1.waitForDisplayed();
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+  });
+}

package/ds-controlled-form/ds-input-text/slots/DSInputText.slots.func.spec.js

@@ -0,0 +1,35 @@
+/* eslint-disable max-len */
+/* eslint-disable max-lines */
+import DSInputTextCO from '../DSInputTextCO';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-15318 - DSControlledInputText - Slots: Basic Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSInputTextCO.slotsURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should have input text slots with custom aria-attributes', async () => {
+      const root = await DSInputTextCO.getRootSlotByIndex();
+      const input = await DSInputTextCO.getInputSlotByIndex();
+      const clearable = await DSInputTextCO.getClearBtnSlotByIndex();
+      await root.waitForDisplayed();
+      await expect(root).toHaveAttribute('aria-label', 'im input wrapper aria');
+      await expect(input).toHaveAttribute('aria-label', 'im input aria');
+      await expect(clearable).toHaveAttribute('aria-label', 'im clear button aria');
+    });
+    it('02: should have input text slots with custom data-attributes', async () => {
+      const root = await DSInputTextCO.getRootSlotByIndex();
+      const input = await DSInputTextCO.getInputSlotByIndex();
+      const clearable = await DSInputTextCO.getClearBtnSlotByIndex();
+      await root.waitForDisplayed();
+      await expect(root).toHaveAttribute('data-testid', 'im input wrapper data');
+      await expect(input).toHaveAttribute('data-testid', 'im input data');
+      await expect(clearable).toHaveAttribute('data-testid', 'im clear button data');
+    });
+  });
+}

package/ds-controlled-form/ds-input-text/slots/DSInputText.slots.visual.spec.js

@@ -0,0 +1,19 @@
+/* eslint-disable max-lines */
+/* eslint-disable prettier/prettier */
+import DSInputTextCO from '../DSInputTextCO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-15317 - DSControlledInputText: Slots  - Visual', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSInputTextCO.slotsURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should display customized inputs (one clearable) matching baseline', async () => {
+      await browser.eyesOpen();
+      const input = await DSInputTextCO.getRootSlotByIndex();
+      await input.waitForDisplayed();
+      const snapshot = await browser.eyesCheckSnapshot(DSInputTextCO.snapshotPath('input-text-slots'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}