@coveo/quantic 3.16.0 → 3.16.1-pre.9c01cf606f

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

@@ -1,63 +0,0 @@
-import {PagerObject} from './pageObject';
-import {quanticBase} from '../../../../../../playwright/fixtures/baseFixture';
-import {SearchObject} from '../../../../../../playwright/page-object/searchObject';
-import {
-  searchRequestRegex,
-  insightSearchRequestRegex,
-} from '../../../../../../playwright/utils/requests';
-import {InsightSetupObject} from '../../../../../../playwright/page-object/insightSetupObject';
-import {useCaseEnum} from '../../../../../../playwright/utils/useCase';
-
-const pageUrl = 's/quantic-pager';
-
-interface PagerOptions {
-  numberOfPages: number;
-}
-type QuanticPagerE2EFixtures = {
-  pager: PagerObject;
-  search: SearchObject;
-  options: Partial<PagerOptions>;
-};
-
-type QuanticPagerE2ESearchFixtures = QuanticPagerE2EFixtures & {
-  urlHash: string;
-};
-
-type QuanticPagerE2EInsightFixtures = QuanticPagerE2ESearchFixtures & {
-  insightSetup: InsightSetupObject;
-};
-
-export const testSearch = quanticBase.extend<QuanticPagerE2ESearchFixtures>({
-  options: {},
-  urlHash: '',
-  search: async ({page}, use) => {
-    await use(new SearchObject(page, searchRequestRegex));
-  },
-  pager: async ({page, options, configuration, search, urlHash}, use) => {
-    await page.goto(urlHash ? `${pageUrl}#${urlHash}` : pageUrl);
-    configuration.configure(options);
-    await search.waitForSearchResponse();
-
-    await use(new PagerObject(page));
-  },
-});
-
-export const testInsight = quanticBase.extend<QuanticPagerE2EInsightFixtures>({
-  options: {},
-  search: async ({page}, use) => {
-    await use(new SearchObject(page, insightSearchRequestRegex));
-  },
-  insightSetup: async ({page}, use) => {
-    await use(new InsightSetupObject(page));
-  },
-  pager: 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 use(new PagerObject(page));
-  },
-});
-
-export {expect} from '@playwright/test';

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

@@ -1,69 +0,0 @@
-import type {Locator, Page, Request} from '@playwright/test';
-import {isUaCustomEvent} from '../../../../../../playwright/utils/requests';
-
-export class PagerObject {
-  constructor(public page: Page) {
-    this.page = page;
-  }
-
-  get nextPageButton(): Locator {
-    return this.page.getByRole('button', {name: /Next Page/i});
-  }
-
-  get previousPageButton(): Locator {
-    return this.page.getByRole('button', {name: /Previous Page/i});
-  }
-
-  get pageButtons(): Locator {
-    return this.page.locator('c-quantic-number-button button');
-  }
-
-  pageButton(pageNumber: number): Locator {
-    return this.pageButtons.nth(pageNumber - 1);
-  }
-
-  async goToLastPage(): Promise<void> {
-    await this.pageButtons.nth(-1).click();
-  }
-
-  async clickNextPageButton(): Promise<void> {
-    await this.nextPageButton.click();
-  }
-
-  async clickPreviousPageButton(): Promise<void> {
-    await this.previousPageButton.click();
-  }
-
-  async clickPageNumberButton(pageNumber: number): Promise<void> {
-    await this.pageButtons.nth(pageNumber - 1).click();
-  }
-
-  async waitForPagerUaAnalytics(eventValue): Promise<Request> {
-    const uaRequest = this.page.waitForRequest((request) => {
-      if (isUaCustomEvent(request)) {
-        const requestBody = request.postDataJSON?.();
-        const expectedFields = {
-          eventType: 'getMoreResults',
-          eventValue: eventValue,
-        };
-        return Object.keys(expectedFields).every(
-          (key) => requestBody?.[key] === expectedFields[key]
-        );
-      }
-      return false;
-    });
-    return uaRequest;
-  }
-
-  async waitForPagerNextUaAnalytics(): Promise<Request> {
-    return this.waitForPagerUaAnalytics('pagerNext');
-  }
-
-  async waitForPagerPreviousUaAnalytics(): Promise<Request> {
-    return this.waitForPagerUaAnalytics('pagerPrevious');
-  }
-
-  async waitForPagerNumberUaAnalytics(): Promise<Request> {
-    return this.waitForPagerUaAnalytics('pagerNumber');
-  }
-}

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

@@ -1,101 +0,0 @@
-import {testSearch, testInsight, expect} from './fixture';
-import {useCaseTestCases} from '../../../../../../playwright/utils/useCase';
-
-const numberOfResultsPerPage = 10;
-
-const fixtures = {
-  search: testSearch,
-  insight: testInsight,
-};
-
-useCaseTestCases.forEach((useCase) => {
-  let test = fixtures[useCase.value];
-
-  test.describe(`quantic pager ${useCase.label}`, () => {
-    test.describe('when clicking the next page button', () => {
-      test('should trigger a new search and log analytics', async ({
-        pager,
-        search,
-      }) => {
-        const searchResponsePromise = search.waitForSearchResponse();
-        await pager.clickNextPageButton();
-        const searchResponse = await searchResponsePromise;
-        const {firstResult} = searchResponse.request().postDataJSON();
-        expect(firstResult).toBe(numberOfResultsPerPage);
-        await pager.waitForPagerNextUaAnalytics();
-      });
-    });
-
-    test.describe('when clicking the previous page button', () => {
-      test('should trigger a new search and log analytics', async ({
-        pager,
-        search,
-      }) => {
-        const initialSearchResponsePromise = search.waitForSearchResponse();
-        await pager.clickNextPageButton();
-        await initialSearchResponsePromise;
-
-        const searchResponsePromise = search.waitForSearchResponse();
-        await pager.clickPreviousPageButton();
-        const searchResponse = await searchResponsePromise;
-        const {firstResult} = searchResponse.request().postDataJSON();
-        expect(firstResult).toBe(0);
-        await pager.waitForPagerPreviousUaAnalytics();
-      });
-    });
-
-    test.describe('when clicking a specific page button', () => {
-      test('should trigger a new search and log analytics', async ({
-        pager,
-        search,
-      }) => {
-        const examplePage = 3;
-        const searchResponsePromise = search.waitForSearchResponse();
-        await pager.clickPageNumberButton(examplePage);
-        const searchResponse = await searchResponsePromise;
-        const {firstResult} = searchResponse.request().postDataJSON();
-        expect(firstResult).toBe(numberOfResultsPerPage * (examplePage - 1));
-        await pager.waitForPagerNumberUaAnalytics();
-      });
-    });
-
-    test.describe('when a new search is made', () => {
-      test('should select the first page', async ({pager, search}) => {
-        const initialSearchResponsePromise = search.waitForSearchResponse();
-        await pager.clickNextPageButton();
-        await initialSearchResponsePromise;
-
-        await expect(pager.previousPageButton).not.toBeDisabled();
-        const searchResponsePromise = search.waitForSearchResponse();
-        await search.performSearch();
-        const searchResponse = await searchResponsePromise;
-        const {firstResult} = searchResponse.request().postDataJSON();
-
-        const expectedPage = 0;
-        await expect(pager.pageButtons.nth(expectedPage)).toHaveAttribute(
-          'aria-pressed',
-          'true'
-        );
-        expect(firstResult).toBe(expectedPage);
-      });
-    });
-
-    if (useCase.value === 'search') {
-      test.describe('when loading options from the url', () => {
-        test.use({
-          urlHash: 'firstResult=10',
-        });
-
-        test('should reflect the options of url in the component', async ({
-          pager,
-        }) => {
-          const expectedPage = 2;
-          await expect(pager.pageButton(expectedPage)).toHaveAttribute(
-            'aria-pressed',
-            'true'
-          );
-        });
-      });
-    }
-  });
-});

package/force-app/main/default/lwc/quanticQuickviewContent/__tests__/data/defaultTestCase.json

@@ -1,13 +0,0 @@
-{
-  "nameOfTemplate": "quanticQuickviewDefault",
-  "contentType": "other than youtube",
-  "options": {
-    "result": {
-      "uniqueId": "42.38148$https://community.fitbit.com/board:charge/thread:5332832/message:5333023"
-    },
-    "contentUrl": "https://longdogechallenge.com/"
-  },
-  "selectors": {
-    "templateSelector": ".iframe-wrapper__default"
-  }
-}

package/force-app/main/default/lwc/quanticQuickviewContent/__tests__/data/youtubeTestCase.json

@@ -1,14 +0,0 @@
-{
-  "nameOfTemplate": "quanticQuickviewYoutube",
-  "contentType": "youtube video",
-  "options": {
-    "result": {
-      "uniqueId": "42.54689$https://youtube.com/Channel:UCLD76EfBpKKuBH52RMIdrJw/Video:lZHu8AM5bjY"
-    },
-    "contentUrl": "https://longdogechallenge.com/"
-  },
-  "selectors": {
-    "templateSelector": ".iframe-wrapper__youtube",
-    "iframeSelector": ".quickview__content-iframe"
-  }
-}

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

@@ -1,82 +0,0 @@
-// @ts-ignore
-import {createElement} from 'lwc';
-import QuanticQuickviewContent from '../quanticQuickviewContent';
-// @ts-ignore
-import defaultTestCase from './data/defaultTestCase.json';
-// @ts-ignore
-import youtubeTestCase from './data/youtubeTestCase.json';
-
-const functionsMocks = {
-  listener: jest.fn(() => {}),
-};
-
-function setupSimulation(element, eventName) {
-  const handler = () => {
-    functionsMocks.listener();
-    element.removeEventListener(eventName, handler);
-  };
-  element.addEventListener(eventName, handler);
-}
-
-function createTestComponent(options) {
-  const element = createElement('c-quantic-quickview-content', {
-    is: QuanticQuickviewContent,
-  });
-
-  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));
-}
-
-describe('c-quantic-quickview-content', () => {
-  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);
-    }
-  }
-
-  afterEach(() => {
-    cleanup();
-    jest.clearAllMocks();
-  });
-
-  [youtubeTestCase, defaultTestCase].forEach((testCase) => {
-    it(`should display the ${testCase.nameOfTemplate} template when the content is of type ${testCase.contentType}`, async () => {
-      const element = createTestComponent(testCase.options);
-      await flushPromises();
-
-      document.body.appendChild(element);
-
-      const actualTemplate = element.shadowRoot.querySelector(
-        testCase.selectors.templateSelector
-      );
-
-      expect(actualTemplate).not.toBeNull();
-    });
-  });
-
-  describe('when the iframe is loaded', () => {
-    it('should dispatch the loadingstatechange event properly', async () => {
-      const element = createTestComponent(youtubeTestCase.options);
-      await flushPromises();
-
-      setupSimulation(element, 'quantic__loadingstatechange');
-
-      const iframe = element.shadowRoot.querySelector(
-        youtubeTestCase.selectors.iframeSelector
-      );
-      iframe.dispatchEvent(new CustomEvent('load'));
-
-      expect(iframe).not.toBeNull();
-      expect(functionsMocks.listener).toHaveBeenCalledTimes(1);
-    });
-  });
-});

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

@@ -1,273 +0,0 @@
-import QuanticRadioButtonsGroup from 'c/quanticRadioButtonsGroup';
-// @ts-ignore
-import {createElement} from 'lwc';
-
-const selectors = {
-  legend: 'legend.radio-buttons-group__legend',
-  radioInputs: 'input[type="radio"]',
-  radioLabels: 'label.radio-buttons-group__label',
-  radioIcons: 'lightning-icon',
-  radioContainers: '.slds-button.slds-radio_button.radio-button',
-  radioTooltips: 'c-quantic-tooltip',
-};
-
-/**
- * @type {import('c/quanticRadioButtonsGroup').QuanticRadioButtonsGroupOption[]}
- */
-const defaultOptionsList = [
-  {
-    value: 'value_option1',
-    tooltip: 'tooltip_option1',
-    label: 'label_option1',
-  },
-  {
-    value: 'value_option2',
-    tooltip: 'tooltip_option2',
-    label: 'label_option2',
-  },
-  {
-    value: 'value_option3',
-    tooltip: 'tooltip_option3',
-    label: 'label_option3',
-  },
-];
-
-const exampleOptions = {
-  legend: 'example-legend',
-  options: defaultOptionsList,
-};
-
-function createTestComponent(options = exampleOptions) {
-  const element = createElement('c-quantic-radio-buttons-group', {
-    is: QuanticRadioButtonsGroup,
-  });
-
-  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() {
-  // eslint-disable-next-line @lwc/lwc/no-async-operation
-  return new Promise((resolve) => setTimeout(resolve, 0));
-}
-
-describe('c-quantic-radio-buttons-group', () => {
-  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();
-  }
-
-  afterEach(() => {
-    cleanup();
-  });
-
-  describe('default rendering options', () => {
-    it('should render correctly with default options, without labels, without icons, without tooltips', async () => {
-      const minimalOptions = [
-        {value: 'value_option1'},
-        {value: 'value_option2'},
-        {value: 'value_option3'},
-      ];
-      const element = createTestComponent({
-        ...exampleOptions,
-        options: minimalOptions,
-      });
-      await flushPromises();
-
-      const legendElement = element.shadowRoot.querySelector(selectors.legend);
-      const radioInputs = element.shadowRoot.querySelectorAll(
-        selectors.radioInputs
-      );
-      const radioLabels = element.shadowRoot.querySelectorAll(
-        selectors.radioLabels
-      );
-      const icons = element.shadowRoot.querySelectorAll(selectors.radioIcons);
-
-      expect(legendElement).not.toBeNull();
-      expect(legendElement.textContent).toBe(exampleOptions.legend);
-      expect(radioInputs).toHaveLength(minimalOptions.length);
-      expect(radioLabels).toHaveLength(0);
-      expect(icons).toHaveLength(0);
-      minimalOptions.forEach((option, index) => {
-        expect(radioInputs[index].value).toBe(option.value);
-      });
-    });
-
-    it('should render correctly with default options, without icons', async () => {
-      const element = createTestComponent();
-      await flushPromises();
-
-      const legendElement = element.shadowRoot.querySelector(selectors.legend);
-      const radioInputs = element.shadowRoot.querySelectorAll(
-        selectors.radioInputs
-      );
-      const radioLabels = element.shadowRoot.querySelectorAll(
-        selectors.radioLabels
-      );
-      const icons = element.shadowRoot.querySelectorAll(selectors.radioIcons);
-      const tooltips = element.shadowRoot.querySelectorAll(
-        selectors.radioTooltips
-      );
-
-      expect(legendElement).not.toBeNull();
-      expect(legendElement.textContent).toBe(exampleOptions.legend);
-      expect(radioInputs).toHaveLength(defaultOptionsList.length);
-      expect(radioLabels).toHaveLength(defaultOptionsList.length);
-      expect(tooltips).toHaveLength(defaultOptionsList.length);
-      expect(icons).toHaveLength(0);
-      defaultOptionsList.forEach((option, index) => {
-        expect(radioInputs[index].value).toBe(option.value);
-        expect(radioLabels[index].textContent).toBe(option.label);
-        expect(tooltips[index].textContent).toBe(option.tooltip);
-      });
-    });
-
-    it('should render correctly with default options', async () => {
-      const optionsWithIcons = defaultOptionsList.map((option) => ({
-        ...option,
-        iconName: `utility:rows`,
-      }));
-      const element = createTestComponent({
-        ...exampleOptions,
-        options: optionsWithIcons,
-      });
-      await flushPromises();
-
-      const legendElement = element.shadowRoot.querySelector(selectors.legend);
-      const radioInputs = element.shadowRoot.querySelectorAll(
-        selectors.radioInputs
-      );
-      const radioLabels = element.shadowRoot.querySelectorAll(
-        selectors.radioLabels
-      );
-      const icons = element.shadowRoot.querySelectorAll(selectors.radioIcons);
-
-      expect(legendElement).not.toBeNull();
-      expect(legendElement.textContent).toBe(exampleOptions.legend);
-      expect(radioInputs).toHaveLength(defaultOptionsList.length);
-      expect(radioLabels).toHaveLength(defaultOptionsList.length);
-      expect(icons).toHaveLength(defaultOptionsList.length);
-      defaultOptionsList.forEach((_, index) => {
-        expect(icons[index].iconName).toBe('utility:rows');
-      });
-    });
-  });
-
-  describe('hideLabels property', () => {
-    const labelHiddenClass = 'slds-assistive-text';
-    it('should render correctly with hideLabels set to true', async () => {
-      const element = createTestComponent({
-        ...exampleOptions,
-        hideLabels: true,
-      });
-      await flushPromises();
-
-      const radioLabels = element.shadowRoot.querySelectorAll(
-        selectors.radioLabels
-      );
-
-      expect(radioLabels).toHaveLength(defaultOptionsList.length);
-      for (const radioLabel of radioLabels) {
-        expect(radioLabel.classList.contains(labelHiddenClass)).toBeTruthy();
-      }
-    });
-
-    it('should render correctly with hideLabels set to false', async () => {
-      const element = createTestComponent({
-        ...exampleOptions,
-        hideLabels: false,
-      });
-      await flushPromises();
-
-      const radioLabels = element.shadowRoot.querySelectorAll(
-        selectors.radioLabels
-      );
-
-      expect(radioLabels).toHaveLength(defaultOptionsList.length);
-      for (const radioLabel of radioLabels) {
-        expect(radioLabel.classList.contains(labelHiddenClass)).toBeFalsy();
-      }
-    });
-  });
-
-  describe('User interaction', () => {
-    it('should dispatch the "quantic__change" event when a radio button is clicked', async () => {
-      const element = createTestComponent();
-      await flushPromises();
-
-      const radioInputs = element.shadowRoot.querySelectorAll(
-        selectors.radioInputs
-      );
-      const radioInput = radioInputs[0];
-      const changeHandler = jest.fn();
-      element.addEventListener('quantic__change', changeHandler);
-
-      radioInput.click();
-
-      expect(changeHandler).toHaveBeenCalledTimes(1);
-      expect(changeHandler.mock.calls[0][0].detail).toEqual({
-        value: radioInput.value,
-      });
-    });
-
-    it('should update the selected radio button when a radio button is clicked', async () => {
-      const element = createTestComponent();
-      await flushPromises();
-
-      const radioInputs = element.shadowRoot.querySelectorAll(
-        selectors.radioInputs
-      );
-      const radioButtonContainers = element.shadowRoot.querySelectorAll(
-        selectors.radioContainers
-      );
-      const radioInput = radioInputs[0];
-      const radioContainer = radioButtonContainers[0];
-
-      radioInput.click();
-      await flushPromises();
-
-      expect(radioInput.checked).toBeTruthy();
-      expect(
-        radioContainer.classList.contains('radio-button--selected')
-      ).toBeTruthy();
-    });
-
-    it("shouldn't be possible to select multiple radio buttons", async () => {
-      const element = createTestComponent();
-      await flushPromises();
-
-      const radioInputs = element.shadowRoot.querySelectorAll(
-        selectors.radioInputs
-      );
-      const radioButtonContainers = element.shadowRoot.querySelectorAll(
-        selectors.radioContainers
-      );
-
-      radioInputs[0].click();
-      radioInputs[1].click();
-      await flushPromises();
-
-      const selectedRadioInputs = element.shadowRoot.querySelectorAll(
-        `.radio-button--selected`
-      );
-
-      expect(radioInputs[0].checked).toBeFalsy();
-      expect(radioInputs[1].checked).toBeTruthy();
-      expect(
-        radioButtonContainers[0].classList.contains('radio-button--selected')
-      ).toBeFalsy();
-      expect(
-        radioButtonContainers[1].classList.contains('radio-button--selected')
-      ).toBeTruthy();
-      expect(selectedRadioInputs).toHaveLength(1);
-    });
-  });
-});