@coveo/quantic 3.43.2 → 3.43.4

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

@@ -3,7 +3,7 @@ import {
   useCaseEnum,
   useCaseTestCases,
 } from '../../../../../../playwright/utils/useCase';
-import facetData from './data';
+import {expandedFacetData, initialFacetData, selectedFacetData} from './data';
 
 const fixtures = {
   search: testSearch,
@@ -14,22 +14,34 @@ useCaseTestCases.forEach((useCase) => {
   let test = fixtures[useCase.value];
   test.describe(`quantic category facet ${useCase.label}`, () => {
     test.describe('when selecting a facet value and clicking the all categories button', () => {
+      const selectedIndex = 0;
+      const {facetId, field, values} = initialFacetData;
+      const selectedValue = values[selectedIndex].value;
+
+      test.use({
+        facetResponses: {
+          responses: [
+            [initialFacetData],
+            [selectedFacetData],
+            [initialFacetData],
+          ],
+        },
+      });
+
       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].value,
+          facetValue: selectedValue,
         };
+
         const facetSelectUaRequest =
           baseFacet.waitForFacetSelectUaAnalytics(expectedFacetData);
         const firstSearchResponsePromise = baseFacet.waitForSearchResponse();
-
         await facet.clickOnFacetValue(selectedIndex);
 
         await facetSelectUaRequest;
@@ -43,11 +55,11 @@ useCaseTestCases.forEach((useCase) => {
           );
           const url = page.url();
           expect(decodeURIComponent(url)).toContain(
-            `cf-${field}=${values[selectedIndex].value}`
+            `cf-${field}=${selectedValue}`
           );
         }
 
-        const FacetClearAllUaRequest =
+        const facetClearAllUaRequest =
           baseFacet.waitForFacetClearAllUaAnalytics({
             facetId,
             facetField: field,
@@ -56,7 +68,7 @@ useCaseTestCases.forEach((useCase) => {
 
         await facet.allCategoriesButton.click();
 
-        await FacetClearAllUaRequest;
+        await facetClearAllUaRequest;
         const secondSearchResponse = await secondSearchResponsePromise;
         const {analytics: analyticsForFacetDeselect} =
           baseFacet.extractDataFromResponse(secondSearchResponse);
@@ -66,6 +78,9 @@ useCaseTestCases.forEach((useCase) => {
 
     test.describe('when expanding and collapsing facet values using Show More/Less buttons', () => {
       test.use({
+        facetResponses: {
+          responses: [[initialFacetData], [expandedFacetData]],
+        },
         options: {
           numberOfValues: 2,
         },
@@ -75,7 +90,7 @@ useCaseTestCases.forEach((useCase) => {
         baseFacet,
         facet,
       }) => {
-        const {facetId, field} = facetData;
+        const {facetId, field} = initialFacetData;
         const uaRequest = baseFacet.waitForShowMoreFacetResultsUaAnalytics({
           facetId,
           facetField: field,
@@ -116,9 +131,12 @@ useCaseTestCases.forEach((useCase) => {
       const facetValueIndex = 0;
 
       test.use({
+        facetResponses: {
+          responses: [[initialFacetData], [selectedFacetData]],
+        },
         options: {
           caption: exampleCaption,
-          value: facetData.values[facetValueIndex].value,
+          value: initialFacetData.values[facetValueIndex].value,
         },
       });
       test('should display the custom caption instead of the raw facet value', async ({
@@ -128,7 +146,7 @@ useCaseTestCases.forEach((useCase) => {
         expect(facet.facetValue.nth(facetValueIndex)).toHaveText(
           new RegExp(exampleCaption)
         );
-        const {facetId, field, values} = facetData;
+        const {facetId, field, values} = initialFacetData;
         const expectedFacetData = {
           facetId,
           facetField: field,
@@ -165,7 +183,7 @@ useCaseTestCases.forEach((useCase) => {
           baseFacet,
           facet,
         }) => {
-          const {field: expectedField} = facetData;
+          const {field: expectedField} = initialFacetData;
           const exampleQuery = 'test';
           const facetSearchResponsePromise =
             baseFacet.waitForFacetSearchResponse();
@@ -182,10 +200,12 @@ useCaseTestCases.forEach((useCase) => {
 
       test.describe('with a selected value in the URL', () => {
         const selectedIndex = 0;
-        const {field, values} = facetData;
+        const {field, values} = initialFacetData;
         test.use({
           urlHash: `cf-${field}=${values[selectedIndex].value}`,
-          facetResponseMock: undefined,
+          facetResponses: {
+            responses: [],
+          },
         });
 
         test('should select the correct facet value', async ({facet}) => {

package/force-app/main/default/lwc/quanticCategoryFacet/quanticCategoryFacet.css

@@ -1,6 +1,6 @@
 @import 'c/quanticFacetStyles';
 
 .facet__search-results_more-matches {
-   color:  #8E959D;
+   color: var(--slds-g-color-palette-neutral-60, #8E959D);
    font-size: var(--slds-g-font-scale-neg-1, 12px);
 }

package/force-app/main/default/lwc/quanticCitation/quanticCitation.css

@@ -1,29 +1,30 @@
 .citation:hover {
   cursor: pointer;
-  color: var(--lwc-brandAccessible, #0176d3);
+  color: var(--slds-g-color-accent-container-1, var(--lwc-brandAccessible, #0176d3));
 }
 
 .citation__link {
   max-width: 10.625rem;
-  height: 2rem;
+  height: var(--slds-g-sizing-9, 2rem);
+  border-radius: var(--slds-g-radius-border-2, 0.25rem);
 }
 
 .citation__link:hover {
-  background-color: var(--lwc-brandLight, #f4f6fe);
+  background-color: var(--slds-g-color-accent-light-1, var(--lwc-brandLight, #f4f6fe));
 }
 
 .citation__link:focus {
-  border: 1px solid var(--lwc-brandAccessible, #0070d2);
-  box-shadow: 0 0 3px 0 var(--lwc-brandAccessible, #0070d2);
+  border: var(--slds-g-sizing-border-1, 1px) solid var(--slds-g-color-accent-container-1, var(--lwc-brandAccessible, #0070d2));
+  box-shadow: 0 0 3px 0 var(--slds-g-color-accent-container-1, var(--lwc-brandAccessible, #0070d2));
 }
 
 .citation__link:hover .citation__title {
-  color: var(--lwc-brandAccessible, #0176d3);
+  color: var(--slds-g-color-accent-container-1, var(--lwc-brandAccessible, #0176d3));
 }
 
 .citation__title {
   font-weight: var(--lwc-fontWeightRegular, 400);
-  color: var(--lwc-colorTextPlaceholder, #747474);
+  color: var(--slds-g-color-on-surface-1, var(--lwc-colorTextPlaceholder, #747474));
   font-size: var(--slds-g-font-size-base, 13px);
 }
 
@@ -35,18 +36,18 @@
 }
 
 .citation__tooltip {
-  color: rgb(26, 27, 30);
+  color: var(--slds-g-color-on-surface-3, rgb(26, 27, 30));
   cursor: default;
 }
 
 .citation__link--active {
-  border-color: var(--lwc-brandAccessible, #0176d3);
+  border-color: var(--slds-g-color-accent-container-1, var(--lwc-brandAccessible, #0176d3));
 }
 
 .citation__title--active {
-  color: var(--lwc-brandAccessible, #0176d3);
+  color: var(--slds-g-color-accent-container-1, var(--lwc-brandAccessible, #0176d3));
 }
 
 .citation__icon--active {
-  --slds-c-icon-color-foreground-default: var(--lwc-brandAccessible, #0176d3);
+  --slds-c-icon-color-foreground-default: var(--slds-g-color-accent-container-1, var(--lwc-brandAccessible, #0176d3));
 }

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

@@ -1,6 +1,12 @@
-const facetData = {
-  facetId: 'Date',
-  field: 'Date',
+const facetId = 'Date';
+const field = 'Date';
+
+/**
+ * Facet response before any value is selected.
+ */
+export const initialFacetData = {
+  facetId,
+  field,
   moreValuesAvailable: true,
   values: [
     {
@@ -21,4 +27,18 @@ const facetData = {
   indexScore: 0.40500903971252294,
 };
 
-export default facetData;
+const [firstRange, secondRange] = initialFacetData.values;
+
+/**
+ * Facet response after the first value is selected.
+ */
+export const selectedFacetData = {
+  ...initialFacetData,
+  values: [
+    {
+      ...firstRange,
+      state: 'selected',
+    },
+    secondRange,
+  ],
+};

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

@@ -7,7 +7,7 @@ import {
 } from '../../../../../../playwright/utils/requests';
 import {BaseFacetObject} from '../../../../../../playwright/page-object/baseFacetObject';
 import {facetBase} from '../../../../../../playwright/fixtures/baseFacetFixture';
-import facetData from './data';
+import {initialFacetData} from './data';
 
 const pageUrl = 's/quantic-date-facet';
 
@@ -21,18 +21,20 @@ type QuanticFacetE2EFixtures = {
 
 export const testSearch = facetBase.extend<QuanticFacetE2EFixtures>({
   options: {},
-  facetResponseMock: [facetData],
+  facetResponses: {responses: [[initialFacetData]]},
   baseFacet: async ({page}, use) => {
     await use(new BaseFacetObject(page, searchRequestRegex));
   },
   facet: async (
-    {page, options, configuration, baseFacet, urlHash, facetResponseMock},
+    {page, options, configuration, baseFacet, urlHash, facetResponses},
     use
   ) => {
+    // search use case: interface auto-triggers a search on load, hence the mockSearchWithBaseResponse call below
+    await baseFacet.mockSearchWithBaseResponse();
     await page.goto(`${pageUrl}#${urlHash ? urlHash : ''}`);
-    if (facetResponseMock) {
-      await baseFacet.mockSearchWithFacetResponse(facetResponseMock);
-    }
+    await baseFacet.mockSearchWithFacetResponseSequence(
+      facetResponses?.responses
+    );
     configuration.configure(options);
     await baseFacet.waitForSearchResponse();
 
@@ -42,7 +44,7 @@ export const testSearch = facetBase.extend<QuanticFacetE2EFixtures>({
 
 export const testInsight = facetBase.extend<QuanticFacetE2EFixtures>({
   options: {},
-  facetResponseMock: [facetData],
+  facetResponses: {responses: [[initialFacetData]]},
   baseFacet: async ({page}, use) => {
     await use(new BaseFacetObject(page, insightSearchRequestRegex));
   },
@@ -50,17 +52,19 @@ export const testInsight = facetBase.extend<QuanticFacetE2EFixtures>({
     await use(new InsightSetupObject(page));
   },
   facet: async (
-    {page, options, baseFacet, configuration, insightSetup, facetResponseMock},
+    {page, options, baseFacet, configuration, insightSetup, facetResponses},
     use
   ) => {
     await page.goto(pageUrl);
-    if (facetResponseMock) {
-      await baseFacet.mockSearchWithFacetResponse(facetResponseMock);
-    }
+    await baseFacet.mockSearchWithFacetResponseSequence(
+      facetResponses?.responses
+    );
     configuration.configure({...options, useCase: useCaseEnum.insight});
     await insightSetup?.waitForInsightInterfaceInitialization();
-    await baseFacet.performSearch();
-    await baseFacet.waitForSearchResponse();
+    await Promise.all([
+      baseFacet.waitForSearchResponse(),
+      baseFacet.performSearch(),
+    ]);
     await use(new DateFacetObject(page));
   },
 });

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

@@ -3,7 +3,7 @@ import {
   useCaseEnum,
   useCaseTestCases,
 } from '../../../../../../playwright/utils/useCase';
-import facetData from './data';
+import {initialFacetData, selectedFacetData} from './data';
 const fixtures = {
   search: testSearch,
   insight: testInsight,
@@ -24,13 +24,23 @@ 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.use({
+        facetResponses: {
+          responses: [
+            [initialFacetData],
+            [selectedFacetData],
+            [initialFacetData],
+          ],
+        },
+      });
+
       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 {facetId, field, values} = initialFacetData;
         const expectedFacetData = {
           facetId,
           facetField: field,
@@ -81,12 +91,22 @@ useCaseTestCases.forEach((useCase) => {
     });
 
     test.describe('when selecting a facet value and clicking the clear filter button', () => {
+      test.use({
+        facetResponses: {
+          responses: [
+            [initialFacetData],
+            [selectedFacetData],
+            [initialFacetData],
+          ],
+        },
+      });
+
       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 {facetId, field, values} = initialFacetData;
         const expectedFacetData = {
           facetId,
           facetField: field,
@@ -131,7 +151,9 @@ useCaseTestCases.forEach((useCase) => {
 
         test.use({
           urlHash: `df-${exampleField}=${yesterdayDate.replaceAll('-', '/')}@00:00:00..${todayDate.replaceAll('-', '/')}@23:59:59`,
-          facetResponseMock: undefined,
+          facetResponses: {
+            responses: [],
+          },
         });
 
         test('should select the correct facet value', async ({facet}) => {

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

@@ -44,6 +44,7 @@ export const testSearch =
       );
     },
     didYouMean: async ({page, options, configuration, search}, use) => {
+      await search.mockSearchWithBaseResponse();
       await page.goto(pageUrl);
       configuration.configure(options);
       await search.waitForSearchResponse();
@@ -68,11 +69,14 @@ export const testInsight =
       {page, options, search, configuration, insightSetup},
       use
     ) => {
+      await search.mockSearchWithBaseResponse();
       await page.goto(pageUrl);
       configuration.configure({...options, useCase: useCaseEnum.insight});
       await insightSetup.waitForInsightInterfaceInitialization();
-      await search.performSearch();
-      await search.waitForSearchResponse();
+      await Promise.all([
+        search.waitForSearchResponse(),
+        search.performSearch(),
+      ]);
       await use(new DidYouMeanObject(page));
     },
   });

package/force-app/main/default/lwc/quanticDocumentSuggestion/quanticDocumentSuggestion.css

@@ -7,9 +7,9 @@
 }
 
 .card-border {
-  border: 1px solid #dddbda;
+  border: var(--slds-g-sizing-border-1, 1px) solid var(--slds-g-color-border-1, #dddbda);
 }
 
 .no-suggestion-message {
-  background-color: #f6f7f9;
+  background-color: var(--slds-g-color-surface-2, #f6f7f9);
 }

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

@@ -1,21 +1,62 @@
-const facetData = {
-  facetId: 'objecttype',
-  field: 'objecttype',
+const facetId = 'objecttype';
+const field = 'objecttype';
+const label = 'Object type';
+
+/**
+ * Facet response before any value is selected.
+ */
+export const initialFacetData = {
+  facetId,
+  field,
   moreValuesAvailable: true,
   values: [
     {
-      value: 'foo',
+      value: 'People',
       state: 'idle',
-      numberOfResults: 10,
+      numberOfResults: 126959,
     },
     {
-      value: 'bar',
+      value: 'Contact',
       state: 'idle',
-      numberOfResults: 20,
+      numberOfResults: 179426,
     },
   ],
   indexScore: 0.40500903971252294,
-  label: 'Object type',
+  label,
 };
 
-export default facetData;
+const [people, contact] = initialFacetData.values;
+
+/**
+ * Facet response after clicking "Show more".
+ */
+export const expandedFacetData = {
+  ...initialFacetData,
+  values: [
+    ...initialFacetData.values,
+    {
+      value: 'Variant',
+      state: 'idle',
+      numberOfResults: 30827,
+    },
+    {
+      value: 'Message',
+      state: 'idle',
+      numberOfResults: 26879,
+    },
+  ],
+};
+
+/**
+ * Facet response after the first value is selected.
+ */
+export const selectedFacetData = {
+  ...initialFacetData,
+  values: [
+    {
+      ...people,
+      state: 'selected',
+    },
+    contact,
+  ],
+};

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

@@ -6,7 +6,7 @@ import {
   insightSearchRequestRegex,
 } from '../../../../../../playwright/utils/requests';
 import {BaseFacetObject} from '../../../../../../playwright/page-object/baseFacetObject';
-import facetData from './data';
+import {initialFacetData} from './data';
 import {facetBase} from '../../../../../../playwright/fixtures/baseFacetFixture';
 
 const pageUrl = 's/quantic-facet';
@@ -14,6 +14,7 @@ const pageUrl = 's/quantic-facet';
 interface FacetOptions {
   value?: string;
   caption?: string;
+  numberOfValues?: number;
 }
 
 type QuanticFacetE2EFixtures = {
@@ -24,20 +25,22 @@ type QuanticFacetE2EFixtures = {
 
 export const testSearch = facetBase.extend<QuanticFacetE2EFixtures>({
   options: {},
-  facetResponseMock: [facetData],
+  facetResponses: {responses: [[initialFacetData]]},
   baseFacet: async ({page}, use) => {
     await use(new BaseFacetObject(page, searchRequestRegex));
   },
   facet: async (
-    {page, options, configuration, baseFacet, urlHash, facetResponseMock},
+    {page, options, configuration, baseFacet, urlHash, facetResponses},
     use
   ) => {
+    // search use case: interface auto-triggers a search on load, hence the mockSearchWithBaseResponse call below
+    await baseFacet.mockSearchWithBaseResponse();
     await page.goto(
       `${pageUrl}${options.caption ? '-with-captions' : ''}#${urlHash ? urlHash : ''}`
     );
-    if (facetResponseMock) {
-      await baseFacet.mockSearchWithFacetResponse(facetResponseMock);
-    }
+    await baseFacet.mockSearchWithFacetResponseSequence(
+      facetResponses?.responses
+    );
     configuration.configure(options);
     await baseFacet.waitForSearchResponse();
 
@@ -47,7 +50,7 @@ export const testSearch = facetBase.extend<QuanticFacetE2EFixtures>({
 
 export const testInsight = facetBase.extend<QuanticFacetE2EFixtures>({
   options: {},
-  facetResponseMock: [facetData],
+  facetResponses: {responses: [[initialFacetData]]},
   baseFacet: async ({page}, use) => {
     await use(new BaseFacetObject(page, insightSearchRequestRegex));
   },
@@ -55,17 +58,19 @@ export const testInsight = facetBase.extend<QuanticFacetE2EFixtures>({
     await use(new InsightSetupObject(page));
   },
   facet: async (
-    {page, options, baseFacet, configuration, insightSetup, facetResponseMock},
+    {page, options, baseFacet, configuration, insightSetup, facetResponses},
     use
   ) => {
     await page.goto(`${pageUrl}${options.caption ? '-with-captions' : ''}`);
-    if (facetResponseMock) {
-      await baseFacet.mockSearchWithFacetResponse(facetResponseMock);
-    }
+    await baseFacet.mockSearchWithFacetResponseSequence(
+      facetResponses?.responses
+    );
     configuration.configure({...options, useCase: useCaseEnum.insight});
     await insightSetup?.waitForInsightInterfaceInitialization();
-    await baseFacet.performSearch();
-    await baseFacet.waitForSearchResponse();
+    await Promise.all([
+      baseFacet.waitForSearchResponse(),
+      baseFacet.performSearch(),
+    ]);
     await use(new FacetObject(page));
   },
 });