bstein-dev-home/testing/frontend/e2e/home.spec.js

import { expect, test } from "../../../frontend/node_modules/@playwright/test/index.mjs";

test.beforeEach(async ({ page }) => {
  await page.addInitScript(() => {
    const originalFetch = window.fetch.bind(window);
    const jsonResponse = (body) =>
      new Response(JSON.stringify(body), {
        status: 200,
        headers: { "content-type": "application/json" },
      });

    window.fetch = (resource, options) => {
      const requestUrl = typeof resource === "string" ? resource : resource?.url || "";
      const url = new URL(requestUrl, window.location.origin);
      if (url.pathname === "/api/auth/config") {
        return Promise.resolve(jsonResponse({ enabled: false }));
      }
      if (url.pathname === "/api/lab/status") {
        return Promise.resolve(
          jsonResponse({
            connected: true,
            atlas: { up: true },
            oceanus: { up: false },
          }),
        );
      }
      return originalFetch(resource, options);
    };
  });

  await page.route("**/api/auth/config", async (route) => {
    await route.fulfill({
      status: 200,
      contentType: "application/json",
      body: JSON.stringify({ enabled: false }),
    });
  });
  await page.route("**/api/lab/status", async (route) => {
    await route.fulfill({
      status: 200,
      contentType: "application/json",
      body: JSON.stringify({
        connected: true,
        atlas: { up: true },
        oceanus: { up: false },
      }),
    });
  });
});

test("shows the overview and opens the diagram overlay", async ({ page }) => {
  await page.goto("/", { waitUntil: "domcontentloaded" });

  await expect(page.getByRole("heading", { name: "Overview" })).toBeVisible();
  await expect(page.getByText("Live data connected")).toBeVisible();
  await expect(page.locator(".service-grid .service").filter({ hasText: "Nextcloud" }).first()).toBeVisible();

  const firstCard = page.locator(".mermaid-card").first();
  await expect(firstCard).toBeVisible();
  await firstCard.getByRole("button", { name: "Full screen" }).click();
  await expect(page.locator(".overlay")).toBeVisible();
  await page.keyboard.press("Escape");
  await expect(page.locator(".overlay")).toHaveCount(0);
});