@coveo/quantic 3.33.0 → 3.33.1

package/force-app/main/default/lwc/quanticSmartSnippetSuggestions/__tests__/quanticSmartSnippetSuggestions.test.js

@@ -0,0 +1,329 @@
+/* eslint-disable no-import-assign */
+import QuanticSmartSnippetSuggestions from '../quanticSmartSnippetSuggestions';
+// @ts-ignore
+import {createElement} from 'lwc';
+import * as mockHeadlessLoader from 'c/quanticHeadlessLoader';
+
+jest.mock('c/quanticHeadlessLoader');
+
+jest.mock(
+  '@salesforce/label/c.quantic_PeopleAlsoAsk',
+  () => ({default: 'People also ask'}),
+  {
+    virtual: true,
+  }
+);
+
+let isInitialized = false;
+
+const exampleEngine = {
+  id: 'exampleEngineId',
+};
+
+const exampleUri = 'https://en.wikipedia.org/wiki/The_Lord_of_the_Rings';
+
+const defaultOptions = {
+  engineId: exampleEngine.id,
+};
+
+const selectors = {
+  initializationError: 'c-quantic-component-error',
+  smartSnippetSuggestionsComponent:
+    '[data-testid="smart-snippet-suggestions-card"]',
+  smartSnippetSuggestions: '[data-testid="smart-snippet-suggestion"]',
+  smartSnippetSuggestionAnswers: 'c-quantic-smart-snippet-answer',
+  smartSnippetSuggestionSources: 'c-quantic-smart-snippet-source',
+  smartSnippetAccordionElement: 'lightning-accordion',
+};
+
+const mockSmartSnippetSource = {
+  title: 'The Lord of the Rings',
+  uri: exampleUri,
+  clickUri: exampleUri,
+};
+
+const mockSmartSnippetRelatedQuestions = [
+  {
+    question: 'Where is Gandalf?',
+    answer: 'Gandalf is in the Mines of Moria.',
+    documentId: {
+      contentIdKey: '2',
+      contentIdValue: '2',
+    },
+    questionAnswerId: '2',
+    expanded: false,
+    source: mockSmartSnippetSource,
+    score: 0.5,
+  },
+  {
+    question: 'Legolas, what do you see?',
+    answer: "They're taking the hobbits to Isengard!",
+    documentId: {
+      contentIdKey: '3',
+      contentIdValue: '3',
+    },
+    questionAnswerId: '3',
+    expanded: false,
+    source: mockSmartSnippetSource,
+    score: 0.5,
+  },
+];
+
+const defaultSmartSnippetSuggestionsState = {
+  questions: mockSmartSnippetRelatedQuestions,
+};
+
+let smartSnippetSuggestionsState = defaultSmartSnippetSuggestionsState;
+
+const functionsMocks = {
+  buildSmartSnippetQuestionsList: jest.fn(() => ({
+    state: smartSnippetSuggestionsState,
+    subscribe: functionsMocks.smartSnippetSuggestionsStateSubscriber,
+    expand: functionsMocks.expand,
+    collapse: functionsMocks.collapse,
+    select: functionsMocks.select,
+    beginDelayedSelect: functionsMocks.beginDelayedSelect,
+    cancelPendingSelect: functionsMocks.cancelPendingSelect,
+    selectInlineLink: functionsMocks.selectInlineLink,
+    beginDelayedSelectInlineLink: functionsMocks.beginDelayedSelectInlineLink,
+    cancelPendingSelectInlineLink: functionsMocks.cancelPendingSelectInlineLink,
+  })),
+  smartSnippetSuggestionsStateSubscriber: jest.fn((cb) => {
+    cb();
+    return functionsMocks.smartSnippetSuggestionsStateUnsubscriber;
+  }),
+  smartSnippetSuggestionsStateUnsubscriber: jest.fn(),
+  expand: jest.fn(),
+  collapse: jest.fn(),
+  select: jest.fn(),
+  beginDelayedSelect: jest.fn(),
+  cancelPendingSelect: jest.fn(),
+  selectInlineLink: jest.fn(),
+  beginDelayedSelectInlineLink: jest.fn(),
+  cancelPendingSelectInlineLink: jest.fn(),
+};
+
+function createTestComponent(options = defaultOptions) {
+  const element = createElement('c-quantic-smart-snippet-suggestions', {
+    is: QuanticSmartSnippetSuggestions,
+  });
+  for (const [key, value] of Object.entries(options)) {
+    element[key] = value;
+  }
+  document.body.appendChild(element);
+  return element;
+}
+
+// Helper function to wait until the microtask queue is empty.
+function flushPromises() {
+  return new Promise((resolve) => setTimeout(resolve, 0));
+}
+
+function prepareHeadlessState() {
+  // @ts-ignore
+  mockHeadlessLoader.getHeadlessBundle = () => {
+    return {
+      buildSmartSnippetQuestionsList:
+        functionsMocks.buildSmartSnippetQuestionsList,
+    };
+  };
+}
+
+function mockSuccessfulHeadlessInitialization() {
+  // @ts-ignore
+  mockHeadlessLoader.initializeWithHeadless = (element, _, initialize) => {
+    if (element instanceof QuanticSmartSnippetSuggestions && !isInitialized) {
+      isInitialized = true;
+      initialize(exampleEngine);
+    }
+  };
+}
+
+function mockErroneousHeadlessInitialization() {
+  // @ts-ignore
+  mockHeadlessLoader.initializeWithHeadless = (element) => {
+    if (element instanceof QuanticSmartSnippetSuggestions) {
+      element.setInitializationError();
+    }
+  };
+}
+
+function cleanup() {
+  // The jsdom instance is shared across test cases in a single file so reset the DOM
+  while (document.body.firstChild) {
+    document.body.removeChild(document.body.firstChild);
+  }
+  jest.clearAllMocks();
+  isInitialized = false;
+}
+
+describe('c-quantic-smart-snippet-suggestions', () => {
+  afterEach(() => {
+    smartSnippetSuggestionsState = defaultSmartSnippetSuggestionsState;
+    cleanup();
+  });
+
+  describe('controller initialization', () => {
+    beforeEach(() => {
+      mockSuccessfulHeadlessInitialization();
+      prepareHeadlessState();
+    });
+
+    it('should build the smart snippet controller with the proper parameters and subscribe to its state change', async () => {
+      createTestComponent();
+      await flushPromises();
+
+      expect(
+        functionsMocks.buildSmartSnippetQuestionsList
+      ).toHaveBeenCalledTimes(1);
+      expect(
+        functionsMocks.buildSmartSnippetQuestionsList
+      ).toHaveBeenCalledWith(exampleEngine);
+      expect(
+        functionsMocks.smartSnippetSuggestionsStateSubscriber
+      ).toHaveBeenCalledTimes(1);
+    });
+  });
+
+  describe('when an initialization error occurs', () => {
+    beforeEach(() => {
+      mockErroneousHeadlessInitialization();
+    });
+
+    it('should display the initialization error component', async () => {
+      const element = createTestComponent();
+      await flushPromises();
+
+      const initializationError = element.shadowRoot.querySelector(
+        selectors.initializationError
+      );
+
+      expect(initializationError).not.toBeNull();
+    });
+  });
+
+  describe('when the query does not return smart snippet suggestions', () => {
+    beforeEach(() => {
+      smartSnippetSuggestionsState = {
+        ...defaultSmartSnippetSuggestionsState,
+        questions: [],
+      };
+      mockSuccessfulHeadlessInitialization();
+      prepareHeadlessState();
+    });
+
+    it('should not display the smart snippet suggestions component', async () => {
+      const element = createTestComponent();
+      await flushPromises();
+
+      const smartSnippetSuggestionsComponent = element.shadowRoot.querySelector(
+        selectors.smartSnippetSuggestionsComponent
+      );
+      expect(smartSnippetSuggestionsComponent).toBeNull();
+    });
+  });
+
+  describe('when the query returns smart snippet suggestions', () => {
+    beforeEach(() => {
+      mockSuccessfulHeadlessInitialization();
+      prepareHeadlessState();
+    });
+
+    it('should properly display the smart snippet suggestions', async () => {
+      const element = createTestComponent();
+      await flushPromises();
+
+      const smartSnippetSuggestionsComponent = element.shadowRoot.querySelector(
+        selectors.smartSnippetSuggestionsComponent
+      );
+      expect(smartSnippetSuggestionsComponent).not.toBeNull();
+
+      const smartSnippetSuggestions = element.shadowRoot.querySelectorAll(
+        selectors.smartSnippetSuggestions
+      );
+      const smartSnippetSuggestionAnswers = element.shadowRoot.querySelectorAll(
+        selectors.smartSnippetSuggestionAnswers
+      );
+      const smartSnippetSuggestionsSources =
+        element.shadowRoot.querySelectorAll(
+          selectors.smartSnippetSuggestionSources
+        );
+
+      mockSmartSnippetRelatedQuestions.forEach((question, index) => {
+        const suggestion = smartSnippetSuggestions[index];
+        const answerElement = smartSnippetSuggestionAnswers[index];
+        const sourceElement = smartSnippetSuggestionsSources[index];
+
+        expect(suggestion.label).toEqual(question.question);
+        expect(answerElement.answer).toEqual(question.answer);
+        expect(sourceElement.source).toEqual(question.source);
+      });
+    });
+
+    describe('when clicking on the smart snippet suggestion', () => {
+      it('should call the expand and collapse methods from the smartSnippetSuggestions controller', async () => {
+        const element = createTestComponent();
+        await flushPromises();
+
+        const smartSnippetAccordionElement = element.shadowRoot.querySelector(
+          selectors.smartSnippetAccordionElement
+        );
+        expect(smartSnippetAccordionElement).not.toBeNull();
+        smartSnippetAccordionElement.activeSectionName = [
+          mockSmartSnippetRelatedQuestions[0].question,
+        ];
+
+        const smartSnippetSuggestionsItems =
+          element.shadowRoot.querySelectorAll(
+            selectors.smartSnippetSuggestions
+          );
+        expect(smartSnippetSuggestionsItems[0]).not.toBeNull();
+
+        await smartSnippetSuggestionsItems[0].click();
+        await flushPromises();
+
+        expect(functionsMocks.expand).toHaveBeenCalledTimes(1);
+        expect(functionsMocks.expand).toHaveBeenCalledWith(
+          mockSmartSnippetRelatedQuestions[0].questionAnswerId
+        );
+
+        smartSnippetAccordionElement.activeSectionName = [];
+        await smartSnippetSuggestionsItems[0].click();
+        await flushPromises();
+
+        expect(functionsMocks.collapse).toHaveBeenCalledTimes(1);
+        expect(functionsMocks.collapse).toHaveBeenCalledWith(
+          mockSmartSnippetRelatedQuestions[0].questionAnswerId
+        );
+      });
+    });
+
+    it('should pass the proper actions to the smart snippet answer and source', async () => {
+      const element = createTestComponent();
+      await flushPromises();
+
+      const smartSnippetAnswer = element.shadowRoot.querySelector(
+        selectors.smartSnippetSuggestionAnswers
+      );
+      const smartSnippetSource = element.shadowRoot.querySelector(
+        selectors.smartSnippetSuggestionSources
+      );
+
+      expect(smartSnippetAnswer).not.toBeNull();
+      expect(smartSnippetSource).not.toBeNull();
+
+      const expectedSmartSnippetSuggestionsActions = {
+        select: functionsMocks.select,
+        beginDelayedSelect: functionsMocks.beginDelayedSelect,
+        cancelPendingSelect: functionsMocks.cancelPendingSelect,
+      };
+
+      expect(Object.keys(smartSnippetAnswer.actions)).toEqual(
+        Object.keys(expectedSmartSnippetSuggestionsActions)
+      );
+      expect(Object.keys(smartSnippetSource.actions)).toEqual(
+        Object.keys(expectedSmartSnippetSuggestionsActions)
+      );
+    });
+  });
+});

package/force-app/main/default/lwc/quanticSmartSnippetSuggestions/e2e/data.ts

@@ -0,0 +1,31 @@
+import {RelatedQuestionsData} from '../../../../../../playwright/page-object/searchObjectWithSmartSnippet';
+
+const exampleContentIdKey = 'permanentid';
+const mockPermanentId = '1234';
+const exampleContentIdValue = mockPermanentId;
+
+const exampleRelatedQuestions = [
+  {
+    question: "What is the name of Gandalf's horse?",
+    answerSnippet:
+      'Is is Shadowfax, the lord of all horses. <a href="#">Click here to see the magnificent horse.</a>',
+    documentId: {
+      contentIdKey: exampleContentIdKey,
+      contentIdValue: exampleContentIdValue,
+    },
+  },
+  {
+    question: 'What is the name of the sword that was broken?',
+    answerSnippet: 'It is Narsil, the sword of Elendil.',
+    documentId: {
+      contentIdKey: exampleContentIdKey,
+      contentIdValue: exampleContentIdValue,
+    },
+  },
+];
+
+const smartSnippetSuggestionsData: RelatedQuestionsData = {
+  relatedQuestions: exampleRelatedQuestions,
+};
+
+export default smartSnippetSuggestionsData;

package/force-app/main/default/lwc/quanticSmartSnippetSuggestions/e2e/fixture.ts

@@ -0,0 +1,93 @@
+import {SmartSnippetSuggestionsObject} from './pageObject';
+import {quanticBase} from '../../../../../../playwright/fixtures/baseFixture';
+import {
+  SearchObjectWithSmartSnippet,
+  RelatedQuestionsData,
+} 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 smartSnippetSuggestionsData from './data';
+
+const pageUrl = 's/quantic-smart-snippet-suggestions';
+
+interface SmartSnippetSuggestionsOptions {}
+
+type QuanticSmartSnippetSuggestionsE2ESearchFixtures = {
+  smartSnippetSuggestionsData: RelatedQuestionsData;
+  smartSnippetSuggestions: SmartSnippetSuggestionsObject;
+  search: SearchObjectWithSmartSnippet;
+  options: Partial<SmartSnippetSuggestionsOptions>;
+};
+
+type QuanticSmartSnippetSuggestionsE2EInsightFixtures =
+  QuanticSmartSnippetSuggestionsE2ESearchFixtures & {
+    insightSetup: InsightSetupObject;
+  };
+
+export const testSearch =
+  quanticBase.extend<QuanticSmartSnippetSuggestionsE2ESearchFixtures>({
+    smartSnippetSuggestionsData,
+    options: {},
+    search: async ({page}, use) => {
+      await use(new SearchObjectWithSmartSnippet(page, searchRequestRegex));
+    },
+    smartSnippetSuggestions: async (
+      {page, options, configuration, search, smartSnippetSuggestionsData: data},
+      use
+    ) => {
+      const smartSnippetSuggestionsObject = new SmartSnippetSuggestionsObject(
+        page
+      );
+
+      await page.goto(pageUrl);
+      await search.mockSearchWithSmartSnippetSuggestionsResponse(data);
+
+      configuration.configure(options);
+      await search.waitForSearchResponse();
+      await use(smartSnippetSuggestionsObject);
+    },
+  });
+
+export const testInsight =
+  quanticBase.extend<QuanticSmartSnippetSuggestionsE2EInsightFixtures>({
+    smartSnippetSuggestionsData,
+    options: {},
+    search: async ({page}, use) => {
+      await use(
+        new SearchObjectWithSmartSnippet(page, insightSearchRequestRegex)
+      );
+    },
+    insightSetup: async ({page}, use) => {
+      await use(new InsightSetupObject(page));
+    },
+    smartSnippetSuggestions: async (
+      {
+        page,
+        options,
+        search,
+        configuration,
+        insightSetup,
+        smartSnippetSuggestionsData: data,
+      },
+      use
+    ) => {
+      const smartSnippetSuggestionsObject = new SmartSnippetSuggestionsObject(
+        page
+      );
+
+      await page.goto(pageUrl);
+      await search.mockSearchWithSmartSnippetSuggestionsResponse(data);
+
+      configuration.configure({...options, useCase: useCaseEnum.insight});
+      await insightSetup.waitForInsightInterfaceInitialization();
+      await search.performSearch();
+      await search.waitForSearchResponse();
+      await use(smartSnippetSuggestionsObject);
+    },
+  });
+
+export {expect} from '@playwright/test';

package/force-app/main/default/lwc/quanticSmartSnippetSuggestions/e2e/pageObject.ts

@@ -0,0 +1,160 @@
+import type {Locator, Page, Request} from '@playwright/test';
+import {
+  isUaCustomEvent,
+  isUaClickEvent,
+} from '../../../../../../playwright/utils/requests';
+
+export class SmartSnippetSuggestionsObject {
+  constructor(public page: Page) {
+    this.page = page;
+  }
+
+  get smartSnippetSuggestions(): Locator {
+    return this.page.locator('c-quantic-smart-snippet-suggestions');
+  }
+
+  get smartSnippetSuggestionHeading(): Locator {
+    return this.page.locator(
+      'lightning-accordion-section .slds-accordion__summary-heading'
+    );
+  }
+
+  get smartSnippetSuggestionSourceUri(): Locator {
+    return this.page.getByTestId('smart-snippet__source-uri');
+  }
+
+  get smartSnippetSuggestionSourceTitle(): Locator {
+    return this.page.getByTestId('smart-snippet__source-title');
+  }
+
+  get smartSnippetSuggestionInlineLink(): Locator {
+    return this.page.getByTestId('smart-snippet-answer').locator('a');
+  }
+
+  async clickOnSmartSnippetSuggestionHeading(index: number): Promise<void> {
+    await this.smartSnippetSuggestionHeading.nth(index).click();
+  }
+
+  async clickOnSmartSnippetSuggestionSourceUri(index: number): Promise<void> {
+    await this.smartSnippetSuggestionSourceUri.nth(index).click();
+  }
+
+  async clickOnSmartSnippetSuggestionSourceTitle(index: number): Promise<void> {
+    await this.smartSnippetSuggestionSourceTitle.nth(index).click();
+  }
+
+  async clickOnSmartSnippetSuggestionInlineLink(index: number): Promise<void> {
+    await this.smartSnippetSuggestionInlineLink.nth(index).click();
+  }
+
+  async waitForExpandSmartSnippetSuggestionUaAnalytics(
+    expectedFields: Record<string, any>
+  ): Promise<Request> {
+    return this.waitForSmartSnippetSuggestionsCustomUaAnalytics(
+      'expandSmartSnippetSuggestion',
+      (customData: Record<string, any>) => {
+        return Object.keys(expectedFields).every(
+          (key) => customData?.[key] === expectedFields[key]
+        );
+      }
+    );
+  }
+
+  async waitForCollapseSmartSnippetSuggestionUaAnalytics(
+    expectedFields: Record<string, any>
+  ): Promise<Request> {
+    return this.waitForSmartSnippetSuggestionsCustomUaAnalytics(
+      'collapseSmartSnippetSuggestion',
+      (customData: Record<string, any>) => {
+        return Object.keys(expectedFields).every(
+          (key) => customData?.[key] === expectedFields[key]
+        );
+      }
+    );
+  }
+
+  async waitForSmartSnippetSuggestionSourceClickUaAnalytics(
+    expectedCustomFields: Record<string, any>
+  ): Promise<Request> {
+    return this.waitForSmartSnippetSuggestionsClickUaAnalytics(
+      'openSmartSnippetSuggestionSource',
+      (customData: Record<string, any>) => {
+        return Object.keys(expectedCustomFields).every(
+          (key) => customData?.[key] === expectedCustomFields[key]
+        );
+      }
+    );
+  }
+
+  async waitForSmartSnippetSuggestionInlineLinkClickUaAnalytics(
+    expectedCustomFields: Record<string, any>
+  ): Promise<Request> {
+    return this.waitForSmartSnippetSuggestionsClickUaAnalytics(
+      'openSmartSnippetSuggestionInlineLink',
+      (customData: Record<string, any>) => {
+        return Object.keys(expectedCustomFields).every(
+          (key) => customData?.[key] === expectedCustomFields[key]
+        );
+      }
+    );
+  }
+
+  async waitForSmartSnippetSuggestionsClickUaAnalytics(
+    actionCause: string,
+    customChecker?: Function
+  ): Promise<Request> {
+    const uaRequest = this.page.waitForRequest((request) => {
+      if (isUaClickEvent(request)) {
+        const requestBody = request.postDataJSON?.();
+        const requestData = JSON.parse(requestBody.clickEvent);
+
+        const expectedFields: Record<string, any> = {
+          actionCause,
+        };
+
+        const matchesExpectedFields = Object.keys(expectedFields).every(
+          (key) => requestData?.[key] === expectedFields[key]
+        );
+
+        const customData = requestData?.customData;
+
+        return (
+          matchesExpectedFields &&
+          (customChecker
+            ? customChecker(requestData.customData, customData)
+            : true)
+        );
+      }
+      return false;
+    });
+    return uaRequest;
+  }
+
+  async waitForSmartSnippetSuggestionsCustomUaAnalytics(
+    eventValue: string,
+    customChecker?: Function
+  ): Promise<Request> {
+    const uaRequest = this.page.waitForRequest((request) => {
+      if (isUaCustomEvent(request)) {
+        const requestBody = request.postDataJSON?.();
+        const expectedFields: Record<string, any> = {
+          eventType: 'smartSnippetSuggestions',
+          eventValue: eventValue,
+        };
+
+        const matchesExpectedFields = Object.keys(expectedFields).every(
+          (key) => requestBody?.[key] === expectedFields[key]
+        );
+
+        const customData = requestBody?.customData;
+
+        return (
+          matchesExpectedFields &&
+          (customChecker ? customChecker(customData) : true)
+        );
+      }
+      return false;
+    });
+    return uaRequest;
+  }
+}