@coveo/quantic 3.33.0 → 3.33.1

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

@@ -0,0 +1,68 @@
+import {DateFacetObject} from './pageObject';
+import {useCaseEnum} from '../../../../../../playwright/utils/useCase';
+import {InsightSetupObject} from '../../../../../../playwright/page-object/insightSetupObject';
+import {
+  searchRequestRegex,
+  insightSearchRequestRegex,
+} from '../../../../../../playwright/utils/requests';
+import {BaseFacetObject} from '../../../../../../playwright/page-object/baseFacetObject';
+import {facetBase} from '../../../../../../playwright/fixtures/baseFacetFixture';
+import facetData from './data';
+
+const pageUrl = 's/quantic-date-facet';
+
+interface FacetOptions {}
+
+type QuanticFacetE2EFixtures = {
+  facet: DateFacetObject;
+  options: Partial<FacetOptions>;
+  insightSetup?: InsightSetupObject;
+};
+
+export const testSearch = facetBase.extend<QuanticFacetE2EFixtures>({
+  options: {},
+  facetResponseMock: [facetData],
+  baseFacet: async ({page}, use) => {
+    await use(new BaseFacetObject(page, searchRequestRegex));
+  },
+  facet: async (
+    {page, options, configuration, baseFacet, urlHash, facetResponseMock},
+    use
+  ) => {
+    await page.goto(`${pageUrl}#${urlHash ? urlHash : ''}`);
+    if (facetResponseMock) {
+      await baseFacet.mockSearchWithFacetResponse(facetResponseMock);
+    }
+    configuration.configure(options);
+    await baseFacet.waitForSearchResponse();
+
+    await use(new DateFacetObject(page));
+  },
+});
+
+export const testInsight = facetBase.extend<QuanticFacetE2EFixtures>({
+  options: {},
+  facetResponseMock: [facetData],
+  baseFacet: async ({page}, use) => {
+    await use(new BaseFacetObject(page, insightSearchRequestRegex));
+  },
+  insightSetup: async ({page}, use) => {
+    await use(new InsightSetupObject(page));
+  },
+  facet: async (
+    {page, options, baseFacet, configuration, insightSetup, facetResponseMock},
+    use
+  ) => {
+    await page.goto(pageUrl);
+    if (facetResponseMock) {
+      await baseFacet.mockSearchWithFacetResponse(facetResponseMock);
+    }
+    configuration.configure({...options, useCase: useCaseEnum.insight});
+    await insightSetup?.waitForInsightInterfaceInitialization();
+    await baseFacet.performSearch();
+    await baseFacet.waitForSearchResponse();
+    await use(new DateFacetObject(page));
+  },
+});
+
+export {expect} from '@playwright/test';

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

@@ -0,0 +1,27 @@
+import type {Locator, Page} from '@playwright/test';
+
+export class DateFacetObject {
+  constructor(public page: Page) {
+    this.page = page;
+  }
+
+  get facet(): Locator {
+    return this.page.locator('c-quantic-date-facet');
+  }
+
+  get facetValue(): Locator {
+    return this.facet.getByTestId('facet__value');
+  }
+
+  get clearSelectionButton(): Locator {
+    return this.facet.getByRole('button', {name: /Clear filter/i});
+  }
+
+  async getFacetValueWithText(text: string): Promise<Locator> {
+    return this.facetValue.filter({hasText: text}).first();
+  }
+
+  async clickOnFacetValueWithText(text: string): Promise<void> {
+    await this.facetValue.filter({hasText: text}).first().click();
+  }
+}

package/force-app/main/default/lwc/quanticDateFacet/e2e/quanticDateFacet.e2e.ts

@@ -0,0 +1,145 @@
+import {testSearch, testInsight, expect} from './fixture';
+import {
+  useCaseEnum,
+  useCaseTestCases,
+} from '../../../../../../playwright/utils/useCase';
+import facetData from './data';
+const fixtures = {
+  search: testSearch,
+  insight: testInsight,
+};
+
+const exampleField = 'Date';
+
+function formatFacetRange(facetValue: {start: string; end: string}): string {
+  const formatDate = (dateTime: string) => {
+    const [date] = dateTime.split('@');
+    return date.replaceAll('/', '-');
+  };
+
+  return `${formatDate(facetValue.start)} - ${formatDate(facetValue.end)}`;
+}
+
+useCaseTestCases.forEach((useCase) => {
+  let test = fixtures[useCase.value];
+  test.describe(`quantic date facet ${useCase.label}`, () => {
+    test.describe('when selecting and deselecting a facet value', () => {
+      test('should trigger a new search and log the corresponding UA analytics events', async ({
+        baseFacet,
+        facet,
+        page,
+      }) => {
+        const selectedIndex = 0;
+        const {facetId, field, values} = facetData;
+        const expectedFacetData = {
+          facetId,
+          facetField: field,
+          facetValue: `${values[selectedIndex].start}..${values[selectedIndex].end}`,
+        };
+        const facetSelectUaRequest =
+          baseFacet.waitForFacetSelectUaAnalytics(expectedFacetData);
+        let searchResponsePromise = baseFacet.waitForSearchResponse();
+        await facet.clickOnFacetValueWithText(
+          formatFacetRange(values[selectedIndex])
+        );
+
+        await facetSelectUaRequest;
+        let searchResponse = await searchResponsePromise;
+
+        const {analytics: analyticsForFacetSelect} =
+          baseFacet.extractDataFromResponse(searchResponse);
+        expect(analyticsForFacetSelect.actionCause).toEqual('facetSelect');
+
+        if (useCase.value === useCaseEnum.search) {
+          expect(analyticsForFacetSelect.customData).toEqual(
+            expect.objectContaining(expectedFacetData)
+          );
+          const url = page.url();
+          expect(decodeURIComponent(url)).toContain(
+            `df-${field}=${values[selectedIndex].start}..${values[selectedIndex].end}`
+          );
+        }
+
+        const facetDeselectUaRequest =
+          baseFacet.waitForFacetDeselectUaAnalytics({
+            facetId,
+            facetField: field,
+            facetValue: `${values[selectedIndex].start}..${values[selectedIndex].end}`,
+          });
+        searchResponsePromise = baseFacet.waitForSearchResponse();
+
+        await facet.clickOnFacetValueWithText(
+          formatFacetRange(values[selectedIndex])
+        );
+
+        await facetDeselectUaRequest;
+        searchResponse = await searchResponsePromise;
+        const {analytics: analyticsForFacetDeselect} =
+          baseFacet.extractDataFromResponse(searchResponse);
+        expect(analyticsForFacetDeselect.actionCause).toEqual('facetDeselect');
+      });
+    });
+
+    test.describe('when selecting a facet value and clicking the clear filter button', () => {
+      test('should trigger a new search and log the corresponding UA analytics events', async ({
+        baseFacet,
+        facet,
+      }) => {
+        const selectedIndex = 0;
+        const {facetId, field, values} = facetData;
+        const expectedFacetData = {
+          facetId,
+          facetField: field,
+          facetValue: `${values[selectedIndex].start}..${values[selectedIndex].end}`,
+        };
+        const facetSelectUaRequest =
+          baseFacet.waitForFacetSelectUaAnalytics(expectedFacetData);
+        let searchResponsePromise = baseFacet.waitForSearchResponse();
+        await facet.clickOnFacetValueWithText(
+          formatFacetRange(values[selectedIndex])
+        );
+
+        await facetSelectUaRequest;
+        let searchResponse = await searchResponsePromise;
+
+        const {analytics: analyticsForFacetSelect} =
+          baseFacet.extractDataFromResponse(searchResponse);
+        expect(analyticsForFacetSelect.actionCause).toEqual('facetSelect');
+
+        const clearAllUaRequest = baseFacet.waitForFacetClearAllUaAnalytics({
+          facetId: exampleField,
+          facetField: exampleField,
+        });
+        searchResponsePromise = baseFacet.waitForSearchResponse();
+
+        await facet.clearSelectionButton.click();
+
+        await clearAllUaRequest;
+        searchResponse = await searchResponsePromise;
+        const {analytics: analyticsForFacetDeselect} =
+          baseFacet.extractDataFromResponse(searchResponse);
+        expect(analyticsForFacetDeselect.actionCause).toEqual('facetClearAll');
+      });
+    });
+
+    if (useCase.value === useCaseEnum.search) {
+      test.describe('with a selected value in the URL', () => {
+        const date = new Date();
+        const todayDate = date.toISOString().slice(0, 10);
+        date.setDate(date.getDate() - 1);
+        const yesterdayDate = date.toISOString().slice(0, 10);
+
+        test.use({
+          urlHash: `df-${exampleField}=${yesterdayDate.replaceAll('-', '/')}@00:00:00..${todayDate.replaceAll('-', '/')}@23:59:59`,
+          facetResponseMock: undefined,
+        });
+
+        test('should select the correct facet value', async ({facet}) => {
+          await expect(
+            await facet.getFacetValueWithText(`${yesterdayDate} - ${todayDate}`)
+          ).toHaveAttribute('aria-pressed', 'true');
+        });
+      });
+    }
+  });
+});

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

@@ -0,0 +1,348 @@
+/* eslint-disable no-import-assign */
+import QuanticDidYouMean from '../quanticDidYouMean';
+import * as mockHeadlessLoader from 'c/quanticHeadlessLoader';
+import {buildCreateTestComponent, cleanup, flushPromises} from 'c/testUtils';
+
+jest.mock('c/quanticHeadlessLoader');
+jest.mock(
+  '@salesforce/label/c.quantic_NoResultsFor',
+  () => ({default: 'No Results for {{0}}'}),
+  {
+    virtual: true,
+  }
+);
+jest.mock(
+  '@salesforce/label/c.quantic_QueryCorrectedTo',
+  () => ({default: 'Query was automatically corrected to {{0}}'}),
+  {
+    virtual: true,
+  }
+);
+jest.mock(
+  '@salesforce/label/c.quantic_ShowingResultsFor',
+  () => ({default: 'Showing results for {{0}}'}),
+  {
+    virtual: true,
+  }
+);
+jest.mock(
+  '@salesforce/label/c.quantic_SearchInsteadFor',
+  () => ({default: 'Search instead for'}),
+  {
+    virtual: true,
+  }
+);
+
+let isInitialized = false;
+
+const exampleEngine = {
+  id: 'exampleEngineId',
+};
+
+const defaultQueryCorrectionMode = 'legacy';
+const defaultDisableQueryAutoCorrection = false;
+
+const defaultOptions = {
+  engineId: exampleEngine.id,
+  disableQueryAutoCorrection: false,
+  queryCorrectionMode: defaultQueryCorrectionMode,
+};
+
+const selectors = {
+  didYouMeanNoResultsLabel: '[data-testid="no-result-label"]',
+  didYouMeanAutomaticQueryCorrectionLabel:
+    '[data-testid="automatic-query-correction-label"]',
+  didYouMeanApplyCorrectionButton: '[data-testid="apply-correction-button"]',
+  queryTriggerShowingResultsForLabel:
+    '[data-testid="showing-results-for-label"]',
+  queryTriggerSearchInsteadForLabel: '[data-testid="search-instead-for-label"]',
+  queryTriggerUndoButton: '[data-testid="undo-button"]',
+};
+
+const initialDidYouMeanState = {
+  wasCorrectedTo: 'example corrected query',
+  originalQuery: 'example original query',
+  wasAutomaticallyCorrected: true,
+  queryCorrection: {
+    correctedQuery: 'example corrected query',
+    wordCorrected: 'example',
+  },
+  hasQueryCorrection: true,
+};
+let didYouMeanState = initialDidYouMeanState;
+
+const initialQueryTriggerState = {
+  newQuery: 'example new query',
+  originalQuery: 'example original query',
+  wasQueryModified: true,
+};
+let queryTriggerState = initialQueryTriggerState;
+
+const functionsMocks = {
+  undoQueryTrigger: jest.fn(() => {}),
+  applyCorrection: jest.fn(() => {}),
+  buildDidYouMean: jest.fn(() => ({
+    applyCorrection: functionsMocks.applyCorrection,
+    state: didYouMeanState,
+    subscribe: functionsMocks.subscribeDidYouMean,
+  })),
+  buildQueryTrigger: jest.fn(() => ({
+    undo: functionsMocks.undoQueryTrigger,
+    state: queryTriggerState,
+    subscribe: functionsMocks.subscribeQueryTrigger,
+  })),
+  subscribeDidYouMean: jest.fn((cb) => {
+    cb();
+    return functionsMocks.unsubscribeDidYouMean;
+  }),
+  unsubscribeDidYouMean: jest.fn(() => {}),
+  subscribeQueryTrigger: jest.fn((cb) => {
+    cb();
+    return functionsMocks.unsubscribeQueryTrigger;
+  }),
+  unsubscribeQueryTrigger: jest.fn(() => {}),
+};
+
+function prepareHeadlessState() {
+  // @ts-ignore
+  mockHeadlessLoader.getHeadlessBundle = () => {
+    return {
+      buildDidYouMean: functionsMocks.buildDidYouMean,
+      buildQueryTrigger: functionsMocks.buildQueryTrigger,
+    };
+  };
+}
+
+function mockSuccessfulHeadlessInitialization() {
+  // @ts-ignore
+  mockHeadlessLoader.initializeWithHeadless = (element, _, initialize) => {
+    if (element instanceof QuanticDidYouMean && !isInitialized) {
+      isInitialized = true;
+      initialize(exampleEngine);
+    }
+  };
+}
+
+const createTestComponent = buildCreateTestComponent(
+  QuanticDidYouMean,
+  'c-quantic-did-you-mean',
+  defaultOptions
+);
+
+describe('c-quantic-did-you-mean', () => {
+  afterEach(() => {
+    cleanup();
+    isInitialized = false;
+  });
+
+  describe('controller initialization', () => {
+    beforeEach(() => {
+      mockSuccessfulHeadlessInitialization();
+      prepareHeadlessState();
+    });
+
+    it('should subscribe to the headless state changes', async () => {
+      createTestComponent();
+      await flushPromises();
+
+      expect(functionsMocks.buildDidYouMean).toHaveBeenCalledTimes(1);
+      expect(functionsMocks.buildDidYouMean).toHaveBeenCalledWith(
+        exampleEngine,
+        expect.objectContaining({
+          options: expect.objectContaining({
+            queryCorrectionMode: defaultQueryCorrectionMode,
+            automaticallyCorrectQuery: !defaultDisableQueryAutoCorrection,
+          }),
+        })
+      );
+      expect(functionsMocks.subscribeDidYouMean).toHaveBeenCalledTimes(1);
+      expect(functionsMocks.buildQueryTrigger).toHaveBeenCalledTimes(1);
+      expect(functionsMocks.subscribeQueryTrigger).toHaveBeenCalledTimes(1);
+    });
+
+    describe('#disableQueryAutoCorrection property', () => {
+      describe.each([
+        [false, true],
+        [true, false],
+      ])(
+        'when disableQueryAutoCorrection is %s',
+        (disableQueryAutoCorrection, expectedAutomaticallyCorrectQuery) => {
+          it(`should initialize the controller with automaticallyCorrectQuery set to ${expectedAutomaticallyCorrectQuery}`, async () => {
+            createTestComponent({
+              disableQueryAutoCorrection,
+            });
+            await flushPromises();
+
+            expect(functionsMocks.buildDidYouMean).toHaveBeenCalledTimes(1);
+            expect(functionsMocks.buildDidYouMean).toHaveBeenCalledWith(
+              exampleEngine,
+              expect.objectContaining({
+                options: expect.objectContaining({
+                  automaticallyCorrectQuery: expectedAutomaticallyCorrectQuery,
+                }),
+              })
+            );
+          });
+        }
+      );
+    });
+
+    describe('#queryCorrectionMode property', () => {
+      describe.each([['legacy'], ['next']])(
+        'when queryCorrectionMode is %s',
+        (queryCorrectionMode) => {
+          it(`should initialize the headless didYouMean controller with queryCorrectionMode set to ${queryCorrectionMode}`, async () => {
+            createTestComponent({
+              ...defaultOptions,
+              queryCorrectionMode,
+            });
+            await flushPromises();
+            expect(functionsMocks.buildDidYouMean).toHaveBeenCalledTimes(1);
+            expect(functionsMocks.buildDidYouMean).toHaveBeenCalledWith(
+              exampleEngine,
+              expect.objectContaining({
+                options: expect.objectContaining({
+                  automaticallyCorrectQuery: true,
+                  queryCorrectionMode,
+                }),
+              })
+            );
+          });
+        }
+      );
+    });
+  });
+
+  describe('when hasQueryCorrection is true', () => {
+    beforeEach(() => {
+      mockSuccessfulHeadlessInitialization();
+      prepareHeadlessState();
+    });
+
+    it('should render the didYouMean component template with the auto corrected query', async () => {
+      const expectedNoResultsLabel = initialDidYouMeanState.originalQuery;
+      const expectedAutomaticQueryCorrectionLabel =
+        initialDidYouMeanState.wasCorrectedTo;
+      const element = createTestComponent();
+      await flushPromises();
+
+      const didYouMeanNoResultsLabel = element.shadowRoot.querySelector(
+        selectors.didYouMeanNoResultsLabel
+      );
+      expect(didYouMeanNoResultsLabel).not.toBeNull();
+      expect(didYouMeanNoResultsLabel.value).toContain(expectedNoResultsLabel);
+      const didYouMeanAutomaticQueryCorrectionLabel =
+        element.shadowRoot.querySelector(
+          selectors.didYouMeanAutomaticQueryCorrectionLabel
+        );
+      expect(didYouMeanAutomaticQueryCorrectionLabel).not.toBeNull();
+      expect(didYouMeanAutomaticQueryCorrectionLabel.value).toContain(
+        expectedAutomaticQueryCorrectionLabel
+      );
+    });
+
+    describe('when wasAutomaticallyCorrected is false', () => {
+      beforeEach(() => {
+        didYouMeanState.wasAutomaticallyCorrected = false;
+      });
+
+      it('should render the apply correction button to apply the query correct', async () => {
+        const element = createTestComponent();
+        await flushPromises();
+
+        const applyCorrectionButton = element.shadowRoot.querySelector(
+          selectors.didYouMeanApplyCorrectionButton
+        );
+        expect(applyCorrectionButton).not.toBeNull();
+        expect(applyCorrectionButton.textContent).toBe(
+          initialDidYouMeanState.queryCorrection.correctedQuery
+        );
+        applyCorrectionButton.click();
+        await flushPromises();
+        expect(functionsMocks.applyCorrection).toHaveBeenCalledTimes(1);
+      });
+    });
+  });
+
+  describe('when hasQueryCorrection is false', () => {
+    beforeEach(() => {
+      didYouMeanState.hasQueryCorrection = false;
+      queryTriggerState = initialQueryTriggerState;
+      mockSuccessfulHeadlessInitialization();
+      prepareHeadlessState();
+    });
+
+    it('should render the queryTrigger component template', async () => {
+      const expectedNewQuery = initialQueryTriggerState.newQuery;
+      const expectedOriginalQuery = initialQueryTriggerState.originalQuery;
+      const element = createTestComponent();
+      await flushPromises();
+
+      const queryTriggerShowingResultsForLabel =
+        element.shadowRoot.querySelector(
+          selectors.queryTriggerShowingResultsForLabel
+        );
+      expect(queryTriggerShowingResultsForLabel).not.toBeNull();
+      expect(queryTriggerShowingResultsForLabel.value).toContain(
+        expectedNewQuery
+      );
+      const queryTriggerUndoButton = element.shadowRoot.querySelector(
+        selectors.queryTriggerUndoButton
+      );
+      expect(queryTriggerUndoButton).not.toBeNull();
+      expect(queryTriggerUndoButton.textContent).toContain(
+        expectedOriginalQuery
+      );
+    });
+
+    it('should call the queryTrigger undo method when the undo button is clicked', async () => {
+      const element = createTestComponent();
+      await flushPromises();
+
+      const queryTriggerUndoButton = element.shadowRoot.querySelector(
+        selectors.queryTriggerUndoButton
+      );
+      queryTriggerUndoButton.click();
+      await flushPromises();
+
+      expect(functionsMocks.undoQueryTrigger).toHaveBeenCalledTimes(1);
+    });
+  });
+
+  describe('when hasQueryCorrection is false and wasQueryModified is false', () => {
+    beforeEach(() => {
+      didYouMeanState.hasQueryCorrection = false;
+      queryTriggerState = {
+        ...initialQueryTriggerState,
+        wasQueryModified: false,
+      };
+      mockSuccessfulHeadlessInitialization();
+      prepareHeadlessState();
+    });
+
+    it('should not render anything', async () => {
+      const element = createTestComponent();
+      await flushPromises();
+
+      const didYouMeanNoResultsLabel = element.shadowRoot.querySelector(
+        selectors.didYouMeanNoResultsLabel
+      );
+      expect(didYouMeanNoResultsLabel).toBeNull();
+      const didYouMeanAutomaticQueryCorrectionLabel =
+        element.shadowRoot.querySelector(
+          selectors.didYouMeanAutomaticQueryCorrectionLabel
+        );
+      expect(didYouMeanAutomaticQueryCorrectionLabel).toBeNull();
+
+      const queryTriggerShowingResultsForLabel =
+        element.shadowRoot.querySelector(
+          selectors.queryTriggerShowingResultsForLabel
+        );
+      expect(queryTriggerShowingResultsForLabel).toBeNull();
+      const queryTriggerUndoButton = element.shadowRoot.querySelector(
+        selectors.queryTriggerUndoButton
+      );
+      expect(queryTriggerUndoButton).toBeNull();
+    });
+  });
+});

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

@@ -0,0 +1,48 @@
+import {
+  DidYouMeanLegacyData,
+  DidYouMeanNextData,
+  QueryTriggerData,
+} from '../../../../../../playwright/page-object/searchObjectWithDidYouMean';
+
+const exampleOriginalQuery = 'original query';
+const exampleCorrectedQuery = 'corrected query';
+const exampleQueryTriggered = 'query triggered';
+
+const exampleDidYouMeanData: DidYouMeanLegacyData = {
+  correctedQuery: exampleCorrectedQuery,
+  wordCorrections: [
+    {
+      correctedWord: exampleCorrectedQuery,
+      originalWord: exampleOriginalQuery,
+      length: exampleCorrectedQuery.length,
+      offset: 0,
+    },
+  ],
+};
+
+const exampleDidYouMeanNextData: DidYouMeanNextData = {
+  correctedQuery: exampleCorrectedQuery,
+  wordCorrections: [
+    {
+      correctedWord: exampleCorrectedQuery,
+      originalWord: exampleOriginalQuery,
+      length: exampleCorrectedQuery.length,
+      offset: 0,
+    },
+  ],
+  originalQuery: exampleOriginalQuery,
+};
+
+const exampleQueryTriggerData: QueryTriggerData = {
+  type: 'query',
+  content: exampleQueryTriggered,
+};
+
+export default {
+  originalQuery: exampleOriginalQuery,
+  correctedQuery: exampleCorrectedQuery,
+  triggeredQuery: exampleQueryTriggered,
+  didYouMeanData: exampleDidYouMeanData,
+  didYouMeanNextData: exampleDidYouMeanNextData,
+  queryTriggerData: exampleQueryTriggerData,
+};