scripts/check-mobile-nav.mjs

import { mkdir, writeFile } from "node:fs/promises";
import { dirname, join } from "node:path";
import { fileURLToPath, pathToFileURL } from "node:url";

const playwrightPath = process.env.CODEX_PLAYWRIGHT_PATH
  || "C:/Users/takum/.cache/codex-runtimes/codex-primary-runtime/dependencies/node/node_modules/playwright/index.mjs";
const chromePath = process.env.CHROME_PATH
  || "C:/Program Files/Google/Chrome/Application/chrome.exe";
const { chromium } = await import(pathToFileURL(playwrightPath).href);
const workspace = dirname(dirname(fileURLToPath(import.meta.url)));
const output = join(workspace, "output", "real-e2e");
const evidence = join(output, "evidence", "after");

await mkdir(evidence, { recursive: true });
const browser = await chromium.launch({ executablePath: chromePath, headless: true });

try {
  const page = await browser.newPage({ viewport: { width: 390, height: 900 } });
  await page.goto(pathToFileURL(join(output, "index.html")).href, { waitUntil: "load" });
  const summary = page.locator(".mobile-nav > summary");
  await summary.focus();
  await page.keyboard.press("Enter");
  const openedByKeyboard = await page.locator(".mobile-nav").evaluate((node) => node.open);
  await page.keyboard.press("Tab");
  const firstLinkFocused = await page.evaluate(() => document.activeElement === document.querySelector(".mobile-nav-panel a"));
  const targetHref = await page.locator(".mobile-nav-panel a").nth(1).getAttribute("href");
  await page.evaluate(() => { document.documentElement.style.scrollBehavior = "auto"; });
  await page.locator(".mobile-nav-panel a").nth(1).click();
  await page.waitForTimeout(250);
  const result = {
    viewport: 390,
    openedByKeyboard,
    firstLinkFocused,
    targetHref,
    hash: await page.evaluate(() => location.hash),
    targetTop: await page.locator(targetHref).evaluate((node) => Math.round(node.getBoundingClientRect().top)),
  };
  const desktop = await browser.newPage({ viewport: { width: 1440, height: 1000 } });
  await desktop.goto(pathToFileURL(join(output, "index.html")).href, { waitUntil: "load" });
  result.desktop1440 = await desktop.evaluate(() => {
    const copy = document.querySelector("#hero .hero-copy").getBoundingClientRect();
    const form = document.querySelector("#hero .hero-form-wrap").getBoundingClientRect();
    return { copyTop: Math.round(copy.top), formTop: Math.round(form.top) };
  });
  await desktop.close();
  await writeFile(join(evidence, "mobile-nav-interaction.json"), `${JSON.stringify(result, null, 2)}\n`, "utf8");
  console.log(JSON.stringify(result, null, 2));
  if (!result.openedByKeyboard || !result.firstLinkFocused || result.hash !== targetHref || Math.abs(result.targetTop) > 1
    || result.desktop1440.copyTop !== result.desktop1440.formTop) {
    process.exitCode = 1;
  }
} finally {
  await browser.close();
}