Two issues caused the same class of flake locally: 1. Default workers were CPU-count, but the journal/planner are served by Vite dev (not the production build CI uses). Cold-compiling `/api/auth/register` under N parallel hits produced 30s timeouts on a quarter of runs. Set workers to 1 in both environments for parity with CI. 2. Even sequentially, a button is clickable per Playwright's actionability check before React has hydrated its `onClick`. So the first click after a navigation could fire native form submit (or do nothing), which manifested as "URL never changed to /" or "menuitem Log Out never appeared". Add a `waitForHydration` helper that polls for React fibers (`__reactProps$<id>`) attached to a DOM node and call it after each cross-page navigation that ends in an interactive form or dropdown. CI is unaffected (production builds hydrate fast and didn't expose either bug), but the helper is harmless there. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
105 lines
2.7 KiB
TypeScript
105 lines
2.7 KiB
TypeScript
import { defineConfig, devices } from "@playwright/test";
|
|
|
|
export default defineConfig({
|
|
testDir: "./e2e",
|
|
outputDir: "./e2e/results",
|
|
fullyParallel: true,
|
|
retries: process.env.CI ? 2 : 0,
|
|
// Locally the journal/planner run under Vite dev — many parallel workers
|
|
// overwhelm cold-compile of /api/* routes and cause flaky timeouts on
|
|
// first hits. CI runs production builds and is unaffected. Keep at 1 in
|
|
// both environments for parity.
|
|
workers: 1,
|
|
reporter: process.env.CI
|
|
? [["github"], ["html", { open: "never" }], ["json", { outputFile: "playwright-results.json" }]]
|
|
: "list",
|
|
use: {
|
|
baseURL: "http://localhost:3000",
|
|
trace: "on-first-retry",
|
|
screenshot: "only-on-failure",
|
|
},
|
|
projects: [
|
|
{
|
|
name: "journal",
|
|
testMatch: "journal.test.ts",
|
|
use: {
|
|
...devices["Desktop Chrome"],
|
|
baseURL: "http://localhost:3000",
|
|
},
|
|
},
|
|
{
|
|
name: "planner",
|
|
testMatch: "planner.test.ts",
|
|
use: {
|
|
...devices["Desktop Chrome"],
|
|
baseURL: "http://localhost:3001",
|
|
},
|
|
},
|
|
{
|
|
name: "auth",
|
|
testMatch: "auth.test.ts",
|
|
use: {
|
|
...devices["Desktop Chrome"],
|
|
baseURL: "http://localhost:3000",
|
|
},
|
|
},
|
|
{
|
|
name: "public-content",
|
|
testMatch: "public-content.test.ts",
|
|
use: {
|
|
...devices["Desktop Chrome"],
|
|
baseURL: "http://localhost:3000",
|
|
},
|
|
},
|
|
{
|
|
name: "demo-bot",
|
|
testMatch: "demo-bot.test.ts",
|
|
use: {
|
|
...devices["Desktop Chrome"],
|
|
baseURL: "http://localhost:3000",
|
|
},
|
|
},
|
|
{
|
|
name: "integration",
|
|
testMatch: "integration.test.ts",
|
|
use: {
|
|
...devices["Desktop Chrome"],
|
|
},
|
|
},
|
|
{
|
|
name: "notifications",
|
|
testMatch: "notifications.test.ts",
|
|
use: {
|
|
...devices["Desktop Chrome"],
|
|
baseURL: "http://localhost:3000",
|
|
},
|
|
},
|
|
],
|
|
webServer: process.env.CI
|
|
? [
|
|
{
|
|
command: "npx react-router-serve ./build/server/index.js",
|
|
url: "http://localhost:3000",
|
|
cwd: "./apps/journal",
|
|
reuseExistingServer: false,
|
|
},
|
|
{
|
|
command: "node --experimental-strip-types server.ts",
|
|
url: "http://localhost:3001",
|
|
cwd: "./apps/planner",
|
|
reuseExistingServer: false,
|
|
},
|
|
]
|
|
: [
|
|
{
|
|
command: "pnpm --filter @trails-cool/journal dev",
|
|
url: "http://localhost:3000",
|
|
reuseExistingServer: true,
|
|
},
|
|
{
|
|
command: "pnpm --filter @trails-cool/planner dev",
|
|
url: "http://localhost:3001",
|
|
reuseExistingServer: true,
|
|
},
|
|
],
|
|
});
|