dimsum-e2e-tests 3.70.0-next.7 → 3.70.0-next.71

package/ds-card-v3/variant-disabled/DSCardV3.variant-disabled.axe-core.func.spec.js

@@ -0,0 +1,22 @@
+import DSCardV3CO from '../DSCardV3CO';
+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-18720 - CardV3:: Variant Disabled - axe-core', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCardV3CO.variantDisabledURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+    it('01: should display card disabled and pass axecore scan', async () => {
+      const firstItem = await DSCardV3CO.getCardHeader();
+      await firstItem.waitForDisplayed();
+      const result = await axeCoreCheck();
+      await expect(result).toHaveLength(0);
+    });
+  });
+}

package/ds-card-v3/variant-disabled/DSCardV3.variant-disabled.func.spec.js

@@ -0,0 +1,61 @@
+import DSCardV3CO from '../DSCardV3CO';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-18810 - DSCardV3:: variant disabled cards non-interactive structure - Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCardV3CO.variantDisabledURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should render both disabled cards as divs without the HTML disabled attribute', async () => {
+      const disabledCard = await DSCardV3CO.getCardContainerByIndex(0);
+      await disabledCard.waitForDisplayed();
+      expect((await disabledCard.getTagName()).toLowerCase()).toBe('div');
+      expect(await disabledCard.getAttribute('disabled')).toBeNull();
+
+      const accentedDisabledCard = await DSCardV3CO.getCardContainerByIndex(1);
+      await expect(accentedDisabledCard).toBeDisplayed();
+      expect((await accentedDisabledCard.getTagName()).toLowerCase()).toBe('div');
+      expect(await accentedDisabledCard.getAttribute('disabled')).toBeNull();
+    });
+
+    it('02: should keep both cards visible to assistive technology', async () => {
+      const disabledCard = await DSCardV3CO.getCardContainerByIndex(0);
+      expect(await disabledCard.getAttribute('aria-hidden')).toBeNull();
+
+      const accentedDisabledCard = await DSCardV3CO.getCardContainerByIndex(1);
+      expect(await accentedDisabledCard.getAttribute('aria-hidden')).toBeNull();
+    });
+
+    it('03: should expose the title and description of both cards', async () => {
+      const firstHeading = await DSCardV3CO.getHByLevelAndIndex(3, 0);
+      await expect(firstHeading).toBeExisting();
+      await expect(firstHeading).toHaveText('Disabled Card');
+
+      const firstDescription = await DSCardV3CO.getElement(1);
+      await expect(firstDescription).toHaveText('Description card');
+
+      const secondHeading = await DSCardV3CO.getHByLevelAndIndex(3, 1);
+      await expect(secondHeading).toBeExisting();
+      await expect(secondHeading).toHaveText('Disabled Card');
+
+      const secondDescription = await DSCardV3CO.getElement(3);
+      await expect(secondDescription).toHaveText('Description card');
+    });
+
+    it('04: should contain no focusable controls in either card', async () => {
+      const disabledCard = await DSCardV3CO.getCardContainerByIndex(0);
+      const firstCardControls = await disabledCard.$$('button, a[href], input, select, textarea, [tabindex]');
+      expect(firstCardControls).toHaveLength(0);
+
+      const accentedDisabledCard = await DSCardV3CO.getCardContainerByIndex(1);
+      const secondCardControls = await accentedDisabledCard.$$('button, a[href], input, select, textarea, [tabindex]');
+      expect(secondCardControls).toHaveLength(0);
+    });
+  });
+}

package/ds-card-v3/variant-disabled/DSCardV3.variant-disabled.visual.spec.js

@@ -0,0 +1,20 @@
+import DSCardV3CO from '../DSCardV3CO';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-18811 - DSCardV3:: variant disabled and accented-disabled render - Visual', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCardV3CO.variantDisabledURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should display the disabled and accented-disabled cards', async () => {
+      const disabledCard = await DSCardV3CO.getCardContainerByIndex(0);
+      await disabledCard.waitForDisplayed();
+      const accentedDisabledCard = await DSCardV3CO.getCardContainerByIndex(1);
+      await expect(accentedDisabledCard).toBeDisplayed();
+
+      const snapshot = await browser.percyCheckScreenshot();
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/ds-card-v3/variant-disabled/DSCardV3.variantDisabled-non-interactive.func.spec.js

@@ -0,0 +1,25 @@
+import DSCardV3CO from '../DSCardV3CO';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  // Tests for the fix introduced in PUI-17888 (disabled attribute on non-interactive card)
+  describe('PUI-18598 - DSCardV3:: disabled variant has no HTML disabled attribute - Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await DSCardV3CO.variantDisabledURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: disabled and accented-disabled cards do not have the HTML disabled attribute', async () => {
+      const card1 = await DSCardV3CO.getCardContainerByIndex(0);
+      const card2 = await DSCardV3CO.getCardContainerByIndex(1);
+      const disabledAttr1 = await card1.getAttribute('disabled');
+      const disabledAttr2 = await card2.getAttribute('disabled');
+      expect(disabledAttr1).toBeNull();
+      expect(disabledAttr2).toBeNull();
+    });
+  });
+}

package/ds-chat/DSChat.axe-core.func.spec.js

@@ -1,6 +1,6 @@
 /* eslint-disable no-plusplus */
 /* eslint-disable max-lines */
-import { ChatCO, BubbleCO, TileCO } from './components';
+import { ChatCO, CardCO, BubbleCO, TileCO } from './components';
 import { axeCoreCheck } from '../helpers';
 
 if (
@@ -41,7 +41,7 @@ if (
 
   describe('PUI-12504 - Chat, Chat Card -AxeCore', () => {
     before('loading page', async () => {
-      const errorOnGo = await ChatCO.chatCardURL.go();
+      const errorOnGo = await CardCO.cardBasicURL.go();
       if (errorOnGo) throw errorOnGo;
     });
     it('01: should have a chat card and pass axe-core scan', async () => {

package/ds-chat/DSChat.visual.spec.js

@@ -1,7 +1,7 @@
 /* eslint-disable no-plusplus */
 /* eslint-disable max-lines */
 import { Key } from 'webdriverio';
-import { ChatCO, BubbleCO, FloatingButtonCO, ComposerCO, TileCO } from './components';
+import { ChatCO, CardCO, BubbleCO, FloatingButtonCO, ComposerCO, TileCO } from './components';
 import { type } from '../helpers';
 import DSBannerCO from '../ds-banner/DSBannerCO';
 
@@ -76,7 +76,7 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
 
   describe('PUI-6712 - Chat, Chat Card, Visual Tests', () => {
     before('loading page', async () => {
-      const errorOnGo = await ChatCO.chatCardURL.go();
+      const errorOnGo = await CardCO.cardBasicURL.go();
       if (errorOnGo) throw errorOnGo;
     });
     it('should display the chat card properly', async () => {
@@ -245,7 +245,7 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
 
   describe('PUI-9222 - Chat, Long Words, Visual Tests', () => {
     before('loading page', async () => {
-      const errorOnGo = await ChatCO.basicE2eURL.go();
+      const errorOnGo = await ChatCO.basicTestURL.go();
       if (errorOnGo) throw errorOnGo;
     });
     it('should display long words breaking at composer', async () => {
@@ -268,7 +268,7 @@ if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:o
     });
   });
 
-  describe('PUI-9333 - Chat, Scroll on send and not on enter, Func. Tests', () => {
+  describe('PUI-9333 - Chat, Scroll on send and not on enter - Visual Tests', () => {
     before('loading page', async () => {
       const errorOnGo = await ChatCO.sidePanelIntegrationURL.go();
       if (errorOnGo) throw errorOnGo;

package/ds-chat/DSChatCO.js

@@ -1,51 +1,49 @@
 /* eslint-disable import/no-relative-packages */
-import { PATH_CHAT_EXAMPLES, PATH_CHAT_PARTS, PATH_E2E_CHAT } from '../paths';
+import { PATH_E2E_CHAT } from '../paths';
 import { PageObject, Urlbuilder, getElementByIndex } from '../helpers';
 
 export default class DSChatCO extends PageObject {
   static TEST_STR = 'this is a test string';
 
-  static systemMessageURL = new Urlbuilder(PATH_CHAT_PARTS, 'chat-system-message');
+  static systemMessageURL = new Urlbuilder(PATH_E2E_CHAT, 'chat-system-message-test');
 
-  static messageDelimiterURL = new Urlbuilder(PATH_CHAT_PARTS, 'chat-message-delimiter');
+  static messageDelimiterURL = new Urlbuilder(PATH_E2E_CHAT, 'chat-message-delimiter');
 
-  static containerURL = new Urlbuilder(PATH_CHAT_PARTS, 'container');
+  static containerURL = new Urlbuilder(PATH_E2E_CHAT, 'container');
 
-  static loadMoreURL = new Urlbuilder(PATH_CHAT_EXAMPLES, 'container-load-more');
+  static loadMoreURL = new Urlbuilder(PATH_E2E_CHAT, 'container-load-more-test');
 
-  static loadingURL = new Urlbuilder(PATH_CHAT_EXAMPLES, 'loading-container');
+  static loadingURL = new Urlbuilder(PATH_E2E_CHAT, 'loading-container-test');
 
-  static loadingErrorURL = new Urlbuilder(PATH_CHAT_EXAMPLES, 'loading-error');
+  static loadingErrorURL = new Urlbuilder(PATH_E2E_CHAT, 'loading-error-test');
 
-  static floatingExampleURL = new Urlbuilder(PATH_CHAT_EXAMPLES, 'floating-example');
+  static floatingExampleURL = new Urlbuilder(PATH_E2E_CHAT, 'floating-example-test');
 
-  static focusCasesURL = new Urlbuilder(PATH_CHAT_EXAMPLES, 'container-focus-cases');
+  static focusCasesURL = new Urlbuilder(PATH_E2E_CHAT, 'container-focus-cases-test');
 
-  static mobileContainerURL = new Urlbuilder(PATH_CHAT_EXAMPLES, 'mobile-container');
+  static mobileContainerURL = new Urlbuilder(PATH_E2E_CHAT, 'mobile-container-test');
 
   static sidePanelIntegrationURL = new Urlbuilder(PATH_E2E_CHAT, 'side-panel-integration-test');
 
-  static chatCardURL = new Urlbuilder(PATH_CHAT_PARTS, 'chat-card');
+  static tooltipPosition = new Urlbuilder(PATH_E2E_CHAT, 'tooltip-position-test');
 
-  static tooltipPosition = new Urlbuilder(PATH_CHAT_EXAMPLES, 'tooltip-position');
+  static focuseableBanners = new Urlbuilder(PATH_E2E_CHAT, 'focus-on-banner-test');
 
-  static focuseableBanners = new Urlbuilder(PATH_CHAT_EXAMPLES, 'focus-on-banner');
+  static newMessages = new Urlbuilder(PATH_E2E_CHAT, 'container-new-messages-test');
 
-  static newMessages = new Urlbuilder(PATH_CHAT_EXAMPLES, 'container-new-messages');
+  static nonDeliveredURL = new Urlbuilder(PATH_E2E_CHAT, 'non-delivered-messages-test');
 
-  static nonDeliveredURL = new Urlbuilder(PATH_CHAT_EXAMPLES, 'non-delivered-messages');
+  static nonGridInfluencerURL = new Urlbuilder(PATH_E2E_CHAT, 'non-grid-influencer-integration-test');
 
-  static nonGridInfluencerURL = new Urlbuilder(PATH_CHAT_EXAMPLES, 'non-grid-influencer-integration');
+  static customBanner = new Urlbuilder(PATH_E2E_CHAT, 'custom-banner-test');
 
-  static customBanner = new Urlbuilder(PATH_CHAT_EXAMPLES, 'custom-banner');
-
-  static emptyState = new Urlbuilder(PATH_CHAT_EXAMPLES, 'empty-state');
+  static emptyState = new Urlbuilder(PATH_E2E_CHAT, 'empty-state-test');
 
   static globalLineHeight = new Urlbuilder(PATH_E2E_CHAT, 'global-line-height');
 
   static unreadMessagesBanner = new Urlbuilder(PATH_E2E_CHAT, 'unread-messages-banner');
 
-  static basicE2eURL = new Urlbuilder(PATH_E2E_CHAT, 'basic-e-2-e');
+  static basicTestURL = new Urlbuilder(PATH_E2E_CHAT, 'basic-test');
 
   // selector
   static async isTyping() {
@@ -72,10 +70,6 @@ export default class DSChatCO extends PageObject {
     return $('[data-testid="chat-thread-container"]');
   }
 
-  static async getCards() {
-    return $$('[data-testid="chat-card-wrapper"]');
-  }
-
   static async getSidebarFooterButton() {
     return $('[data-testid="sidebar-button-sidebar_footer"]');
   }

package/ds-chat/bubbles/slots/DSChatBubble.slots.axe-core.func.spec.js

@@ -0,0 +1,24 @@
+// Tests for PUI-17908 (ds-chat-bubble slots implementation)
+import { BubbleCO } from '../../components';
+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-18460 - DSChatBubble:: axe-core - Axe-Core', () => {
+    before(async () => {
+      const errorOnGo = await BubbleCO.bubbleSlotsURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should pass axe-core on sender and recipient bubble variants', async () => {
+      const senderWrapper = await BubbleCO.getWrapperSlot();
+      await senderWrapper.waitForDisplayed();
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+  });
+}

package/ds-chat/bubbles/slots/DSChatBubble.slots.func.spec.js

@@ -0,0 +1,49 @@
+// Tests for PUI-17908 (ds-chat-bubble slots implementation)
+import { BubbleCO } from '../../components';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-18459 - DSChatBubble:: slot wiring - Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await BubbleCO.bubbleSlotsURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should have custom aria-* for each slot', async () => {
+      await (await BubbleCO.getWrapperSlot()).waitForDisplayed();
+      await expect(await BubbleCO.getWrapperSlot()).toHaveAttribute('aria-label', 'wrapper aria');
+      await expect(await BubbleCO.getColoredBubbleSlot()).toHaveAttribute('aria-label', 'colored-bubble aria');
+      await expect(await BubbleCO.getHeaderSlot()).toHaveAttribute('aria-label', 'header aria');
+      await expect(await BubbleCO.getHeaderLeftSlot()).toHaveAttribute('aria-label', 'header-left aria');
+      await expect(await BubbleCO.getHeaderRightSlot()).toHaveAttribute('aria-label', 'header-right aria');
+      await expect(await BubbleCO.getBodyWrapperSlot()).toHaveAttribute('aria-label', 'body-wrapper aria');
+      await expect(await BubbleCO.getErrorMessageSlot()).toHaveAttribute('aria-label', 'error-message aria');
+      await expect(await BubbleCO.getHelpMessageSlot()).toHaveAttribute('aria-label', 'help-message aria');
+    });
+
+    it('02: should have custom data-testid for each slot', async () => {
+      await expect(await BubbleCO.getWrapperSlot()).toHaveAttribute('data-testid', 'wrapper data');
+      await expect(await BubbleCO.getColoredBubbleSlot()).toHaveAttribute('data-testid', 'colored-bubble data');
+      await expect(await BubbleCO.getHeaderSlot()).toHaveAttribute('data-testid', 'header data');
+      await expect(await BubbleCO.getHeaderLeftSlot()).toHaveAttribute('data-testid', 'header-left data');
+      await expect(await BubbleCO.getHeaderRightSlot()).toHaveAttribute('data-testid', 'header-right data');
+      await expect(await BubbleCO.getBodyWrapperSlot()).toHaveAttribute('data-testid', 'body-wrapper data');
+      await expect(await BubbleCO.getErrorMessageSlot()).toHaveAttribute('data-testid', 'error-message data');
+      await expect(await BubbleCO.getHelpMessageSlot()).toHaveAttribute('data-testid', 'help-message data');
+    });
+
+    it('03: should have custom lang for each slot', async () => {
+      await expect(await BubbleCO.getWrapperSlot()).toHaveAttribute('lang', 'pt');
+      await expect(await BubbleCO.getHeaderSlot()).toHaveAttribute('lang', 'de');
+      await expect(await BubbleCO.getHeaderLeftSlot()).toHaveAttribute('lang', 'en');
+      await expect(await BubbleCO.getHeaderRightSlot()).toHaveAttribute('lang', 'fr');
+      await expect(await BubbleCO.getBodyWrapperSlot()).toHaveAttribute('lang', 'it');
+      await expect(await BubbleCO.getErrorMessageSlot()).toHaveAttribute('lang', 'sv');
+      await expect(await BubbleCO.getHelpMessageSlot()).toHaveAttribute('lang', 'ja');
+    });
+  });
+}

package/ds-chat/bubbles/slots/DSChatBubble.slots.visual.spec.js

@@ -0,0 +1,25 @@
+// Tests for PUI-17908 (ds-chat-bubble slots implementation)
+import { BubbleCO } from '../../components';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-18458 - DSChatBubble:: bubble slot variants - Visual', () => {
+    before(async () => {
+      const errorOnGo = await BubbleCO.bubbleSlotsURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should display sender and recipient bubble variants', async () => {
+      const senderWrapper = await BubbleCO.getWrapperSlot();
+      await senderWrapper.waitForDisplayed();
+      const snapshot = await browser.percyCheckScreenshot(BubbleCO.snapshotPath('bubble-slots-sender-recipient'));
+      await expect(snapshot).toEqual(0);
+    });
+
+    it('02: should display bubble with errorMessage and helpMessage', async () => {
+      const errorBubble = await BubbleCO.getErrorMessageSlot();
+      await errorBubble.waitForDisplayed();
+      const snapshot = await browser.percyCheckScreenshot(BubbleCO.snapshotPath('bubble-slots-error-help'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/ds-chat/card/slots/DSChatCard.slots.axe-core.func.spec.js

@@ -0,0 +1,24 @@
+// Tests for PUI-17908 (ds-chat-card slots implementation)
+import { CardCO } from '../../components';
+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-18463 - DSChatCard:: axe-core - Axe-Core', () => {
+    before(async () => {
+      const errorOnGo = await CardCO.cardSlotsURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should pass axe-core on all card variants', async () => {
+      const titleCard = await CardCO.getRootSlot();
+      await titleCard.waitForDisplayed();
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+  });
+}

package/ds-chat/card/slots/DSChatCard.slots.func.spec.js

@@ -0,0 +1,47 @@
+// Tests for PUI-17908 (ds-chat-card slots implementation)
+import { CardCO } from '../../components';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-18462 - DSChatCard:: slot wiring - Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await CardCO.cardSlotsURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should have custom aria-* for each slot', async () => {
+      await (await CardCO.getRootSlot()).waitForDisplayed();
+      await expect(await CardCO.getRootSlot()).toHaveAttribute('aria-label', 'root aria');
+      await expect(await CardCO.getMainContentSlot()).toHaveAttribute('aria-label', 'main-content aria');
+      await expect(await CardCO.getTitleSlot()).toHaveAttribute('aria-label', 'title aria');
+      await expect(await CardCO.getContentSlot()).toHaveAttribute('aria-label', 'content aria');
+      await expect(await CardCO.getTimeSlot()).toHaveAttribute('aria-label', 'time aria');
+      await expect(await CardCO.getRightAddonSlot()).toHaveAttribute('aria-label', 'right-addon aria');
+      await expect(await CardCO.getTruncatedSpanSlot()).toHaveAttribute('aria-label', 'truncated-span aria');
+    });
+
+    it('02: should have custom data-testid for each slot', async () => {
+      await expect(await CardCO.getRootSlot()).toHaveAttribute('data-testid', 'root data');
+      await expect(await CardCO.getMainContentSlot()).toHaveAttribute('data-testid', 'main-content data');
+      await expect(await CardCO.getTitleSlot()).toHaveAttribute('data-testid', 'title data');
+      await expect(await CardCO.getContentSlot()).toHaveAttribute('data-testid', 'content data');
+      await expect(await CardCO.getTimeSlot()).toHaveAttribute('data-testid', 'time data');
+      await expect(await CardCO.getRightAddonSlot()).toHaveAttribute('data-testid', 'right-addon data');
+      await expect(await CardCO.getTruncatedSpanSlot()).toHaveAttribute('data-testid', 'truncated-span data');
+    });
+
+    it('03: should have custom lang for each slot', async () => {
+      await expect(await CardCO.getRootSlot()).toHaveAttribute('lang', 'pt');
+      await expect(await CardCO.getMainContentSlot()).toHaveAttribute('lang', 'es');
+      await expect(await CardCO.getTitleSlot()).toHaveAttribute('lang', 'de');
+      await expect(await CardCO.getContentSlot()).toHaveAttribute('lang', 'en');
+      await expect(await CardCO.getTimeSlot()).toHaveAttribute('lang', 'fr');
+      await expect(await CardCO.getRightAddonSlot()).toHaveAttribute('lang', 'it');
+      await expect(await CardCO.getTruncatedSpanSlot()).toHaveAttribute('lang', 'nl');
+    });
+  });
+}

package/ds-chat/card/slots/DSChatCard.slots.visual.spec.js

@@ -0,0 +1,18 @@
+// Tests for PUI-17908 (ds-chat-card slots implementation)
+import { CardCO } from '../../components';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-18461 - DSChatCard:: card slot variants - Visual', () => {
+    before(async () => {
+      const errorOnGo = await CardCO.cardSlotsURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should display card with all slot props and style customization', async () => {
+      const root = await CardCO.getRootSlot();
+      await root.waitForDisplayed();
+      const snapshot = await browser.percyCheckScreenshot(CardCO.snapshotPath('card-slot-variants'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/ds-chat/card/truncated-text/DSChatCard.truncated-text.func.spec.js

@@ -0,0 +1,32 @@
+import { CardCO } from '../../components';
+import { mouseOver } from '../../../helpers';
+
+if (
+  (!browser.capabilities['ice:options'].isPhone &&
+    !browser.capabilities['ice:options'].isTablet &&
+    browser.capabilities.browserName === 'chrome') ||
+  browser.capabilities.browserName === 'Chrome'
+) {
+  describe('PUI-18484 - DSChatCard:: truncated text - Func', () => {
+    before('loading page', async () => {
+      const errorOnGo = await CardCO.cardTruncatedURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should render TruncatedSpan for each card with long content', async () => {
+      const span = await CardCO.getTruncatedSpan(0);
+      await span.waitForDisplayed();
+      await expect(span).toBeDisplayed();
+      await expect(await CardCO.getTruncatedSpan(1)).toBeDisplayed();
+      await expect(await CardCO.getTruncatedSpan(2)).toBeDisplayed();
+    });
+
+    it('02: should show tooltip on hover when content overflows', async () => {
+      const span = await CardCO.getTruncatedSpan(0);
+      await mouseOver(span);
+      const tooltip = await CardCO.getTooltipContainer();
+      await tooltip.waitForDisplayed({ timeout: 3000 });
+      await expect(tooltip).toBeDisplayed();
+    });
+  });
+}

package/ds-chat/card/truncated-text/DSChatCard.truncated-text.visual.spec.js

@@ -0,0 +1,26 @@
+import { CardCO } from '../../components';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-18483 - DSChatCard:: truncated text - Visual', () => {
+    before('loading page', async () => {
+      const errorOnGo = await CardCO.cardTruncatedURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should display cards with truncated content at rest', async () => {
+      const span = await CardCO.getTruncatedSpan(0);
+      await span.waitForDisplayed();
+      const snapshot = await browser.percyCheckScreenshot(CardCO.snapshotPath('truncated-text'));
+      await expect(snapshot).toEqual(0);
+    });
+
+    it('02: should display tooltip on hover over truncated content', async () => {
+      const span = await CardCO.getTruncatedSpan(0);
+      await span.moveTo();
+      const tooltip = await CardCO.getTooltipContainer();
+      await tooltip.waitForDisplayed({ timeout: 3000 });
+      const snapshot = await browser.percyCheckScreenshot(CardCO.snapshotPath('truncated-text-tooltip'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/ds-chat/card/with-notification-badges/DSChatCard.with-notification-badges.axe-core.func.spec.js

@@ -0,0 +1,23 @@
+import { CardCO } from '../../components';
+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-18486 - DSChatCard:: with notification badges - Axe-Core', () => {
+    before('loading page', async () => {
+      const errorOnGo = await CardCO.cardWithNotificationBadgesURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should pass axe-core with notification badge variants', async () => {
+      const cards = await CardCO.getCards();
+      await cards[0].waitForDisplayed();
+      const result = await axeCoreCheck();
+      expect(result.length).toBe(0);
+    });
+  });
+}

package/ds-chat/card/with-notification-badges/DSChatCard.with-notification-badges.visual.spec.js

@@ -0,0 +1,17 @@
+import { CardCO } from '../../components';
+
+if (!browser.capabilities['ice:options'].isPhone && !browser.capabilities['ice:options'].isTablet) {
+  describe('PUI-18485 - DSChatCard:: with notification badges - Visual', () => {
+    before('loading page', async () => {
+      const errorOnGo = await CardCO.cardWithNotificationBadgesURL.go();
+      if (errorOnGo) throw errorOnGo;
+    });
+
+    it('01: should display cards with notification badges', async () => {
+      const cards = await CardCO.getCards();
+      await cards[0].waitForDisplayed();
+      const snapshot = await browser.percyCheckScreenshot(CardCO.snapshotPath('with-notification-badges'));
+      await expect(snapshot).toEqual(0);
+    });
+  });
+}

package/ds-chat/components/BubbleCO.js

@@ -1,13 +1,15 @@
-import { PATH_E2E_CHAT } from '../../paths';
+import { PATH_E2E_CHAT, PATH_E2E_CHAT_BUBBLE } from '../../paths';
 import { PageObject, Urlbuilder } from '../../helpers';
 
 export default class BubbleCO extends PageObject {
-  static bubbleURL = new Urlbuilder(PATH_E2E_CHAT, 'bubble-test');
+  static bubbleURL = new Urlbuilder(PATH_E2E_CHAT_BUBBLE, 'bubble-test');
 
-  static bubbleWrapping = new Urlbuilder(PATH_E2E_CHAT, 'bubble-wrapping-test');
+  static bubbleWrapping = new Urlbuilder(PATH_E2E_CHAT_BUBBLE, 'bubble-wrapping-test');
 
   static systemMessageInContainerUCURL = new Urlbuilder(PATH_E2E_CHAT, 'system-message-in-container');
 
+  static bubbleSlotsURL = new Urlbuilder(PATH_E2E_CHAT_BUBBLE, 'slots-test');
+
   // selectors
   static async getErrorMessage(bubbleId) {
     return $(`[data-testid="chat-bubble-error-message-${bubbleId}"]`);
@@ -56,6 +58,47 @@ export default class BubbleCO extends PageObject {
     }, bubbleId);
   }
 
+  static async getBubbleWrapper(bubbleId) {
+    return $(`[data-testid="ds-chat-bubble-${bubbleId}"]`);
+  }
+
+  // Slot selectors (used by slots func spec — one bubble per story)
+  static async getWrapperSlot() {
+    return $('[data-dimsum-slot="dsBubbleWrapper"]');
+  }
+
+  static async getColoredBubbleSlot() {
+    return $('[data-dimsum-slot="dsBubbleColoredBubble"]');
+  }
+
+  static async getHeaderSlot() {
+    return $('[data-dimsum-slot="dsBubbleHeader"]');
+  }
+
+  static async getHeaderLeftSlot() {
+    return $('[data-dimsum-slot="dsBubbleHeaderLeft"]');
+  }
+
+  static async getHeaderRightSlot() {
+    return $('[data-dimsum-slot="dsBubbleHeaderRight"]');
+  }
+
+  static async getBodyWrapperSlot() {
+    return $('[data-dimsum-slot="dsBubbleBodyWrapper"]');
+  }
+
+  static async getArrowSlot() {
+    return $('[data-dimsum-slot="dsBubbleArrow"]');
+  }
+
+  static async getErrorMessageSlot() {
+    return $('[data-dimsum-slot="dsBubbleErrorMessage"]');
+  }
+
+  static async getHelpMessageSlot() {
+    return $('[data-dimsum-slot="dsBubbleHelpMessage"]');
+  }
+
   // Snapshots
   static snapshotPath(example = 'basic') {
     return PageObject.getSnapshotPathBuilder('Bubble', example, 'ds-chat');