feat(quantic): Migration of Quantic Smart Snippet suggestions to Play…

…wright (#4888)

[SFINT-5917](https://coveord.atlassian.net/browse/SFINT-5917)

## IN THIS PR:
- We are migrating E2E tests for the `quanticSmartSnippetSuggestions`
component from Cypress to Playwright and adding unit tests.

## UNIT TESTS:
<img width="427" alt="image"
src="https://github.com/user-attachments/assets/5c84d086-2dab-4187-ad5b-2ad0716e6118"
/>


## E2E TESTS:
<img width="528" alt="image"
src="https://github.com/user-attachments/assets/6362c0c1-0d0b-4a26-b20f-d5275aea61d7"
/>


[SFINT-5917]:
https://coveord.atlassian.net/browse/SFINT-5917?atlOrigin=eyJpIjoiNWRkNTljNzYxNjVmNDY3MDlhMDU5Y2ZhYzA5YTRkZjUiLCJwIjoiZ2l0aHViLWNvbS1KU1cifQ

packages/quantic/cypress/e2e/default-2/smart-snippet-suggestions/smart-snippet-suggestions-selectors.ts

@@ -18,15 +18,15 @@ export const SmartSnippetSuggestionsSelectors: SmartSnippetSuggestionsSelector =
 
     smartSnippetSuggestionsCard: () =>
       SmartSnippetSuggestionsSelectors.get().find(
-        '[data-cy="smart-snippet-suggestions-card"]'
+        '[data-testid="smart-snippet-suggestions-card"]'
       ),
     smartSnippetSuggestionHeading: (index: number) =>
       SmartSnippetSuggestionsSelectors.get()
         .find('lightning-accordion-section .slds-accordion__summary-heading')
         .eq(index),
     smartSnippetSuggestionsAnswer: (index: number) =>
       SmartSnippetSuggestionsSelectors.get()
-        .find('[data-cy="smart-snippet-answer"]')
+        .find('[data-testid="smart-snippet-answer"]')
         .eq(index),
     smartSnippetSuggestionsSourceUri: (index: number) =>
       SmartSnippetSuggestionsSelectors.get()

packages/quantic/cypress/e2e/default-2/smart-snippet/smart-snippet-selectors.ts

@@ -29,7 +29,7 @@ export const SmartSnippetSelectors: SmartSnippetSelector = {
   smartSnippetQuestion: () =>
     SmartSnippetSelectors.smartSnippetCard().find('header'),
   smartSnippetAnswer: () =>
-    SmartSnippetSelectors.get().find('[data-cy="smart-snippet-answer"]'),
+    SmartSnippetSelectors.get().find('[data-testid="smart-snippet-answer"]'),
   smartSnippetSourceUri: () =>
     SmartSnippetSelectors.get().find(
       '[data-testid="smart-snippet__source-uri"]'

packages/quantic/force-app/main/default/lwc/quanticSmartSnippet/e2e/data.ts

@@ -1,21 +1,12 @@
+import {QuestionAnswerData} from '../../../../../../playwright/page-object/searchObjectWithSmartSnippet';
+
 const exampleQuestion = 'Where was Gondor when the Westfold fell?';
 const exampleAnswerSnippet = `<a href="#">Gondor</a> was on the brink of destruction when the Westfold fell. Gondor did not come to Rohan's aid when the Westfold fell because it was overwhelmed by its own dire circumstances and unable to spare resources or manpower. The alliance between the two kingdoms, forged by the Oath of Eorl, was based on a promise of mutual defense in times of extreme need. However, by the time of the War of the Ring, Gondor was facing unprecedented threats from Sauron, whose forces in Mordor were massing for a full-scale assault on Minas Tirith. The Steward of Gondor, Denethor II, was deeply concerned about the security of his own kingdom and could not afford to weaken its defenses to send aid across the vast distances that separated Gondor from the Westfold. Even if assistance had been feasible, the logistical challenge of moving troops through potentially hostile territory would have delayed their arrival, rendering their efforts ineffective. Moreover, the threat to Rohan came not only from Sauron's influence but also from the unexpected betrayal of Saruman, who, until then, had been perceived as an ally. His treachery, combined with the swiftness and brutality of his attacks, left Rohan vulnerable and isolated, as neither Rohan nor Gondor had anticipated such aggression from Isengard. While the alliance between the two realms remained strong in spirit, Gondor's immediate need to safeguard its own survival against the growing shadow of Mordor took precedence, leaving Rohan to fend for itself during the fall of the Westfold.`;
 const exampleScore = 0.42;
 const exampleContentIdKey = 'permanentid';
 const mockPermanentId = '1234';
 const exampleContentIdValue = mockPermanentId;
 
-export type QuestionAnswerData = {
-  answerFound: boolean;
-  question: string;
-  answerSnippet: string;
-  documentId: {
-    contentIdKey: string;
-    contentIdValue: string;
-  };
-  score: number;
-};
-
 const smartSnippetData: QuestionAnswerData = {
   answerFound: true,
   question: exampleQuestion,

packages/quantic/force-app/main/default/lwc/quanticSmartSnippet/e2e/fixture.ts

@@ -1,13 +1,15 @@
 import {SmartSnippetObject} from './pageObject';
 import {quanticBase} from '../../../../../../playwright/fixtures/baseFixture';
-import {SearchObject} from '../../../../../../playwright/page-object/searchObject';
+import {
+  SearchObjectWithSmartSnippet,
+  QuestionAnswerData,
+} from '../../../../../../playwright/page-object/searchObjectWithSmartSnippet';
 import {
   searchRequestRegex,
   insightSearchRequestRegex,
 } from '../../../../../../playwright/utils/requests';
 import {InsightSetupObject} from '../../../../../../playwright/page-object/insightSetupObject';
 import {useCaseEnum} from '../../../../../../playwright/utils/useCase';
-import type {QuestionAnswerData} from './data';
 import smartSnippetData from './data';
 
 const pageUrl = 's/quantic-smart-snippet';
@@ -19,7 +21,7 @@ interface SmartSnippetOptions {
 type QuanticSmartSnippetE2ESearchFixtures = {
   smartSnippetData: QuestionAnswerData;
   smartSnippet: SmartSnippetObject;
-  search: SearchObject;
+  search: SearchObjectWithSmartSnippet;
   options: Partial<SmartSnippetOptions>;
 };
 
@@ -33,7 +35,7 @@ export const testSearch =
     smartSnippetData,
     options: {},
     search: async ({page}, use) => {
-      await use(new SearchObject(page, searchRequestRegex));
+      await use(new SearchObjectWithSmartSnippet(page, searchRequestRegex));
     },
     smartSnippet: async (
       {page, options, configuration, search, smartSnippetData: data},
@@ -55,7 +57,9 @@ export const testInsight =
     smartSnippetData,
     options: {},
     search: async ({page}, use) => {
-      await use(new SearchObject(page, insightSearchRequestRegex));
+      await use(
+        new SearchObjectWithSmartSnippet(page, insightSearchRequestRegex)
+      );
     },
     insightSetup: async ({page}, use) => {
       await use(new InsightSetupObject(page));

packages/quantic/force-app/main/default/lwc/quanticSmartSnippet/e2e/pageObject.ts

@@ -22,7 +22,7 @@ export class SmartSnippetObject {
   }
 
   get smartSnippetAnwerInlineLink(): Locator {
-    return this.page.locator('.smart-snippet-answer a');
+    return this.page.locator('[data-testid="smart-snippet-answer"] > a');
   }
 
   get smartSnippetToggleButton(): Locator {

packages/quantic/force-app/main/default/lwc/quanticSmartSnippetAnswer/quanticSmartSnippetAnswer.html

@@ -1,3 +1,3 @@
 <template>
-  <div data-cy="smart-snippet-answer" class="smart-snippet-answer" lwc:dom="manual"></div>
+  <div data-testid="smart-snippet-answer" class="smart-snippet-answer" lwc:dom="manual"></div>
 </template>