e2e/session-bootstrap.spec.ts

Linked repository file from this build.

import { expect, test } from "@playwright/test";

test("protected pages load from the server session without waiting for Clerk's browser session", async ({
  page,
}) => {
  await page
    .context()
    .addCookies([{ name: "qc-test-staff", value: "501", url: "http://localhost:3001" }]);
  const sessionRequests: string[] = [];
  page.on("request", (request) => {
    if (new URL(request.url()).pathname === "/api/session") sessionRequests.push(request.url());
  });
  await page.route("**/v1/**", (route) => route.abort());
  await page.goto("/reports");
  await expect(page.getByRole("button", { name: "Run report", exact: true })).toBeEnabled();
  await page.locator('a[href="/reviews"]:visible').first().click();
  await expect(
    page.getByRole("table", { name: "Reviews in branch" }).locator("tbody a").first(),
  ).toBeVisible();
  expect(sessionRequests).toEqual([]);
});

test("Clerk UI loads without structural CSS version warnings", async ({ page }) => {
  const warnings: string[] = [];
  page.on("console", (message) => {
    if (/structural_css_pin_clerk_ui|Structural CSS detected/.test(message.text()))
      warnings.push(message.text());
  });
  await page.goto("/sign-in");
  await expect(page.locator(".cl-signIn-root")).toBeVisible({ timeout: 20_000 });
  expect(warnings).toEqual([]);
});

test("Home loads once and displays rows before its seen write completes", async ({ page }) => {
  let loads = 0;
  page.on("request", (request) => {
    if (new URL(request.url()).pathname === "/api/inbox" && request.method() === "GET") loads++;
  });
  let release!: () => void;
  const seen = new Promise<void>((resolve) => {
    release = resolve;
  });
  await page.route("**/api/inbox/seen", async (route) => {
    await seen;
    await route.fulfill({ status: 204 });
  });
  try {
    await page.goto("/dashboard");
    await expect(page.locator('main section[aria-busy="false"] h2').first()).toBeVisible();
    expect(loads).toBe(1);
  } finally {
    release();
  }
});