fix: login tests

packages/frontend/src/features/menu/MenuActions.tsx

@@ -20,7 +20,7 @@ export const MenuActions = ({ menu }: { menu: NestedMenu | null }) => {
     { text: "Clauses départementales", onClick: () => setMenu("clauses-departementales") },
     { text: "Clauses nationales", onClick: () => setMenu("clauses-nationales") },
     { text: "Assistance technique", onClick: () => setMenu("help") },
-    { text: "Se déconnecter", onClick: logout },
+    { text: "Se déconnecter", onClick: logout, dataTestId: "logout" },
   ];
 
   return (
@@ -43,10 +43,11 @@ export const MenuActions = ({ menu }: { menu: NestedMenu | null }) => {
           },
         })}
       >
-        {actions.map(({ text, onClick }, index) => (
+        {actions.map(({ text, onClick, dataTestId }, index) => (
           <Fragment key={text}>
             <Button
               className={css({ w: "100%" })}
+              data-test-id={dataTestId}
               type="button"
               priority="tertiary no outline"
               onClick={(e) => {

packages/frontend/src/features/menu/MenuButton.tsx

@@ -61,6 +61,7 @@ export const MenuButton = ({ headerRef }: { headerRef: any }) => {
                         className={css({ ml: "16px", mb: "0" })}
                         priority="tertiary"
                         iconId="fr-icon-account-circle-fill"
+                        data-test-id="account-menu"
                       >
                         Mon compte
                       </Button>

playwright.config.ts

@@ -1,5 +1,8 @@
 import { defineConfig, devices } from "@playwright/test";
+import dotenv from "dotenv";
+import { expand } from "dotenv-expand";
 
+expand(dotenv.config({ path: "./.env" }));
 /**
  * Read environment variables from file.
  * https://github.com/motdotla/dotenv

tests/user.spec.ts

@@ -1,10 +1,15 @@
 import { test, expect, type Route } from "@playwright/test";
 import type { RouterOutputs } from "../packages/frontend/src/api";
+import { db } from "../packages/backend/src/db/db";
 
 test.beforeEach(async ({ page }) => {
   await page.goto("./");
 });
 
+test.afterAll(async () => {
+  await cleanupDb();
+});
+
 test.describe("Create user", () => {
   test("should be redirected to the login page", async ({ page }) => {
     await page.waitForURL((url) => url.pathname === "/login");
@@ -21,48 +26,47 @@ test.describe("Create user", () => {
     expect(page.url()).toContain("signup");
   });
 
-  test("should create a new user", async ({ page }) => {
-    await page.route("*/**/api/create-user", mockRouteResponse);
+  test.only("should create a new user", async ({ page }) => {
     await page.goto("./signup");
 
-    await page.fill("input[name=name]", "Test runner");
-    await page.fill("input[name=email]", "[email protected]");
-    await page.fill("input[name=password]", "Password123!");
+    await page.fill("input[name=name]", mockUser.name);
+    await page.fill("input[name=email]", mockUser.email);
+    await page.fill("input[name=password]", mockUser.password);
+
+    await page.selectOption("select[name=udap_id]", "udap-landes");
 
     await page.click("button[type=submit]");
 
     await page.waitForURL((url) => url.pathname === "/");
     expect(page.url()).toContain("/");
 
-    const button = await page.waitForSelector("#fr-header-quick-access-item--Sed_connecter-0");
+    await page.click("button[data-test-id=account-menu]");
+
+    const button = await page.waitForSelector("[data-test-id=logout]");
     await button.click();
     await page.waitForURL((url) => url.pathname === "/login");
     expect(page.url()).toContain("login");
   });
 
   test("should login", async ({ page }) => {
-    await page.route("*/**/api/login", mockRouteResponse);
-
     await page.goto("./login");
 
-    await page.fill("input[name=email]", "[email protected]");
-    await page.fill("input[name=password]", "Password123!");
+    await page.fill("input[name=email]", mockUser.email);
+    await page.fill("input[name=password]", mockUser.password);
 
     await page.click("button[type=submit]");
     await page.waitForURL((url) => url.pathname === "/");
     expect(page.url()).toContain("/");
   });
 });
 
-const mockRouteResponse = async (route: Route) => {
-  await route.fulfill({ json: mockLoginResponse });
+const cleanupDb = async () => {
+  const result = await db.deleteFrom("internal_user").where("email", "=", mockUser.email).returning("id").execute();
+  await db.deleteFrom("user").where("id", "=", result[0].id).execute();
 };
 
-const mockLoginResponse: RouterOutputs<"/api/create-user"> = {
-  token: "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa",
-  user: {
-    id: "3787db2f-5bd0-4a43-af83-a9768c2b7e71",
-    name: "Test runner",
-    email: "[email protected]",
-  },
+const mockUser = {
+  name: "Test runner",
+  email: "[email protected]",
+  password: "Password123!",
 };