Files
story/test/e2e/visual-authentication-recovery.mjs
T

84 lines
5.1 KiB
JavaScript

import { createRequire } from "node:module";
import { mkdir } from "node:fs/promises";
import { fileURLToPath } from "node:url";
const require = createRequire(process.env.PLAYWRIGHT_REQUIRE_FROM ?? import.meta.url);
const { chromium } = require("playwright");
const outputDirectory = new URL("./screenshots/", import.meta.url);
const webURL = process.env.VISUAL_WEB_URL ?? "http://localhost:3100";
const webHostPattern = new RegExp(new URL(webURL).host.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"));
const oidcURLPattern = new RegExp(process.env.VISUAL_OIDC_URL_PATTERN ?? "localhost:58180");
const username = process.env.VISUAL_USERNAME ?? "owner";
const password = process.env.VISUAL_PASSWORD ?? "LocalOnly123!";
await mkdir(outputDirectory, { recursive: true });
const browser = await chromium.launch({ headless: true, executablePath: process.env.CHROME_PATH ?? "C:/Program Files/Google/Chrome/Application/chrome.exe" });
const page = await browser.newPage({ viewport: { width: 1440, height: 1000 }, deviceScaleFactor: 1 });
const consoleErrors = [];
const failedRequests = [];
const expectedSessionAbortRequests = [];
const injectedUnauthorizedResponses = [];
page.on("console", (message) => { if (message.type() === "error") consoleErrors.push(message.text()); });
page.on("requestfailed", (request) => {
const failure = request.failure()?.errorText ?? "failed";
const requestURL = new URL(request.url());
if (request.method() === "GET" && requestURL.pathname === "/api/v1/events" && failure.includes("ERR_ABORTED")) return;
if (injectedUnauthorizedResponses.length && requestURL.pathname.startsWith("/api/v1/") && failure.includes("ERR_ABORTED")) {
expectedSessionAbortRequests.push(`${request.method()} ${request.url()} ${failure}`);
return;
}
failedRequests.push(`${request.method()} ${request.url()} ${failure}`);
});
try {
await page.goto(webURL, { waitUntil: "networkidle" });
await page.getByRole("button", { name: "登录研发环境" }).click();
await page.waitForURL(oidcURLPattern);
await page.locator("#username").fill(username);
await page.locator("#password").fill(password);
await page.locator("#kc-login").click();
await page.waitForURL(webHostPattern, { timeout: 15000 });
await page.getByRole("heading", { name: "家庭业务工作台" }).waitFor();
let injectUnauthorized = true;
await page.route("**/api/v1/households", async (route) => {
if (!injectUnauthorized || route.request().method() !== "GET") {
await route.continue();
return;
}
injectUnauthorized = false;
injectedUnauthorizedResponses.push(route.request().url());
await route.fulfill({
status: 401,
contentType: "application/json",
body: JSON.stringify({ request_id: "visual-auth-expired", error: { code: "AUTHENTICATION_REQUIRED", message: "登录状态已经失效,请重新登录" } })
});
});
await page.getByRole("button", { name: "刷新数据", exact: true }).click();
await page.getByRole("button", { name: "重新登录", exact: true }).waitFor();
const authFailureVisible = await page.getByText("登录状态已经失效,请重新登录", { exact: true }).isVisible();
const workspaceUnmounted = await page.getByRole("heading", { name: "家庭业务工作台" }).count() === 0;
const oidcSessionCountAfter401 = await page.evaluate(() => Object.keys(sessionStorage).filter((key) => key.startsWith("oidc.user:")).length);
await page.screenshot({ path: fileURLToPath(new URL("authentication-required.png", outputDirectory)), fullPage: true });
await page.getByRole("button", { name: "重新登录", exact: true }).click();
await page.waitForURL(webHostPattern, { timeout: 15000 });
await page.getByRole("heading", { name: "家庭业务工作台" }).waitFor({ timeout: 15000 });
const accountRestored = await page.getByRole("button", { name: "退出登录", exact: true }).isVisible();
const oidcSessionCountAfterRelogin = await page.evaluate(() => Object.keys(sessionStorage).filter((key) => key.startsWith("oidc.user:")).length);
const overflow = await page.evaluate(() => [...document.querySelectorAll("body *")]
.filter((element) => element instanceof HTMLElement && element.scrollWidth > element.clientWidth + 2 && getComputedStyle(element).overflowX === "visible")
.slice(0, 20)
.map((element) => `${element.tagName}.${element.className}: ${element.clientWidth}/${element.scrollWidth}`));
const unexpectedConsoleErrors = consoleErrors.filter((message) => !message.includes("401 (Unauthorized)"));
const result = { authFailureVisible, workspaceUnmounted, oidcSessionCountAfter401, accountRestored, oidcSessionCountAfterRelogin, injectedUnauthorizedResponses, expectedSessionAbortRequests, overflow, consoleErrors, unexpectedConsoleErrors, failedRequests };
console.log(JSON.stringify(result, null, 2));
if (!authFailureVisible || !workspaceUnmounted || oidcSessionCountAfter401 !== 0 || !accountRestored || oidcSessionCountAfterRelogin !== 1 || injectedUnauthorizedResponses.length !== 1 || overflow.length || unexpectedConsoleErrors.length || failedRequests.length) {
throw new Error("Authentication recovery visual smoke failed");
}
} finally {
await browser.close();
}