dimsum-e2e-tests 3.57.0-next.4 → 3.57.0-next.41

package/{ds-toggle → ds-form-toggle}/DSToggle.axe-core.func.spec.js

@@ -13,7 +13,7 @@ if (
 ) {
   describe('PUI-11929 - DSControlledToggle - Axe-Core - showcase', () => {
     before('loading page', async () => {
-      const errorOnGo = await DSToggleCO.showOffURL.go();
+      const errorOnGo = await DSToggleCO.fullShowcase.go();
       if (errorOnGo) throw errorOnGo;
     });
     it('01: should pass axe-core check for showcase example', async () => {
@@ -27,10 +27,14 @@ if (
       expect(result.length).toBe(0);
     });
     it('03: should pass axe-core check for showcase example - readOnly interaction', async () => {
-      await tabStops(6);
+      await tabStops(3);
       const result = await axeCoreCheck();
       expect(result.length).toBe(0);
     });
+    it('04: all toggles should have role switch', async () => {
+      const toggleRoles = await $$('button[role="switch"]');
+      expect(toggleRoles.length).toBe(32);
+    });
   });
   describe('PUI-14182 - [Toggle] applyAriaDisabled prop - axe-core test', () => {
     before('loading page', async () => {

package/{ds-toggle → ds-form-toggle}/DSToggle.func.spec.js

@@ -100,23 +100,28 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
   });
   describe('PUI-8814 - DSControlledToggle:: Tabbing', () => {
     before('loading page', async () => {
-      const errorOnGo = await DSToggleCO.showOffURL.go();
+      const errorOnGo = await DSToggleCO.fullShowcase.go();
       if (errorOnGo) throw errorOnGo;
       await (await DSToggleCO.getToggle()).waitForExist();
     });
     it('01: should tab through the basic toggles to the last basic toggle', async () => {
-      await tabStops(6);
-      const toggle = await DSToggleCO.getToggleFocuseableByIndex(4);
+      await tabStops(2);
+      const toggle = await DSToggleCO.getToggleFocuseableByIndex(1);
       await expect(toggle).toBeFocused();
     });
-    it('02: should tab and skip all three disabled toggles to the first enabled toggle, next row', async () => {
-      await browser.keys(Key.Tab);
-      const toggle = await DSToggleCO.getToggleFocuseableByIndex(11);
+    it('02: should tab and skip all disabled toggles to the first enabled toggle, next row', async () => {
+      await tabStops(5);
+      const toggle = await DSToggleCO.getToggleFocuseableByIndex(8);
       await expect(toggle).toBeFocused();
     });
     it('03: should tab through the readonly toggles to the last readonly toggle', async () => {
-      await tabStops(5);
-      const toggle = await DSToggleCO.getToggleFocuseableByIndex(16);
+      await tabStops(3);
+      const toggle = await DSToggleCO.getToggleFocuseableByIndex(11);
+      await expect(toggle).toBeFocused();
+    });
+    it('04: should tab through the aria-disabled toggles to the last aria-disabled toggle', async () => {
+      await tabStops(2);
+      const toggle = await DSToggleCO.getToggleFocuseableByIndex(13);
       await expect(toggle).toBeFocused();
     });
   });

package/{ds-toggle → ds-form-toggle}/DSToggle.visual.spec.js

@@ -4,12 +4,12 @@ import DSToggleCO from './DSToggleCO';
 if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
   describe('PUI-6757 - DSControlledToggle - Visual Test - showcase', () => {
     before('loading page', async () => {
-      const errorOnGo = await DSToggleCO.showOffURL.go();
+      const errorOnGo = await DSToggleCO.fullShowcase.go();
       if (errorOnGo) throw errorOnGo;
     });
     it('01: should display all DSControlledToggle styles correctly', async () => {
       await (await DSToggleCO.getToggleByIndex(0)).waitForExist();
-      const snapshot = await browser.checkSnapshot(DSToggleCO.snapshotPath('show-off'));
+      const snapshot = await browser.checkSnapshot(DSToggleCO.snapshotPath('full-showcase'));
       await expect(snapshot).toEqual(0);
     });
   });

package/{ds-toggle → ds-form-toggle}/DSToggleCO.js

@@ -2,7 +2,7 @@ import { PATH_E2E_TOGGLE } from '../paths';
 import { PageObject, Urlbuilder } from '../helpers';
 
 export default class DSToggleCO extends PageObject {
-  static showOffURL = new Urlbuilder(PATH_E2E_TOGGLE, 'show-off-test');
+  static fullShowcase = new Urlbuilder(PATH_E2E_TOGGLE, 'full-showcase-test');
 
   static basicURL = new Urlbuilder(PATH_E2E_TOGGLE, 'basic-test');
 

package/ds-menu-button/DSMenuButtonCO.js

@@ -7,6 +7,8 @@ export default class DSMenuButtonCO extends PageObject {
 
   static multipleSelectMenuItem = new Urlbuilder(PATH_E2E_MENU_BUTTON, 'multiple-select-menu-item');
 
+  static nextTabstopTest = new Urlbuilder(PATH_E2E_MENU_BUTTON, 'next-tabstop-test');
+
   static singleSelectMenuItem = new Urlbuilder(PATH_E2E_MENU_BUTTON, 'single-select-menu-item');
 
   static withSubmenuMenuItem = new Urlbuilder(PATH_E2E_MENU_BUTTON, 'with-submenu-menu-item');

package/ds-menu-button/basic/DSMenuButton.basic.func.spec.js

@@ -0,0 +1,28 @@
+/* eslint-disable max-statements */
+import { Key } from 'webdriverio';
+import DSMenuButtonCO from '../DSMenuButtonCO';
+import DSButtonV3CO from '../../ds-button-v3/DSButtonV3CO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-17414 - DSMenuButton:: Tab with expanded menu - Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSMenuButtonCO.nextTabstopTest.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should trigger menuButton and have it displayed and focused', async () => {
+      const menuTrigger = await DSButtonV3CO.getButtonByLabel('MenuButton');
+      await menuTrigger.click();
+      const menuFlyOut = await DSMenuButtonCO.getMenuRoot();
+      const menuItem1 = await DSMenuButtonCO.getMenuItemOptByIndex(1);
+      await expect(menuItem1).toBeFocused();
+      await expect(menuFlyOut).toBeDisplayed();
+    });
+    it('02: should tab and go to the next IE after trigger', async () => {
+      const menuFlyOut = await DSMenuButtonCO.getMenuRoot();
+      await browser.keys(Key.Tab);
+      const normalButton = await DSButtonV3CO.getButtonByIndex(1);
+      await expect(menuFlyOut).not.toBeDisplayed();
+      await expect(normalButton).toBeFocused();
+    });
+  });
+}

package/ds-menu-button/submenu/DSMenuButton.axe-core.subMenu.func.spec.js

@@ -9,8 +9,7 @@ if (
     browser.capabilities.browserName === 'Chrome') ||
   browser.capabilities.browserName === 'chrome'
 ) {
-  // unskip after PUI-16416 is fixed
-  describe.skip('PUI-14644 - DSMenuButton:: Submenu Menu Item && Action Menu Item - AxeCore', () => {
+  describe('PUI-14644 - DSMenuButton:: Submenu Menu Item && Action Menu Item - AxeCore', () => {
     before('loading page', async () => {
       const errorOnGo = await DSMenuButtonCO.withSubmenuMenuItem.go();
       if (errorOnGo) throw errorOnGo;

package/ds-pagination/DSPagination.axe-core.func.spec.js

@@ -0,0 +1,64 @@
+import DSPaginationCO from './DSPaginationCO';
+import { axeCoreCheck } from '../helpers';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-17494: Pagination basic -AxeCore', () => {
+    beforeEach('loading page', async () => {
+      const errorOnGo = await DSPaginationCO.basicTest.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should display the basic pagination closed and pass axe-core', async () => {
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+    it('02: should display the dropdown menu open and pass axe-core', async () => {
+      const ddMenuButton = await DSPaginationCO.getDropDownMenuBtn();
+      await ddMenuButton.click();
+      const listbox = await DSPaginationCO.getDropDownMenu();
+      await listbox.waitForDisplayed();
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+  });
+  describe('PUI-17495: Pagination Segmented -AxeCore', () => {
+    beforeEach('loading page', async () => {
+      const errorOnGo = await DSPaginationCO.segmentedPaginatorTest.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should display the segmented pagination closed and pass axe-core', async () => {
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+    it('02: should display the dropdown menu open and pass axe-core', async () => {
+      const ddMenuButton = await DSPaginationCO.getDropDownMenuBtn();
+      await ddMenuButton.click();
+      const listbox = await DSPaginationCO.getDropDownMenu();
+      await listbox.waitForDisplayed();
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+  });
+  describe('PUI-: Pagination Per Page Selector -AxeCore', () => {
+    beforeEach('loading page', async () => {
+      const errorOnGo = await DSPaginationCO.perPageSelectorWithOptionsTest.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should display the per page selector pagination closed and pass axe-core', async () => {
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+    it('02: should display the dropdown menu open and pass axe-core', async () => {
+      const ddMenuButton = await DSPaginationCO.getPerPageSelector();
+      await ddMenuButton.click();
+      const listbox = await DSPaginationCO.getDropDownMenu();
+      await listbox.waitForDisplayed();
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+  });
+}

package/ds-pagination/DSPaginationCO.js

@@ -5,6 +5,14 @@ export default class DSPaginationCO extends PageObject {
   // Desktop
   static customPageSizeComponentTest = new Urlbuilder(PATH_E2E_PAGINATION, 'custom-page-size-test');
 
+  static segmentedPaginatorTest = new Urlbuilder(PATH_E2E_PAGINATION, 'segmented-paginator-test');
+
+  static basicTest = new Urlbuilder(PATH_E2E_PAGINATION, 'basic-test');
+
+  static perPageSelectorWithOptionsTest = new Urlbuilder(PATH_E2E_PAGINATION, 'per-page-selector-with-options-test');
+
+  static perPageSelectorWithStepTest = new Urlbuilder(PATH_E2E_PAGINATION, 'per-page-selector-with-step-test');
+
   static getUrl(component = 'custom-page-size-test') {
     return PageObject.getUrl(PATH_E2E_PAGINATION, component);
   }
@@ -33,6 +41,10 @@ export default class DSPaginationCO extends PageObject {
 
   static getCustomLegend = async () => $('[data-testid="custom-legend"]');
 
+  static getDropDownMenuBtn = async () => $('[data-testid="ds-pagination-paginator"]');
+
+  static getPerPageSelector = async () => $('[data-testid="ds-pagination-per-page-selector"]');
+
   // Snapshots
   static snapshotPath(example = 'basic') {
     return PageObject.getSnapshotPathBuilder('PageNumber', example);

package/ds-read-more/DSReadMore.width-change.visual.spec.js

@@ -0,0 +1,85 @@
+import { Key } from 'webdriverio';
+import DSReadMoreCO from './DSReadMoreCO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-17358 - Read More:: width change -Visual', () => {
+    beforeEach('loading page', async () => {
+      const errorOnGo = await DSReadMoreCO.widthChange.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should display readmore at 100px width - read more', async () => {
+      await browser.eyesOpen();
+      const snapshot = await browser.eyesCheckSnapshot(DSReadMoreCO.snapshotPath('width-100-readmore'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('02: should display readmore at 100px width - read less', async () => {
+      await browser.eyesOpen();
+      await browser.keys(Key.Tab);
+      await browser.keys(Key.Enter);
+      await browser.keys(Key.Tab);
+      await browser.keys(Key.Enter);
+      const snapshot = await browser.eyesCheckSnapshot(DSReadMoreCO.snapshotPath('width-100-readless'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('03: should display readmore at 200px width - read more', async () => {
+      await browser.eyesOpen();
+      await $('button*=Change the widths').click();
+      const snapshot = await browser.eyesCheckSnapshot(DSReadMoreCO.snapshotPath('width-200-readmore'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('04: should display readmore at 200px width - read less', async () => {
+      await browser.eyesOpen();
+      await $('button*=Change the widths').click();
+      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.Enter);
+      await browser.keys([Key.Shift, Key.Tab]);
+      await browser.keys(Key.Enter);
+      const snapshot = await browser.eyesCheckSnapshot(DSReadMoreCO.snapshotPath('width-200-readless'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('05: should display readmore at 300px width - read more', async () => {
+      await browser.eyesOpen();
+      await $('button*=Change the widths').click();
+      await $('button*=Change the widths').click();
+      const snapshot = await browser.eyesCheckSnapshot(DSReadMoreCO.snapshotPath('width-300-readmore'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('06: should display readmore at 300px width - read less', async () => {
+      await browser.eyesOpen();
+      await $('button*=Change the widths').click();
+      await $('button*=Change the widths').click();
+      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.Enter);
+      await browser.keys([Key.Shift, Key.Tab]);
+      await browser.keys(Key.Enter);
+      const snapshot = await browser.eyesCheckSnapshot(DSReadMoreCO.snapshotPath('width-300-readless'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('07: should display readmore at 400px width - read more', async () => {
+      await browser.eyesOpen();
+      await $('button*=Change the widths').click();
+      await $('button*=Change the widths').click();
+      await $('button*=Change the widths').click();
+      const snapshot = await browser.eyesCheckSnapshot(DSReadMoreCO.snapshotPath('width-400-readmore'));
+      await expect(snapshot).toEqual(0);
+    });
+    it('08: should display readmore at 400px width - read less', async () => {
+      await browser.eyesOpen();
+      await $('button*=Change the widths').click();
+      await $('button*=Change the widths').click();
+      await $('button*=Change the widths').click();
+      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.Enter);
+      await browser.keys([Key.Shift, Key.Tab]);
+      await browser.keys(Key.Enter);
+      const snapshot = await browser.eyesCheckSnapshot(DSReadMoreCO.snapshotPath('width-400-readless'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/ds-shuttle-v2/basic/DSShuttleV2.keyboard.func.spec.js

@@ -4,101 +4,6 @@ import { Key } from 'webdriverio';
 import DSShuttleV2CO from '../DSShuttleV2CO';
 
 if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
-  describe('PUI-9798 - Shuttle V2, TabStops Basic -Func.', () => {
-    before(async () => {
-      const errorOnGo = await DSShuttleV2CO.filterURL.go();
-      if (errorOnGo) throw errorOnGo;
-    });
-    it('01: should tab and focus the filter icon (skiping text title)', async () => {
-      await browser.keys(Key.Tab);
-      const sourceFilterBtn = await DSShuttleV2CO.getHeaderSearchIcon(0);
-      await expect(sourceFilterBtn).toBeFocused();
-    });
-    it('02: should tab and focus the select/deselect all checkbox', async () => {
-      await browser.keys(Key.Tab);
-      const sourcePanelCheckbox = await DSShuttleV2CO.getCheckboxByIndex(0);
-      await expect(sourcePanelCheckbox).toBeFocused();
-    });
-    it('03: should tab and focus the source panel', async () => {
-      await browser.keys(Key.Tab);
-      const sourcePanel = await DSShuttleV2CO.getListWrapperMid(0);
-      await expect(sourcePanel).toBeFocused();
-    });
-    it('04: should select first item with arrowKeys', async () => {
-      await browser.keys(Key.ArrowDown);
-      const firstItem = await DSShuttleV2CO.getItemCheckboxByItem(await DSShuttleV2CO.getItemFromSourceByIndex(0));
-      const isFirstItemFocused = await firstItem.getAttribute('tabindex');
-      await expect(isFirstItemFocused).toEqual('0'); // 0 = true for pseudofocus
-      await expect(firstItem).toBeFocused();
-    });
-    it('05: should Shift+Tab to focus the panel again and select last item with arrowKeys', async () => {
-      await browser.keys([Key.Shift, Key.Tab]);
-      await browser.keys(Key.ArrowUp);
-      const firstItem = await DSShuttleV2CO.getItemCheckboxByIndex(9);
-      const isFirstItemFocused = await firstItem.getAttribute('tabindex');
-      await expect(isFirstItemFocused).toEqual('0'); // 0 = true for pseudofocus
-      await expect(firstItem).toBeFocused();
-    });
-    it('06: should tab and focus next header search icon from destination panel', async () => {
-      await browser.keys(Key.Tab);
-      const sourceFilterBtn = await DSShuttleV2CO.getHeaderSearchIcon(1);
-      await expect(sourceFilterBtn).toBeFocused();
-    });
-  });
-  if (browser.capabilities.browserName !== 'Firefox') {
-    describe('PUI-9799 - Shuttle V2, TabStops with BAB and LoadMore -Func.', () => {
-      before(async () => {
-        const errorOnGo = await DSShuttleV2CO.loadMoreURL.go();
-        if (errorOnGo) throw errorOnGo;
-      });
-      it('01: display the BAB and return focus to the global checkbox to follow normal flow', async () => {
-        const testItem = await DSShuttleV2CO.getItemWrapper(2);
-        await testItem.click();
-        const BAB = await DSShuttleV2CO.getMoveMultipleButton();
-        const sourcePanelCheckbox = await DSShuttleV2CO.getCheckboxByIndex(0);
-        await browser.keys([Key.Shift, Key.Tab]);
-        await browser.keys([Key.Shift, Key.Tab]);
-        await expect(BAB).toBeDisplayed();
-        await expect(sourcePanelCheckbox).toBeFocused();
-      });
-      it('03: should tab and focus the source panel', async () => {
-        await browser.keys(Key.Tab);
-        const sourcePanel = await DSShuttleV2CO.getListWrapperMid(0);
-        await expect(sourcePanel).toBeFocused();
-      });
-      it('04: should tab and focus the BAB', async () => {
-        await browser.keys(Key.Tab);
-        const BAB = await DSShuttleV2CO.getMoveMultipleButton(0);
-        await expect(BAB).toBeFocused();
-      });
-      it('05: should tab and focus the loadmore', async () => {
-        await browser.keys(Key.Tab);
-        const loadMore = await DSShuttleV2CO.getListBottomLoadMoreBtn(0);
-        await expect(loadMore).toBeFocused();
-      });
-      it('06: should tab and focus the global checkbox from destination panel', async () => {
-        await browser.keys(Key.Tab);
-        const destinationPanelCheckbox = await DSShuttleV2CO.getCheckboxByIndex(1);
-        await expect(destinationPanelCheckbox).toBeFocused();
-      });
-      it('07: should move all the items to destination panel', async () => {
-        await browser.keys(Key.Return);
-        await browser.keys(Key.Tab);
-        await browser.keys(Key.Tab);
-        await browser.keys(Key.Return);
-        const emptyListWrapper = await DSShuttleV2CO.getEmptyListWrapper();
-        await expect(emptyListWrapper).toHaveText(expect.stringContaining('There are no items to display'));
-      });
-      it('08: should load more items and focus the panel body', async () => {
-        await browser.keys(Key.Tab);
-        await browser.keys(Key.Return);
-        const destinationPanel = await DSShuttleV2CO.getListWrapperMid(1);
-        const destinationItems = (await DSShuttleV2CO.getItemsFromDestination()).length;
-        await expect(destinationItems).toBe(3);
-        await expect(destinationPanel).toBeFocused();
-      });
-    });
-  }
   describe('PUI-9815 - Shuttle V2, Range selection -Func.', () => {
     before(async () => {
       const errorOnGo = await DSShuttleV2CO.basicURL.go();

package/ds-shuttle-v2/filtering/DSShuttleV2.filter.func.spec.js

@@ -10,10 +10,12 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
     it('01: search bar should not display untill filter icon is triggered', async () => {
       await expect($('[data-testid="ds-shuttle-v2-area-search-bar"]')).not.toBeDisplayed();
     });
-    it('02: should filter and find only one match at source panel', async () => {
+    it('02: should trigger searchbar and have it present with placeholder', async () => {
       const sourceFilterBtn = await DSShuttleV2CO.getHeaderSearchIcon(0);
       await sourceFilterBtn.click();
-      const placeholder = await (await DSShuttleV2CO.getSearchBarByIndex(0)).getAttribute('placeholder');
+      const searchbar = await DSShuttleV2CO.getSearchBarByIndex(0);
+      await searchbar.click();
+      const placeholder = await searchbar.getAttribute('placeholder');
       await expect(placeholder).toBe('Source search placeholder');
     });
     it('03: should filter and find only one match at source panel', async () => {
@@ -23,12 +25,14 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       const testItem = await (await DSShuttleV2CO.getItemFromSourceByIndex(0)).getText();
       await expect(testItem).toBe('Source 0.2');
     });
-    it('04: should filter and find 10 of 11 items matching at destination panel', async () => {
+    it('04: should trigger destination searchbar and have it present with placeholder', async () => {
       const testItem = await DSShuttleV2CO.getItemWrapper(0);
       const testItemMoveBtn = await DSShuttleV2CO.getActionButtonByItemAndIndex(testItem, 1);
       await testItemMoveBtn.click();
       const sourceFilterBtn = await DSShuttleV2CO.getHeaderSearchIcon(1);
       await sourceFilterBtn.click();
+      const searchbar = await DSShuttleV2CO.getSearchBarByIndex(1);
+      await searchbar.click();
       const placeholder = await (await DSShuttleV2CO.getSearchBarByIndex(1)).getAttribute('placeholder');
       await expect(placeholder).toBe('Destination search placeholder');
     });
@@ -57,6 +61,7 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
     it('02: should filter and find only one match at source panel', async () => {
       const sourceFilterBtn = await DSShuttleV2CO.getHeaderSearchIcon(0);
       await sourceFilterBtn.click();
+      await browser.keys('Tab');
       await type('Vote for Pedro');
       const sourceItems = (await DSShuttleV2CO.getItemsFromSource()).length;
       await expect(sourceItems).toBe(0);

package/ds-shuttle-v2/filtering/DSShuttleV2.filter.kb.func.spec.js

@@ -14,6 +14,7 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
     it('02: should filter and find only one match at source panel', async () => {
       await browser.keys(Key.Tab);
       await browser.keys(Key.Enter);
+      await browser.keys('Tab');
       await type('0.2');
       const sourceItems = (await DSShuttleV2CO.getItemsFromSource()).length;
       await expect(sourceItems).toBe(1);
@@ -27,6 +28,7 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       await browser.keys(Key.Tab);
       await browser.keys(Key.Tab);
       await browser.keys(Key.Enter);
+      await browser.keys('Tab');
       await type('Destination');
       const destinationItems = (await DSShuttleV2CO.getItemsFromDestination()).length;
       await expect(destinationItems).toBe(10);
@@ -39,4 +41,45 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       await expect(testItem).toBe('Destination 0.3');
     });
   });
+  describe('PUI-9798 - Shuttle V2, TabStops Basic -Func.', () => {
+    before(async () => {
+      const errorOnGo = await DSShuttleV2CO.filterURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should tab and focus the filter icon (skiping text title)', async () => {
+      await browser.keys(Key.Tab);
+      const sourceFilterBtn = await DSShuttleV2CO.getHeaderSearchIcon(0);
+      await expect(sourceFilterBtn).toBeFocused();
+    });
+    it('02: should tab and focus the select/deselect all checkbox', async () => {
+      await browser.keys(Key.Tab);
+      const sourcePanelCheckbox = await DSShuttleV2CO.getCheckboxByIndex(0);
+      await expect(sourcePanelCheckbox).toBeFocused();
+    });
+    it('03: should tab and focus the source panel', async () => {
+      await browser.keys(Key.Tab);
+      const sourcePanel = await DSShuttleV2CO.getListWrapperMid(0);
+      await expect(sourcePanel).toBeFocused();
+    });
+    it('04: should select first item with arrowKeys', async () => {
+      await browser.keys(Key.ArrowDown);
+      const firstItem = await DSShuttleV2CO.getItemCheckboxByItem(await DSShuttleV2CO.getItemFromSourceByIndex(0));
+      const isFirstItemFocused = await firstItem.getAttribute('tabindex');
+      await expect(isFirstItemFocused).toEqual('0'); // 0 = true for pseudofocus
+      await expect(firstItem).toBeFocused();
+    });
+    it('05: should Shift+Tab to focus the panel again and select last item with arrowKeys', async () => {
+      await browser.keys([Key.Shift, Key.Tab]);
+      await browser.keys(Key.ArrowUp);
+      const firstItem = await DSShuttleV2CO.getItemCheckboxByIndex(9);
+      const isFirstItemFocused = await firstItem.getAttribute('tabindex');
+      await expect(isFirstItemFocused).toEqual('0'); // 0 = true for pseudofocus
+      await expect(firstItem).toBeFocused();
+    });
+    it('06: should tab and focus next header search icon from destination panel', async () => {
+      await browser.keys(Key.Tab);
+      const sourceFilterBtn = await DSShuttleV2CO.getHeaderSearchIcon(1);
+      await expect(sourceFilterBtn).toBeFocused();
+    });
+  });
 }

package/ds-shuttle-v2/items/DSShuttleV2.items.func.spec.js

@@ -14,7 +14,7 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       const actualItem = await (await DSShuttleV2CO.getItemFromDestinationByIndex(10)).getText();
       const sourceItems = (await DSShuttleV2CO.getItemsFromSource()).length;
       const destinationItems = (await DSShuttleV2CO.getItemsFromDestination()).length;
-      await expect(itemGhost).toBe('Source 0.1');
+      await expect(itemGhost).toBe('This item has been soft deleted and is shown as a ghost item.\nSource 0.1');
       await expect(actualItem).toBe('Source 0.1');
       await expect(sourceItems).toBe(10);
       await expect(destinationItems).toBe(11);

package/ds-shuttle-v2/items/DSShuttleV2.items.kb.func.spec.js

@@ -19,7 +19,7 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
       const actualItem = await (await DSShuttleV2CO.getItemFromDestinationByIndex(10)).getText();
       const sourceItems = (await DSShuttleV2CO.getItemsFromSource()).length;
       const destinationItems = (await DSShuttleV2CO.getItemsFromDestination()).length;
-      await expect(itemGhost).toBe('Source 0.1');
+      await expect(itemGhost).toBe('This item has been soft deleted and is shown as a ghost item.\nSource 0.1');
       await expect(actualItem).toBe('Source 0.1');
       await expect(sourceItems).toBe(10);
       await expect(destinationItems).toBe(11);

package/ds-shuttle-v2/load-more/DSShuttleV2.load-more.keyboard.func.spec.js

@@ -0,0 +1,61 @@
+/* eslint-disable max-lines */
+/* eslint-disable max-statements */
+import { Key } from 'webdriverio';
+import DSShuttleV2CO from '../DSShuttleV2CO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-9799 - Shuttle V2, TabStops with BAB and LoadMore -Func.', () => {
+    before(async () => {
+      const errorOnGo = await DSShuttleV2CO.loadMoreURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: display the BAB and return focus to the global checkbox to follow normal flow', async () => {
+      const testItem = await DSShuttleV2CO.getItemWrapper(2);
+      await testItem.click();
+      const BAB = await DSShuttleV2CO.getMoveMultipleButton();
+      const sourcePanelCheckbox = await DSShuttleV2CO.getCheckboxByIndex(0);
+      await browser.keys([Key.Shift, Key.Tab]);
+      await browser.keys([Key.Shift, Key.Tab]);
+      await expect(BAB).toBeDisplayed();
+      await expect(sourcePanelCheckbox).toBeFocused();
+    });
+    it('03: should tab and focus the source panel', async () => {
+      await browser.keys(Key.Tab);
+      const sourcePanel = await DSShuttleV2CO.getListWrapperMid(0);
+      await expect(sourcePanel).toBeFocused();
+    });
+    it('04: should tab and focus the BAB', async () => {
+      await browser.keys(Key.Tab);
+      const BAB = await DSShuttleV2CO.getMoveMultipleButton(0);
+      await expect(BAB).toBeFocused();
+    });
+    it('05: should tab and focus the loadmore', async () => {
+      await browser.keys(Key.Tab);
+      const loadMore = await DSShuttleV2CO.getListBottomLoadMoreBtn(0);
+      await expect(loadMore).toBeFocused();
+    });
+    it('06: should tab and focus the global checkbox from destination panel', async () => {
+      await browser.keys(Key.Tab);
+      const destinationPanelCheckbox = await DSShuttleV2CO.getCheckboxByIndex(1);
+      await expect(destinationPanelCheckbox).toBeFocused();
+    });
+    it('07: should move all the items to destination panel', async () => {
+      await browser.keys(Key.Return);
+      await browser.keys(Key.Tab);
+      await browser.keys(Key.Tab);
+      await browser.keys(Key.Return);
+      const emptyListWrapper = await DSShuttleV2CO.getEmptyListWrapper();
+      await expect(emptyListWrapper).toHaveText(expect.stringContaining('There are no items to display'));
+    });
+    it('08: should load more items and focus the panel body', async () => {
+      await browser.keys(Key.Tab);
+      await browser.keys(Key.Return);
+      // eslint-disable-next-line wdio/no-pause
+      await browser.pause(500); // wait for load more to finish
+      const destinationPanel = await DSShuttleV2CO.getListWrapperMid(1);
+      const destinationItems = (await DSShuttleV2CO.getItemsFromDestination()).length;
+      await expect(destinationItems).toBe(3);
+      await expect(destinationPanel).toBeFocused();
+    });
+  });
+}