feat: ajout de l'a/b testing via matomo (#6813)

* feat: ajout de l'a/b testing via matomo

* feat: modification du mot clé pour les recherches

Author: m-maillot

packages/code-du-travail-frontend/app/recherche/page.tsx

@@ -7,13 +7,13 @@ export const dynamic = "force-dynamic";
 export const revalidate = 0;
 
 type SearchPageProps = {
-  searchParams: { q?: string };
+  searchParams: { query?: string };
 };
 
 export async function generateMetadata({
   searchParams,
 }: SearchPageProps): Promise<Metadata> {
-  const query = searchParams.q || "";
+  const query = searchParams.query || "";
 
   return {
     title: query
@@ -26,7 +26,7 @@ export async function generateMetadata({
 }
 
 export default async function SearchPage({ searchParams }: SearchPageProps) {
-  const query = searchParams.q || "";
+  const query = searchParams.query || "";
 
   let items = { articles: [], documents: [], themes: [] };
 

packages/code-du-travail-frontend/cypress/integration/heavy/outils-externe.spec.ts

@@ -1,6 +1,6 @@
 describe("Outil externe", () => {
   it("l'outil egapro est référencé sur notre site", () => {
-    cy.visit("/recherche?q=egapro");
+    cy.visit("/recherche?query=egapro");
 
     cy.contains("Index Egapro")
       .should("have.prop", "href")

packages/code-du-travail-frontend/cypress/integration/light/contributions/search.spec.ts

@@ -4,15 +4,15 @@ describe("Contributions", () => {
     cy.findByRole("heading", { level: 1 })
       .should("have.text", "Bienvenue sur le Code du travail numérique")
       .click();
-    cy.selectByLabel("Recherchez par mots-clés").type("durée maximale CDD");
+    // TODO à remettre sur le label après l'A/B Testing
+    // cy.selectByLabel("Recherchez par mots-clés").type("durée maximale CDD");
+    cy.get('[data-testid="search-input"]').eq(1).type("durée maximale CDD");
     cy.get("button[aria-label='Lancer la recherche']")
       .contains("Rechercher")
       .click();
     cy.findAllByRole("heading", { level: 3 }).should("have.length", 18);
     cy.contains("Durée maximale d'un CDD").click();
 
-    cy.urlEqual(
-      "/contribution/quelle-peut-etre-la-duree-maximale-dun-cdd?q=dur%C3%A9e%20maximale%20CDD"
-    );
+    cy.urlEqual("/contribution/quelle-peut-etre-la-duree-maximale-dun-cdd");
   });
 });

packages/code-du-travail-frontend/cypress/integration/light/header-search.spec.ts

@@ -23,7 +23,7 @@ describe("Header Search", () => {
     cy.get("@searchInput").type("{enter}");
 
     // Vérifier que l'URL a été mise à jour correctement
-    cy.url().should("include", "/recherche?q=cong%C3%A9");
+    cy.url().should("include", "/recherche?query=cong%C3%A9");
 
     // Vérifier que la page de résultats de recherche est affichée
     cy.contains("h1", "Recherche").should("exist");
@@ -46,11 +46,13 @@ describe("Header Search", () => {
     cy.get(".fr-header__search button[type='submit']").dblclick();
 
     // Vérifier que l'URL a été mise à jour correctement
-    cy.url().should("include", "/recherche?q=cong%C3%A9");
+    cy.url().should("include", "/recherche?query=cong%C3%A9");
 
     // Vérifier que la page de résultats de recherche est affichée
     cy.contains("h1", "Recherche").should("exist");
   });
+  /*
+  // TODO Désactivé pour l'AB Testing, à remettre en place ensuite.
   it("should show 'retraite' in autocomplete suggestions when typing 'rét'", () => {
     // Ouvrir le modal de recherche dans l'en-tête
     cy.get(".fr-header__tools").click();
@@ -74,4 +76,5 @@ describe("Header Search", () => {
       .contains("retraite", { matchCase: false })
       .should("be.visible");
   });
+   */
 });

packages/code-du-travail-frontend/cypress/integration/light/home.spec.ts

@@ -19,7 +19,8 @@ describe("Page d’accueil", () => {
         "Obtenez les réponses à vos questions sur le droit du travail."
       );
 
-    cy.contains("Recherchez par mots-clés");
+    // TODO A remettre après l'A/B Testing
+    // cy.contains("Recherchez par mots-clés");
     cy.get("button[aria-label='Lancer la recherche']").contains("Rechercher");
 
     cy.findAllByRole("heading", {
@@ -67,6 +68,8 @@ describe("Page d’accueil", () => {
     cy.contains("Conflits au travail et contrôle de la réglementation");
   });
 
+  /*
+  // TODO Désactivé pour l'AB Testing, à remettre en place ensuite.
   it("Devrait afficher les suggestions quand on cherche un mot", () => {
     cy.visit("/");
     cy.findByRole("heading", { level: 1 })
@@ -95,4 +98,5 @@ describe("Page d’accueil", () => {
     cy.get("button").contains("Plus de résultats").click();
     cy.findAllByRole("heading", { level: 3 }).should("have.length", 26);
   });
+   */
 });

packages/code-du-travail-frontend/cypress/integration/light/modeles.spec.ts

@@ -28,7 +28,10 @@ describe("Modèles de documents", () => {
     cy.findByRole("heading", { level: 1 })
       .should("have.text", "Bienvenue sur le Code du travail numérique")
       .click();
-    cy.selectByLabel("Recherchez par mots-clés").as("home-searchbar");
+
+    // TODO à remettre en place après l'A/B Testing
+    // cy.selectByLabel("Recherchez par mots-clés")
+    cy.get('[data-testid="search-input"]').eq(1).as("home-searchbar");
 
     cy.get("@home-searchbar").type("modele rupture contrat periode d'essai");
 
@@ -40,13 +43,13 @@ describe("Modèles de documents", () => {
     );
 
     cy.urlEqual(
-      "/recherche?q=modele%20rupture%20contrat%20periode%20d%27essai"
+      "/recherche?query=modele%20rupture%20contrat%20periode%20d%27essai"
     );
 
     cy.contains("Rupture du contrat en période d’essai par le salarié").click();
 
     cy.urlEqual(
-      "/modeles-de-courriers/rupture-du-contrat-en-periode-dessai-par-le-salarie?q=modele%20rupture%20contrat%20periode%20d%27essai"
+      "/modeles-de-courriers/rupture-du-contrat-en-periode-dessai-par-le-salarie"
     );
   });
 

packages/code-du-travail-frontend/global.d.ts

@@ -22,6 +22,7 @@ interface Window {
         | string[]
         | number
         | string
+        | Record<string, unknown>
         | null
         | undefined
       )[][]
@@ -36,6 +37,7 @@ declare namespace NodeJS {
           | string[]
           | number
           | string
+          | Record<string, unknown>
           | null
           | undefined
         )[][]

packages/code-du-travail-frontend/src/modules/accessibilite/__tests__/__snapshots__/Accessibilite.test.tsx.snap

@@ -241,9 +241,9 @@ exports[`<Accessibilite /> should match snapshot 1`] = `
           Page recherche :
            
           <a
-            href="https://code.travail.gouv.fr/recherche?q=cong%C3%A9s+pay%C3%A9s"
+            href="https://code.travail.gouv.fr/recherche?query=cong%C3%A9s+pay%C3%A9s"
           >
-            https://code.travail.gouv.fr/recherche?q=cong%C3%A9s+pay%C3%A9s
+            https://code.travail.gouv.fr/recherche?query=cong%C3%A9s+pay%C3%A9s
           </a>
         </li>
         <li>

packages/code-du-travail-frontend/src/modules/accessibilite/index.tsx

@@ -181,8 +181,8 @@ export const Accessibilite = () => {
         </li>
         <li>
           Page recherche :{" "}
-          <Link href="https://code.travail.gouv.fr/recherche?q=cong%C3%A9s+pay%C3%A9s">
-            https://code.travail.gouv.fr/recherche?q=cong%C3%A9s+pay%C3%A9s
+          <Link href="https://code.travail.gouv.fr/recherche?query=cong%C3%A9s+pay%C3%A9s">
+            https://code.travail.gouv.fr/recherche?query=cong%C3%A9s+pay%C3%A9s
           </Link>
         </li>
         <li>