tests: ébauche des tests d'intégration via Playwright

tests/playwright/shop.spec.ts

@@ -0,0 +1,76 @@
+import { test, expect, Page, Locator, Response, APIRequestContext } from "@playwright/test";
+import { WCV3Products } from "../../web/app/themes/haiku-atelier-2024/src/scripts/lib/types/api/v3/products";
+
+test.describe.configure({ mode: "parallel", timeout: 60000 });
+
+test("can scroll to the end of the grid", async ({ page }): Promise<void> => {
+  await scrollToGridsEnd(page);
+});
+
+test("can access all Products' pages", async ({ page, request }): Promise<void> => {
+  await page.goto("https://haikuatelier.gcch.local/shop/");
+  const links = await getAllProductsLinks(page, request);
+
+  for (const link of links) {
+    // Vérifie que le lien de la page retourne OK.
+    const req = await request.get(link as string);
+    expect(req, "The Product's page is accessible").toBeOK();
+  }
+});
+
+const getAllProductsLinks = async (page: Page, request: APIRequestContext): Promise<Array<string>> => {
+  const nonce = await page.locator("data#nonce").textContent();
+  const authString = await page.locator("data#auth-string").textContent();
+
+  if (nonce === null || nonce === "") {
+    throw new Error("Le nonce ne peut être vide.");
+  }
+  if (authString === null || authString === "") {
+    throw new Error("L'en-tête auth-string ne peut être vide.");
+  }
+
+  const response = await request.get("/wp-json/wc/v3/products?page=1&per_page=100&status=publish", {
+    headers: { Nonce: nonce, Authorization: `Basic ${authString}` },
+  });
+  const json = await response.json() as WCV3Products;
+  const links = json.map(p => p.permalink);
+
+  return links;
+};
+
+const scrollToGridsEnd = async (page: Page): Promise<void> => {
+  await page.goto("https://haikuatelier.gcch.local/shop/");
+
+  let hasMoreProducts = true;
+  let currentPageNumber = "1";
+
+  const productsGrid: Locator = page.locator(".grille-produits");
+  await expect(productsGrid).toBeVisible();
+
+  const showMoreButton: Locator = page.getByRole("button", { name: "Show more" });
+  await expect(productsGrid).toBeVisible();
+
+  while (hasMoreProducts) {
+    expect(await (productsGrid.getAttribute("data-page"))).toBe(currentPageNumber);
+
+    const newProductsResponse: Promise<Response> = page.waitForResponse(
+      new RegExp(".*wp-json\/wc\/v3\/products.*"),
+    );
+    await showMoreButton.click();
+    await newProductsResponse;
+
+    const newPageNumber = String(Number(currentPageNumber) + 1);
+    // Créé un nouveau Locator que l'on attend pour s'assurer que l'attribut soit bien mis à jour.
+    const gridWithNewPageNumber = page.locator(`.grille-produits[data-page="${newPageNumber}"]`);
+    await gridWithNewPageNumber.waitFor();
+
+    // Redondance pour expliciter la raison de l'assertion.
+    expect(await (productsGrid.getAttribute("data-page"))).toBe(newPageNumber);
+    currentPageNumber = newPageNumber;
+
+    // La fin de la grille est atteint.
+    if (await showMoreButton.isHidden()) {
+      hasMoreProducts = false;
+    }
+  }
+};