@coveo/quantic 3.33.0 → 3.33.2

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

@@ -0,0 +1,298 @@
+import QuanticFeedbackModalQna from 'c/quanticFeedbackModalQna';
+import {createElement} from 'lwc';
+
+jest.mock('@salesforce/label/c.quantic_Yes', () => ({default: 'Yes'}), {
+  virtual: true,
+});
+jest.mock('@salesforce/label/c.quantic_No', () => ({default: 'No'}), {
+  virtual: true,
+});
+jest.mock(
+  '@salesforce/label/c.quantic_FeedbackNotSure',
+  () => ({default: 'Not sure'}),
+  {
+    virtual: true,
+  }
+);
+
+const functionsMocks = {
+  handleSubmit: jest.fn(),
+};
+
+const selectors = {
+  answerEvaluationQuestions: 'lightning-radio-group',
+  questionTopicRadio: 'lightning-radio-group[data-name="correctTopic"]',
+  questionHallucinationRadio:
+    'lightning-radio-group[data-name="hallucinationFree"]',
+  questionDocumentedRadio: 'lightning-radio-group[data-name="documented"]',
+  questionReadableRadio: 'lightning-radio-group[data-name="readable"]',
+  documentUrlInput: 'lightning-input[data-name="documentUrl"]',
+  additionalDetailsTextarea: 'lightning-textarea[data-name="details"]',
+  skipButton: 'lightning-button.skip',
+  submitButton: 'lightning-button.submit-feedback',
+  successMessage: '.feedback-modal-body__success-message',
+};
+
+const defaultOptions = {
+  liked: false,
+  handleSubmit: functionsMocks.handleSubmit,
+};
+
+function createTestComponent(options = defaultOptions) {
+  const element = createElement('c-quantic-feedback-modal-qna', {
+    is: QuanticFeedbackModalQna,
+  });
+
+  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 lightningElementValueChange(element, selector, value) {
+  const lightningElement = element.shadowRoot.querySelector(selector);
+  // All base components in Jest tests are stubs. So we have to set the value manually.
+  // Including to the checkValidity method.
+  lightningElement.value = value;
+  lightningElement.validity = true;
+  lightningElement.checkValidity = () => true;
+  const event = new CustomEvent('change');
+  expect(lightningElement).not.toBeNull();
+  lightningElement.dispatchEvent(event);
+}
+
+describe('c-quantic-feedback-modal-qna', () => {
+  afterEach(() => {
+    // 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();
+  });
+
+  it('should properly render', async () => {
+    const element = createTestComponent();
+    await flushPromises();
+
+    const answerEvaluationQuestions = element.shadowRoot.querySelectorAll(
+      selectors.answerEvaluationQuestions
+    );
+    expect(answerEvaluationQuestions.length).toBe(4);
+
+    const questionTopicRadio = element.shadowRoot.querySelector(
+      selectors.questionTopicRadio
+    );
+    expect(questionTopicRadio).not.toBeNull();
+
+    const questionHallucinationRadio = element.shadowRoot.querySelector(
+      selectors.questionHallucinationRadio
+    );
+    expect(questionHallucinationRadio).not.toBeNull();
+
+    const questionDocumentedRadio = element.shadowRoot.querySelector(
+      selectors.questionDocumentedRadio
+    );
+    expect(questionDocumentedRadio).not.toBeNull();
+
+    const questionReadableRadio = element.shadowRoot.querySelector(
+      selectors.questionReadableRadio
+    );
+    expect(questionReadableRadio).not.toBeNull();
+
+    const documentUrlInput = element.shadowRoot.querySelector(
+      selectors.documentUrlInput
+    );
+    expect(documentUrlInput).not.toBeNull();
+
+    const additionalDetailsInput = element.shadowRoot.querySelector(
+      selectors.additionalDetailsTextarea
+    );
+    expect(additionalDetailsInput).not.toBeNull();
+
+    const skipButton = element.shadowRoot.querySelector(selectors.skipButton);
+    expect(skipButton).not.toBeNull();
+
+    const submitButton = element.shadowRoot.querySelector(
+      selectors.submitButton
+    );
+    expect(submitButton).not.toBeNull();
+  });
+
+  describe('when submitting the feedback', () => {
+    describe('with missing required answers', () => {
+      it('should not submit the feedback and not show the success screen', async () => {
+        const element = createTestComponent();
+        await flushPromises();
+
+        // Mock the checkValidity method to return false since the questions are not answered.
+        const checkValidityMock = jest.fn(() => false);
+        const answerEvaluationQuestions = element.shadowRoot.querySelectorAll(
+          selectors.answerEvaluationQuestions
+        );
+        answerEvaluationQuestions.forEach((question) => {
+          question.checkValidity = checkValidityMock;
+        });
+
+        const submitButton = element.shadowRoot.querySelector(
+          selectors.submitButton
+        );
+        submitButton.click();
+        await flushPromises();
+
+        const successMesage = element.shadowRoot.querySelector(
+          selectors.successMessage
+        );
+        expect(successMesage).toBeNull();
+        expect(checkValidityMock).toHaveBeenCalledTimes(4);
+      });
+    });
+
+    describe('with all the required questions answered', () => {
+      it('should display the success message and execute the handleSubmit function', async () => {
+        const element = createTestComponent();
+        await flushPromises();
+
+        lightningElementValueChange(
+          element,
+          selectors.questionTopicRadio,
+          'yes'
+        );
+        lightningElementValueChange(
+          element,
+          selectors.questionDocumentedRadio,
+          'yes'
+        );
+        lightningElementValueChange(
+          element,
+          selectors.questionHallucinationRadio,
+          'yes'
+        );
+        lightningElementValueChange(
+          element,
+          selectors.questionReadableRadio,
+          'yes'
+        );
+
+        const submitButton = element.shadowRoot.querySelector(
+          selectors.submitButton
+        );
+        submitButton.click();
+        await flushPromises();
+
+        const successMesage = element.shadowRoot.querySelector(
+          selectors.successMessage
+        );
+        expect(successMesage).not.toBeNull();
+
+        expect(functionsMocks.handleSubmit).toHaveBeenCalledWith(
+          expect.objectContaining({
+            correctTopic: 'yes',
+            hallucinationFree: 'yes',
+            documented: 'yes',
+            readable: 'yes',
+          })
+        );
+      });
+
+      it('should also send the additional details and document url if filled', async () => {
+        const testUrl = 'https://www.example.com';
+        const testDetails = 'Some additional details';
+        const expectedDocumentUrl = testUrl;
+        const expectedDetails = testDetails;
+        const element = createTestComponent();
+        await flushPromises();
+
+        lightningElementValueChange(
+          element,
+          selectors.questionTopicRadio,
+          'yes'
+        );
+        lightningElementValueChange(
+          element,
+          selectors.questionDocumentedRadio,
+          'yes'
+        );
+        lightningElementValueChange(
+          element,
+          selectors.questionHallucinationRadio,
+          'yes'
+        );
+        lightningElementValueChange(
+          element,
+          selectors.questionReadableRadio,
+          'yes'
+        );
+
+        lightningElementValueChange(
+          element,
+          selectors.documentUrlInput,
+          testUrl
+        );
+        lightningElementValueChange(
+          element,
+          selectors.additionalDetailsTextarea,
+          testDetails
+        );
+
+        const submitButton = element.shadowRoot.querySelector(
+          selectors.submitButton
+        );
+        submitButton.click();
+        await flushPromises();
+
+        const successMesage = element.shadowRoot.querySelector(
+          selectors.successMessage
+        );
+        expect(successMesage).not.toBeNull();
+
+        expect(functionsMocks.handleSubmit).toHaveBeenCalledWith(
+          expect.objectContaining({
+            documentUrl: expectedDocumentUrl,
+            details: expectedDetails,
+          })
+        );
+      });
+    });
+  });
+
+  describe('when clicking the skip button', () => {
+    it('should not submit the feedback and not execute the handleSubmit function', async () => {
+      const element = createTestComponent();
+      await flushPromises();
+
+      lightningElementValueChange(element, selectors.questionTopicRadio, 'yes');
+      lightningElementValueChange(
+        element,
+        selectors.questionDocumentedRadio,
+        'yes'
+      );
+      lightningElementValueChange(
+        element,
+        selectors.questionHallucinationRadio,
+        'yes'
+      );
+      lightningElementValueChange(
+        element,
+        selectors.questionReadableRadio,
+        'yes'
+      );
+
+      const skipButton = element.shadowRoot.querySelector(selectors.skipButton);
+      skipButton.click();
+      await flushPromises();
+
+      const successMesage = element.shadowRoot.querySelector(
+        selectors.successMessage
+      );
+      expect(successMesage).toBeNull();
+      expect(functionsMocks.handleSubmit).not.toHaveBeenCalled();
+    });
+  });
+});

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

@@ -0,0 +1,323 @@
+/* eslint-disable no-import-assign */
+import QuanticFoldedResultList from 'c/quanticFoldedResultList';
+import * as mockHeadlessLoader from 'c/quanticHeadlessLoader';
+import {cleanup, buildCreateTestComponent, flushPromises} from 'c/testUtils';
+
+const labels = {
+  loadingResults: 'Loading results...',
+};
+
+jest.mock(
+  '@salesforce/label/c.quantic_LoadingResults',
+  () => ({default: labels.loadingResults}),
+  {virtual: true}
+);
+
+jest.mock('c/quanticHeadlessLoader');
+jest.mock('c/quanticUtils', () => ({
+  AriaLiveRegion: jest.fn(() => ({
+    dispatchMessage: jest.fn(),
+  })),
+  I18nUtils: {
+    format: jest.fn(),
+  },
+}));
+
+const mockSearchResponseId = 'mockSearchResponseId';
+const fakeCollections = [
+  {
+    result: {
+      uniqueId: 'foo',
+      title: 'Foo',
+      excerpt: 'Foo',
+      raw: {
+        foo: 'foo',
+      },
+    },
+    children: [
+      {
+        result: {
+          uniqueId: 'Baz',
+          title: 'Baz',
+          excerpt: 'Baz',
+          raw: {
+            foo: 'baz',
+          },
+        },
+        children: [],
+      },
+    ],
+  },
+  {
+    result: {
+      uniqueId: 'Bar',
+      title: 'Bar',
+      excerpt: 'Bar',
+      raw: {
+        foo: 'bar',
+      },
+    },
+    children: [],
+  },
+];
+
+let isInitialized = false;
+
+const defaultOptions = {
+  engineId: 'testEngine',
+  collectionField: 'foldingcollection',
+  parentField: 'foldingparent',
+  childField: 'foldingchild',
+  numberOfFoldedResults: 2,
+};
+
+const initialFoldedResultListState = {};
+let foldedResultsListState = initialFoldedResultListState;
+const initialResultsPerPageState = {
+  numberOfResults: 10,
+};
+let resultsPerPageState = initialResultsPerPageState;
+
+const functionsMocks = {
+  buildFoldedResultList: jest.fn(() => ({
+    subscribe: functionsMocks.subscribeFoldedResultList,
+    state: foldedResultsListState,
+  })),
+  subscribeFoldedResultList: jest.fn((cb) => {
+    cb();
+    return functionsMocks.unsubscribeFoldedResultList;
+  }),
+  unsubscribeFoldedResultList: jest.fn(),
+  buildResultsPerPage: jest.fn(() => ({
+    subscribe: functionsMocks.subscribeResultsPerPage,
+    state: resultsPerPageState,
+  })),
+  subscribeResultsPerPage: jest.fn((cb) => {
+    cb();
+    return functionsMocks.unsubscribeResultsPerPage;
+  }),
+  unsubscribeResultsPerPage: jest.fn(),
+  buildResultTemplatesManager: jest.fn(),
+};
+
+const selectors = {
+  placeholder: 'c-quantic-placeholder',
+  result: 'c-quantic-result',
+  error: 'c-quantic-component-error',
+};
+
+const exampleEngine = {
+  id: defaultOptions.engineId,
+};
+
+const createTestComponent = buildCreateTestComponent(
+  QuanticFoldedResultList,
+  'c-quantic-folded-result-list',
+  defaultOptions
+);
+
+function prepareHeadlessState() {
+  // @ts-ignore
+  mockHeadlessLoader.getHeadlessBundle = () => {
+    return {
+      buildFoldedResultList: functionsMocks.buildFoldedResultList,
+      buildResultsPerPage: functionsMocks.buildResultsPerPage,
+      buildResultTemplatesManager: functionsMocks.buildResultTemplatesManager,
+    };
+  };
+}
+
+function mockSuccessfulHeadlessInitialization() {
+  // @ts-ignore
+  mockHeadlessLoader.initializeWithHeadless = (element, _, initialize) => {
+    if (element instanceof QuanticFoldedResultList && !isInitialized) {
+      isInitialized = true;
+      initialize({
+        id: defaultOptions.engineId,
+      });
+    }
+  };
+}
+
+function mockErroneousHeadlessInitialization() {
+  // @ts-ignore
+  mockHeadlessLoader.initializeWithHeadless = (element) => {
+    if (element instanceof QuanticFoldedResultList) {
+      element.setInitializationError();
+    }
+  };
+}
+
+describe('c-quantic-folded-result-list', () => {
+  beforeEach(() => {
+    mockSuccessfulHeadlessInitialization();
+    prepareHeadlessState();
+  });
+  afterEach(() => {
+    cleanup();
+    foldedResultsListState = initialFoldedResultListState;
+    resultsPerPageState = initialResultsPerPageState;
+    isInitialized = false;
+    jest.clearAllMocks();
+  });
+
+  describe('when the component is loading', () => {
+    beforeEach(() => {
+      foldedResultsListState = {
+        isLoading: true,
+        hasError: false,
+        firstSearchExecuted: false,
+        hasResults: false,
+      };
+    });
+
+    it('should render placeholders', async () => {
+      const element = createTestComponent();
+      await flushPromises();
+
+      const placeholder = element.shadowRoot.querySelector(
+        selectors.placeholder
+      );
+      expect(placeholder).not.toBeNull();
+    });
+  });
+
+  describe('component initialization', () => {
+    describe('when an initialization error occurs', () => {
+      beforeEach(() => {
+        mockErroneousHeadlessInitialization();
+      });
+
+      it('should display the initialization error component', async () => {
+        const element = createTestComponent();
+        await flushPromises();
+        const errorComponent = element.shadowRoot.querySelector(
+          selectors.error
+        );
+        expect(errorComponent).not.toBeNull();
+      });
+    });
+
+    describe('successful initialization', () => {
+      it('should build the folded result list, the results per page and the template manager controllers, and subscribe to state changes', async () => {
+        createTestComponent();
+        await flushPromises();
+
+        expect(functionsMocks.buildFoldedResultList).toHaveBeenCalledTimes(1);
+        expect(functionsMocks.buildFoldedResultList).toHaveBeenCalledWith(
+          exampleEngine,
+          {
+            options: {
+              fieldsToInclude:
+                'date,author,source,language,filetype,documenttype,parents,sfknowledgearticleid,sfid,sfkbid,sfkavid,sfparentid'.split(
+                  ','
+                ),
+              folding: {
+                numberOfFoldedResults: 2,
+                childField: 'foldingchild',
+                parentField: 'foldingparent',
+                collectionField: 'foldingcollection',
+              },
+            },
+          }
+        );
+        expect(functionsMocks.subscribeFoldedResultList).toHaveBeenCalledTimes(
+          1
+        );
+        expect(functionsMocks.buildResultsPerPage).toHaveBeenCalledTimes(1);
+        expect(functionsMocks.buildResultsPerPage).toHaveBeenCalledWith(
+          exampleEngine
+        );
+        expect(functionsMocks.subscribeResultsPerPage).toHaveBeenCalledTimes(1);
+        expect(
+          functionsMocks.buildResultTemplatesManager
+        ).toHaveBeenCalledTimes(1);
+        expect(functionsMocks.buildResultTemplatesManager).toHaveBeenCalledWith(
+          exampleEngine
+        );
+      });
+
+      it('should emit the #quantic__registerresulttemplates custom event', async () => {
+        const jestHandler = jest.fn();
+        document.addEventListener(
+          'quantic__registerresulttemplates',
+          jestHandler
+        );
+        createTestComponent();
+        await flushPromises();
+
+        expect(jestHandler).toHaveBeenCalledTimes(1);
+      });
+    });
+
+    describe('with custom options', () => {
+      it('should initialize the folded result list with custom options', async () => {
+        const customOptions = {
+          collectionField: 'customCollectionField',
+          parentField: 'customParentField',
+          childField: 'customChildField',
+          numberOfFoldedResults: 5,
+        };
+        createTestComponent(customOptions);
+        await flushPromises();
+
+        expect(functionsMocks.buildFoldedResultList).toHaveBeenCalledWith(
+          exampleEngine,
+          expect.objectContaining({
+            options: expect.objectContaining({
+              folding: expect.objectContaining({
+                numberOfFoldedResults: customOptions.numberOfFoldedResults,
+                childField: customOptions.childField,
+                parentField: customOptions.parentField,
+                collectionField: customOptions.collectionField,
+              }),
+            }),
+          })
+        );
+      });
+    });
+  });
+
+  describe('results rendering', () => {
+    beforeEach(() => {
+      foldedResultsListState = {
+        isLoading: false,
+        hasError: false,
+        firstSearchExecuted: true,
+        hasResults: true,
+        results: fakeCollections,
+        searchResponseId: mockSearchResponseId,
+      };
+    });
+    it('should not render placeholders when state has results', async () => {
+      const element = createTestComponent();
+      await flushPromises();
+
+      const placeholder = element.shadowRoot.querySelector(
+        selectors.placeholder
+      );
+      expect(placeholder).toBeNull();
+    });
+
+    it('should render results when state has results', async () => {
+      const element = createTestComponent();
+      await flushPromises();
+
+      const results = element.shadowRoot.querySelectorAll(selectors.result);
+      expect(results.length).toBe(fakeCollections.length);
+      results.forEach((resultElement, index) => {
+        const collection = fakeCollections[index];
+        expect(resultElement.engineId).toBe(exampleEngine.id);
+        expect(resultElement.collection).toEqual({
+          ...collection,
+          keyResultList: `${mockSearchResponseId}_${collection.result.uniqueId}`,
+        });
+        expect(resultElement.result).toEqual(collection.result);
+        expect(resultElement.resultTemplateManager).toEqual(
+          functionsMocks.buildResultTemplatesManager()
+        );
+      });
+      expect(results[0].getAttribute('result')).toBeDefined();
+    });
+  });
+});

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

@@ -0,0 +1,70 @@
+import {FoldedResultListObject} from './pageObject';
+import {quanticBase} from '../../../../../../playwright/fixtures/baseFixture';
+import {
+  insightSearchRequestRegex,
+  searchRequestRegex,
+} from '../../../../../../playwright/utils/requests';
+import {InsightSetupObject} from '../../../../../../playwright/page-object/insightSetupObject';
+import {useCaseEnum} from '../../../../../../playwright/utils/useCase';
+import {SearchObject} from '../../../../../../playwright/page-object/searchObject';
+
+const pageUrl = 's/quantic-folded-result-list';
+
+interface FoldedResultListOptions {
+  fieldsToInclude: string;
+  collectionField: string;
+  parentField: string;
+  childField: string;
+  numberOfFoldedResults: number;
+}
+
+type QuanticFoldedResultListE2ESearchFixtures = {
+  resultList: FoldedResultListObject;
+  search: SearchObject;
+  options: Partial<FoldedResultListOptions>;
+};
+
+type QuanticFoldedResultListE2EInsightFixtures =
+  QuanticFoldedResultListE2ESearchFixtures & {
+    insightSetup: InsightSetupObject;
+  };
+
+export const testSearch =
+  quanticBase.extend<QuanticFoldedResultListE2ESearchFixtures>({
+    options: {},
+    search: async ({page}, use) => {
+      await use(new SearchObject(page, searchRequestRegex));
+    },
+    resultList: async ({page, options, configuration, search}, use) => {
+      await page.goto(pageUrl);
+      configuration.configure(options);
+      await search.waitForSearchResponse();
+      await search.waitForSearchResultsVisible();
+      await use(new FoldedResultListObject(page));
+    },
+  });
+
+export const testInsight =
+  quanticBase.extend<QuanticFoldedResultListE2EInsightFixtures>({
+    options: {},
+    search: async ({page}, use) => {
+      await use(new SearchObject(page, insightSearchRequestRegex));
+    },
+    insightSetup: async ({page}, use) => {
+      await use(new InsightSetupObject(page));
+    },
+    resultList: async (
+      {page, options, search, configuration, insightSetup},
+      use
+    ) => {
+      await page.goto(pageUrl);
+      configuration.configure({...options, useCase: useCaseEnum.insight});
+      await insightSetup.waitForInsightInterfaceInitialization();
+      await search.performSearch();
+      await search.waitForSearchResponse();
+      await search.waitForSearchResultsVisible();
+      await use(new FoldedResultListObject(page));
+    },
+  });
+
+export {expect} from '@playwright/test';