waygraph 0.15.52 → 0.15.54

package/templates/scaffold/src/flows/{example.flow.ts → home/hello.flow.ts}

@@ -1,21 +1,20 @@
-import { Engine } from "waygraph";
-import config from "../../config/waygraph.config.js";
-import { DemoSel } from "../map/(app_base)/home/_sel.js";
-import { NavHomeBlock } from "../map/(app_base)/home/_nav.block.js";
-import { AssertHelloBlock } from "../map/(app_base)/home/_methods/assert-hello.method.block.js";
-import { NavDocsBlock } from "../map/(app_base)/docs/_nav.block.js";
+import { engine } from "../../../config/waygraph.config.js";
+import { DemoSel } from "../../map/(app_base)/home/_sel.js";
+import { NavHomeBlock } from "../../map/(app_base)/home/_nav.block.js";
+import { AssertHelloBlock } from "../../map/(app_base)/home/_methods/assert-hello.method.block.js";
+import { NavDocsBlock } from "../../map/(app_base)/docs/_nav.block.js";
 // Page hubs registered for auto/docs grouping (arrival-only after nav).
-import "../map/(app_base)/home/_page.block.js";
-import "../map/(app_base)/docs/_page.block.js";
-
-const engine = new Engine(config);
+import "../../map/(app_base)/home/_page.block.js";
+import "../../map/(app_base)/docs/_page.block.js";
 
 /** Smoke: nav + assert (no mem), then nav to the sibling docs/ page. Green offline. */
-export const exampleFlow = engine
+export const homeHelloFlow = engine
   .map()
   .start()
   .gotoPage(
-    NavHomeBlock.stubAfter((ctx) => {
+    NavHomeBlock.stubBefore((ctx) => {
+      ctx.title("Scaffold: Hello Waygraph");
+    }).stubAfter((ctx) => {
       ctx.ring("title", { selector: DemoSel.title, label: "Home heading", duration: true });
     }).stubOnError((ctx) => {
       ctx.ring("title", { selector: DemoSel.title, label: "Home heading at failure" });
@@ -40,4 +39,4 @@ export const exampleFlow = engine
       }),
   )
   .gotoPage(NavDocsBlock)
-  .end({ title: "Scaffold: Hello Waygraph" });
+  .end();

package/templates/scaffold/tests/example.spec.ts

@@ -1,16 +1,16 @@
 import { test, expect } from "@playwright/test";
 import { MemPage, checkpoint, seedMemStub } from "waygraph";
-import { exampleFlow } from "../src/flows/example.flow.js";
-import { shopFlow } from "../src/flows/shop.flow.js";
+import { homeHelloFlow } from "../src/flows/home/hello.flow.js";
+import { homeCartFlow } from "../src/flows/home/cart.flow.js";
 
 test("example flow reaches Docs (home -> assert -> sibling docs/ page)", async ({ context }) => {
-  const result = await exampleFlow.run(context, new MemPage());
+  const result = await homeHelloFlow.run(context, new MemPage());
   expect(result).toEqual(checkpoint("Docs"));
 });
 
 test("shop flow adds then clears (Effect + Method)", async ({ context }) => {
   const mem = new MemPage();
-  seedMemStub(mem, shopFlow);
-  const result = await shopFlow.run(context, mem);
+  seedMemStub(mem, homeCartFlow);
+  const result = await homeCartFlow.run(context, mem);
   expect(result).toEqual(checkpoint("CartEmpty"));
 });

package/templates/scaffold/tests/hoppscotch.spec.ts

@@ -2,9 +2,9 @@ import { test, expect } from "@playwright/test";
 import { createServer, type Server } from "node:http";
 import { MemPage, checkpoint } from "waygraph";
 import config from "../config/waygraph.config.js";
-import { hoppscotchGetFlow } from "../src/flows/hoppscotch-get.flow.js";
-import { hoppscotchAuthFlow } from "../src/flows/hoppscotch-auth.flow.js";
-import { hoppscotchPostFlow } from "../src/flows/hoppscotch-post.flow.js";
+import { hoppscotchGetFlow } from "../src/flows/(external)/hoppscotch/get.flow.js";
+import { hoppscotchAuthFlow } from "../src/flows/(external)/hoppscotch/auth.flow.js";
+import { hoppscotchPostFlow } from "../src/flows/(external)/hoppscotch/post.flow.js";
 import {
   ExpectedResponseHeader,
   ExpectedResponseText,

package/templates/scaffold/tests/mail-verify.spec.ts

@@ -2,12 +2,12 @@ import { test, expect } from "@playwright/test";
 import { spawnSync } from "node:child_process";
 import net from "node:net";
 import { MemPage, checkpoint } from "waygraph";
-import { mailVerifyFlow } from "../src/flows/mail-verify.flow.js";
+import { emailVerificationFlow } from "../src/flows/(user-stories)/email-verification.flow.js";
 import { ExpectedRecipient, ExpectedLinkPattern, ExpectedEmailContent } from "../src/states/demo.mem-keys.js";
 import { HOME_URL } from "../src/map/(app_base)/home/_sel.js";
 
 // Plays "the app sent a verification email": starts a throwaway Mailpit container, sends a real SMTP message,
-// then runs mailVerifyFlow against it, including the no-email and wrong-content failure paths.
+// then runs emailVerificationFlow against it, including the no-email and wrong-content failure paths.
 
 function runMailpit(): { containerId: string; smtpPort: number; httpPort: number } {
   const run = spawnSync("docker", ["run", "--rm", "-d", "-p", "0:1025", "-p", "0:8025", "axllent/mailpit"], {
@@ -80,7 +80,7 @@ async function withMailpit<T>(fn: (opts: { httpPort: number; smtpPort: number })
 
 const VERIFICATION_CONTENT = "Please confirm your email address to finish setting up your account.";
 
-test("mailVerifyFlow: confirms arrival, confirms content, reads the real link, navigates to it", async ({
+test("emailVerificationFlow: confirms arrival, confirms content, reads the real link, navigates to it", async ({
   context,
 }) => {
   test.skip(!dockerAvailable(), "Docker not reachable in this environment");
@@ -100,7 +100,7 @@ test("mailVerifyFlow: confirms arrival, confirms content, reads the real link, n
     mem.set(ExpectedRecipient({ email: recipient }));
     mem.set(ExpectedLinkPattern, "verified=1");
     mem.set(ExpectedEmailContent, VERIFICATION_CONTENT);
-    const result = await mailVerifyFlow.run(context, mem);
+    const result = await emailVerificationFlow.run(context, mem);
     expect(result).toEqual(checkpoint("HomeVerified"));
   });
 });
@@ -130,7 +130,7 @@ test("the same four mail-reading Blocks handle a second, unrelated email scenari
     mem.set(ExpectedRecipient({ email: recipient }));
     mem.set(ExpectedLinkPattern, "verified=1");
     mem.set(ExpectedEmailContent, resetContent);
-    const result = await mailVerifyFlow.run(context, mem);
+    const result = await emailVerificationFlow.run(context, mem);
     expect(result).toEqual(checkpoint("HomeVerified"));
   });
 });
@@ -149,7 +149,7 @@ test("assert-email-received fails loud, naming itself, when no email ever arrive
     // not just the leaf Block - real, useful QA context, not a bug - so this
     // matches the accumulated name ending at assert-email-received, not an
     // exact "failed after \"assert-email-received\"" alone.
-    await expect(mailVerifyFlow.run(context, mem)).rejects.toThrow(
+    await expect(emailVerificationFlow.run(context, mem)).rejects.toThrow(
       /trait "email-received" failed after ".*assert-email-received"/,
     );
   });
@@ -175,7 +175,7 @@ test("assert-email-content fails loud, naming itself, when the email's copy does
     mem.set(ExpectedRecipient({ email: recipient }));
     mem.set(ExpectedLinkPattern, "verified=1");
     mem.set(ExpectedEmailContent, VERIFICATION_CONTENT);
-    await expect(mailVerifyFlow.run(context, mem)).rejects.toThrow(
+    await expect(emailVerificationFlow.run(context, mem)).rejects.toThrow(
       /trait "body-contains-expected-text" failed after ".*assert-email-content"/,
     );
   });

package/templates/skills/waygraph-convention.skill.md

@@ -68,10 +68,14 @@ against a live site, use `--skill-pilot-blind`.
 
 ## Flows, stubs and config (the scaffold's shape)
 
-- **Build flows with `map()`** (`.start().gotoPage(Nav).method(B).assert(A).end({ ... })`; `.gotoExternal` for another origin),
-  not a raw `defineFlow([start, ...])` array. Flow settings go in `.end`'s options:
-  `.end({ title: "Shop", memStub: true, sessionReset: true })`. Never `withMemStub(withTitle(withSessionReset(...)))`.
-  (`defineFlow(blocks, options)` takes the same options.)
+- **Build flows with `map()`** (`engine.map({ memStub }).start().gotoPage(Nav).method(B, { pace }).assert(A).end()`;
+  `.gotoExternal` for another origin), never a raw `defineFlow([start, ...])`. Flow settings (`memStub`, `expectedFailure`, `demoPace`, `sessionReset`) go in `map({ … })` before the chain
+  and `.end()` takes nothing. The flow's title is `ctx.title(...)` in a stub. **Nest flows with `.flow(sub, { reset: true })`**,
+  not `chainFlow` / `withSessionReset`. No `withMemStub(withTitle(...))` wrappers.
+- **`src/flows/` holds use cases and mirrors the front end's endpoints**: a folder per page (`flows/auth/login/`) with one
+  file per scenario named for its outcome (`success.flow.ts`, `wrong-password.flow.ts`, `empty-fields.flow.ts`), and
+  `(user-stories)/` (any `(group)`) for flows that cross pages. Export names are `<page><Outcome>Flow`. Not one file per
+  Block chain, not a flat folder of unrelated flows.
 - **Blocks carry no stubs; the flow does.** Demo highlights are ctx stubs chained on the Block where the flow uses it:
   `AddItemBlock.stubAfter((ctx) => { ctx.ring("cart", { selector: DemoSel.cartCount, label: "AC · item in cart" }); })`.
   Not a static `withHighlightFixtures({ "add-item": { stubAfter: {...} } })` map, and not an inline
@@ -79,19 +83,23 @@ against a live site, use `--skill-pilot-blind`.
 - **Reading a value into `mem` happens in `act`** (`mem.set(Key, value)`), like Mailpit's `extract-email-link`.
   `observe` is only for a Block that branches (it feeds `resolve`); an empty `act(){}` plus an `observe` that
   writes `mem` is a misuse.
+- **Demo pace is a map option or config, never a wrapper.** `.method(SetBearerTokenBlock, { pace: "blitz" })` speeds one step,
+  `map({ demoPace: "fast" })` a flow, `demo: { pace, typingMs, slowMo }` in the config the whole project. Not `withBlockPace(...)`.
 - **Per-environment values** (a different `baseUrl` for staging) come from `.env` files read in the config function:
   `defineConfig(({ env }) => ({ baseUrl: env.BASE_URL }))`; `--env staging` loads `.env.staging`. Never edit the config to switch.
+- **More than one config** (staging, another app) is another file, `config/waygraph.<name>.config.ts`, chosen with `--config <name>`.
+  The engine a config exports, and every engine in a flow, follows the selected config.
 - **A browser dialog (`confirm`, `beforeunload`) is answered with `withDialog(block, { accept, into })`**, not inside the
   Block's `act`; the click Block stays a plain click.
 - **Project settings live in `config/waygraph.config.ts`** (`defineConfig({ baseUrl, testDir, webServer,
-  extensions, playwright: {...} })`). Flows import it and build the Engine from it (`new Engine(config)`); a project needs no
+  extensions, playwright: {...} })`). The config file also exports `engine = new Engine(config)`; flows `import { engine } from "../../config/waygraph.config.js"`; a project needs no
   `playwright.config.ts` - `waygraph test` builds one from it. A leftover `playwright.config.*` is deprecated.
 - **Another origin the test needs is a Map external** under `src/map/(external)/<tool>/`. For REST API
   tests, `(external)/hoppscotch` (list `extensions: ["hoppscotch"]` in the config) drives hoppscotch.io's client
   with the extension, so requests skip CORS: `set-method`, `set-url`, `set-headers`, `set-json-body`,
   `send-request`, `assert-status`, `read-response-body`, `assert-response-body`.
 - **Updating an older project:** `npm install waygraph@latest`, then `waygraph upgrade` (dry run) to see new
-  and differing scaffold files; copy the paths you want with `--apply`.
+  and differing scaffold files; copy the paths you want with `--apply`. `waygraph upgrade --skills` refreshes these skills.
 
 ## Block kinds (file convention)
 

package/examples/saucedemo/playwright.config.ts

@@ -1,19 +0,0 @@
-import { defineConfig } from "@playwright/test";
-import { chromiumExecutablePath } from "waygraph";
-
-export default defineConfig({
-  testDir: "./tests",
-  fullyParallel: false,
-  workers: 1,
-  timeout: 30_000,
-  reporter: [["list"], ["html", { open: "never" }]],
-  use: {
-    headless: true,
-    baseURL: "https://www.saucedemo.com",
-    trace: "retain-on-failure",
-    launchOptions: {
-      executablePath: chromiumExecutablePath(),
-      args: ["--no-sandbox", "--disable-dev-shm-usage"],
-    },
-  },
-});

package/examples/saucedemo/scripts/drive-auto-cli.mjs

@@ -1,93 +0,0 @@
-#!/usr/bin/env node
-/**
- * Drive `waygraph auto --cli` through login -> add-all -> remove-all -> quit.
- * Waits for each Choose: prompt so picks are not sent early.
- *
- * Usage (from examples/saucedemo):
- *   node scripts/drive-auto-cli.mjs
- */
-import { spawn } from "node:child_process";
-import { createInterface } from "node:readline";
-import { fileURLToPath } from "node:url";
-import { dirname, join } from "node:path";
-
-const root = join(dirname(fileURLToPath(import.meta.url)), "..");
-const waygraphBin = join(root, "../../bin/waygraph");
-const DATA =
-  process.env.WAYGRAPH_DATA ??
-  '{"saucedemo.credentials":{"username":"standard_user","password":"secret_sauce"}}';
-
-function pickByLabel(menuText, label) {
-  const re = new RegExp(`\\[(\\d+)\\]\\s+${label.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")}`);
-  const m = menuText.match(re);
-  if (!m) throw new Error(`menu missing "${label}"\n${menuText}`);
-  return m[1];
-}
-
-async function main() {
-  const child = spawn(waygraphBin, ["auto", "--cli", "--data", DATA, "."], {
-    cwd: root,
-    stdio: ["pipe", "pipe", "pipe"],
-    env: process.env,
-  });
-
-  let buf = "";
-  const dump = (chunk, stream) => {
-    const s = chunk.toString();
-    buf += s;
-    process[stream].write(s);
-  };
-  child.stdout.on("data", (c) => dump(c, "stdout"));
-  child.stderr.on("data", (c) => dump(c, "stderr"));
-
-  const waitChoose = () =>
-    new Promise((resolve, reject) => {
-      const start = Date.now();
-      const tick = () => {
-        if (buf.includes("Choose:")) {
-          const i = buf.lastIndexOf("Choose:");
-          const slice = buf.slice(Math.max(0, i - 4000), i + 8);
-          resolve(slice);
-          return;
-        }
-        if (Date.now() - start > 120_000) {
-          reject(new Error(`timeout waiting for Choose:\n${buf.slice(-2000)}`));
-          return;
-        }
-        setTimeout(tick, 100);
-      };
-      tick();
-    });
-
-  const send = (line) => {
-    console.error(`\n>> pick ${line.trim()}`);
-    buf = buf.replace(/Choose:/g, "Choose(done):");
-    child.stdin.write(line);
-  };
-
-  try {
-    let menu = await waitChoose();
-    send("1\n"); // submit-login
-    menu = await waitChoose();
-    if (!/LoggedIn|Add all to cart/.test(menu)) {
-      throw new Error(`expected inventory after login, got:\n${menu}`);
-    }
-    send(`${pickByLabel(menu, "Add all to cart")}\n`);
-    menu = await waitChoose();
-    send(`${pickByLabel(menu, "Remove all from cart")}\n`);
-    menu = await waitChoose();
-    if (!/Add all to cart/.test(menu)) {
-      throw new Error(`expected Add all again after remove-all, got:\n${menu}`);
-    }
-    send("q\n");
-    const code = await new Promise((res) => child.on("exit", res));
-    if (code !== 0 && code !== null) process.exitCode = code;
-    else console.error("\ndrive-auto-cli: PASS login -> add-all -> remove-all -> quit");
-  } catch (err) {
-    console.error(err instanceof Error ? err.message : String(err));
-    child.kill("SIGTERM");
-    process.exitCode = 1;
-  }
-}
-
-main();

package/examples/saucedemo/scripts/prove-add-to-cart-menu.mjs

@@ -1,126 +0,0 @@
-// Proves the dynamic add-to-cart menu for real: buildExploreMenu must offer
-// one row PER item still on the page (not one generic "add-to-cart" row tied
-// to the backpack), picking a non-default item must add THAT item (not the
-// backpack), and the menu must stop offering an item once it is in the cart.
-import { chromium } from "@playwright/test";
-import { join, dirname } from "node:path";
-import { fileURLToPath, pathToFileURL } from "node:url";
-import { createRequire } from "node:module";
-import { chromiumExecutablePath } from "waygraph";
-
-const require = createRequire(import.meta.url);
-await import(require.resolve("tsx/esm"));
-
-const root = join(dirname(fileURLToPath(import.meta.url)), "..");
-const waygraphDist = join(root, "../../dist");
-
-const { buildExploreContext, buildExploreMenu } = await import(
-  pathToFileURL(join(waygraphDist, "auto-explore.js")).href
-);
-const { MemPage, Engine, start, end } = await import(pathToFileURL(join(waygraphDist, "index.js")).href);
-
-const exe = chromiumExecutablePath();
-
-async function runBlock(engine, entry, context, page, mem) {
-  const flow = engine.defineFlow([start, entry.block, end]);
-  await flow.run(context, mem, { page, closeOnFinish: false });
-}
-
-const { graph, library } = await buildExploreContext(root);
-const mem = new MemPage();
-mem.set(library.byName.get("submit-login").block.requires[0], {
-  username: "standard_user",
-  password: "secret_sauce",
-});
-
-const browser = await chromium.launch({
-  headless: true,
-  ...(exe ? { executablePath: exe, args: ["--no-sandbox"] } : {}),
-});
-const context = await browser.newContext({
-  baseURL: "https://www.saucedemo.com",
-  viewport: { width: 1280, height: 900 },
-});
-const page = await context.newPage();
-const engine = new Engine({ headless: true });
-
-await page.goto("/", { waitUntil: "load" });
-await runBlock(engine, library.byName.get("submit-login"), context, page, mem);
-await page.waitForURL(/inventory\.html/);
-
-// 1. Menu on LoggedIn must offer one distinct add-to-cart row per product on
-// the inventory page - not a single generic row.
-const menu1 = await buildExploreMenu(page, graph, library, "LoggedIn");
-const addRows1 = menu1.flat.filter((e) => e.block === "add-to-cart");
-console.log(`add-to-cart rows on LoggedIn: ${addRows1.length}`);
-for (const row of addRows1) console.log(`  - ${row.label}`);
-if (addRows1.length < 2) {
-  throw new Error(`expected several distinct add-to-cart rows, got ${addRows1.length}`);
-}
-if (addRows1.some((r) => !r.instanceOption)) {
-  throw new Error("every add-to-cart row must carry an instanceOption");
-}
-const backpackRow = addRows1.find((r) => r.instanceOption.value.id === "sauce-labs-backpack");
-const bikeLightRow = addRows1.find((r) => r.instanceOption.value.id === "sauce-labs-bike-light");
-if (!backpackRow || !bikeLightRow) {
-  throw new Error("expected both the backpack and the bike light as separate rows");
-}
-if (backpackRow.label === bikeLightRow.label) {
-  throw new Error("rows must have distinct, item-specific labels");
-}
-
-// 2. Picking the NON-default item (bike light, not the backpack) must add
-// exactly that item - proving mem really drives which product act() clicks.
-mem.set(bikeLightRow.instanceOption.key, bikeLightRow.instanceOption.value);
-await runBlock(engine, library.byName.get("add-to-cart"), context, page, mem);
-
-const bikeLightInCart = await page.locator('[data-test="remove-sauce-labs-bike-light"]').first().isVisible();
-const backpackStillInCart = await page.locator('[data-test="remove-sauce-labs-backpack"]').first().isVisible();
-console.log(`bike light in cart: ${bikeLightInCart}, backpack in cart (should be false): ${backpackStillInCart}`);
-if (!bikeLightInCart) throw new Error("expected the picked item (bike light) to be in the cart");
-if (backpackStillInCart) throw new Error("backpack should NOT be in the cart - it was never picked");
-
-// 3. Rebuilding the menu must now offer bike light's "Remove" row instead,
-// and drop it from the add-to-cart options - the menu reflects the live page.
-const menu2 = await buildExploreMenu(page, graph, library, "LoggedIn");
-const addRows2 = menu2.flat.filter((e) => e.block === "add-to-cart");
-if (addRows2.some((r) => r.instanceOption.value.id === "sauce-labs-bike-light")) {
-  throw new Error("bike light should no longer be offered - it is already in the cart");
-}
-if (!addRows2.some((r) => r.instanceOption.value.id === "sauce-labs-backpack")) {
-  throw new Error("backpack should still be offered - it was never added");
-}
-console.log(`add-to-cart rows after adding bike light: ${addRows2.length} (one fewer than before)`);
-if (addRows2.length !== addRows1.length - 1) {
-  throw new Error(`expected exactly one fewer row (${addRows1.length - 1}), got ${addRows2.length}`);
-}
-
-// 4. Same rebuild must now offer Remove for the bike light (mem branch for
-// items already in the cart) - not only shrink the Add list.
-const removeRows = menu2.flat.filter((e) => e.block === "remove-from-cart");
-console.log(`remove-from-cart rows after add: ${removeRows.length}`);
-for (const row of removeRows) console.log(`  - ${row.label}`);
-if (removeRows.length !== 1) {
-  throw new Error(`expected exactly 1 Remove row (bike light), got ${removeRows.length}`);
-}
-if (removeRows[0].instanceOption.value.id !== "sauce-labs-bike-light") {
-  throw new Error(`expected Remove for bike light, got ${removeRows[0].label}`);
-}
-if (!/Remove "Sauce Labs Bike Light" from cart/.test(removeRows[0].label)) {
-  throw new Error(`unexpected Remove label: ${removeRows[0].label}`);
-}
-
-// 5. MemNav: Open "…" details for every inventory card (including ones already
-// in the cart) - separate from Add/Remove effect rows.
-const openRows = menu2.flat.filter((e) => e.block === "nav-item-detail");
-console.log(`nav-item-detail (MemNav) rows: ${openRows.length}`);
-for (const row of openRows) console.log(`  - ${row.label}`);
-if (openRows.length < 6) {
-  throw new Error(`expected 6 Open details rows, got ${openRows.length}`);
-}
-if (!openRows.some((r) => /Open "Test\.allTheThings\(\) T-Shirt \(Red\)" details/.test(r.label))) {
-  throw new Error("missing Open details row for Test.allTheThings() T-Shirt (Red)");
-}
-
-console.log("\nPASS: add/remove Effect + open-details MemNav reflect the live page");
-await browser.close();

package/examples/saucedemo/scripts/prove-auto-graph.mjs

@@ -1,92 +0,0 @@
-import { chromium } from "@playwright/test";
-import { join, dirname } from "node:path";
-import { fileURLToPath, pathToFileURL } from "node:url";
-import { createRequire } from "node:module";
-import { chromiumExecutablePath } from "waygraph";
-
-const require = createRequire(import.meta.url);
-await import(require.resolve("tsx/esm"));
-
-const root = join(dirname(fileURLToPath(import.meta.url)), "..");
-const outDir = join(root, "../../.tmp/waygraph-auto");
-const waygraphDist = join(root, "../../dist");
-
-const { buildExploreContext, buildExploreMenu } = await import(
-  pathToFileURL(join(waygraphDist, "auto-explore.js")).href
-);
-const { locate, MemPage, Engine, start, end } = await import(pathToFileURL(join(waygraphDist, "index.js")).href);
-
-const exe = chromiumExecutablePath();
-
-async function snap(page, name) {
-  const path = join(outDir, `graph-proof-${name}.png`);
-  await page.screenshot({ path, fullPage: false });
-  console.log("screenshot", path);
-}
-
-async function resolveHere(page, navTags) {
-  const path = new URL(page.url()).pathname;
-  if (path.includes("inventory-item.html")) return "ItemDetailPage";
-  if (path.includes("inventory.html")) return "LoggedIn";
-  if (path.includes("cart.html")) return "CartPage";
-  if (path.includes("checkout-complete.html")) return "OrderComplete";
-  if (path === "/" || path === "") {
-    if (await page.locator("#login-button").isVisible({ timeout: 500 }).catch(() => false)) return "LoginPage";
-  }
-  return locate(page, navTags, { timeoutMs: 1500 });
-}
-
-async function menuSummary(page, graph, library, label) {
-  const navTags = library.navBlocks.map((n) => n.block);
-  const resolved = await resolveHere(page, navTags);
-  const menu = await buildExploreMenu(page, graph, library, resolved);
-  console.log(`\n=== ${label} | here=${resolved} ===`);
-  for (const s of menu.sections) {
-    console.log(`  ${s.title}:`);
-    for (const e of s.edges) console.log(`    ${e.block} (${e.kind}) → ${e.to}`);
-  }
-  return resolved;
-}
-
-async function runBlock(engine, entry, context, page, mem) {
-  const flow = engine.defineFlow([start, entry.block, end]);
-  await flow.run(context, mem, { page, closeOnFinish: false });
-}
-
-const { graph, library } = await buildExploreContext(root);
-const mem = new MemPage();
-mem.set(
-  library.byName.get("submit-login").block.requires[0],
-  { username: "standard_user", password: "secret_sauce" },
-);
-
-const browser = await chromium.launch({
-  headless: true,
-  ...(exe ? { executablePath: exe, args: ["--no-sandbox"] } : {}),
-});
-const context = await browser.newContext({ baseURL: "https://www.saucedemo.com", viewport: { width: 1280, height: 900 } });
-const page = await context.newPage();
-const engine = new Engine({ headless: true });
-
-await page.goto("/", { waitUntil: "load" });
-await menuSummary(page, graph, library, "1. Login page");
-await snap(page, "1-login-menu");
-
-await runBlock(engine, library.byName.get("submit-login"), context, page, mem);
-await page.waitForURL(/inventory\.html/);
-const here2 = await menuSummary(page, graph, library, "2. After submit-login → LoggedIn");
-if (here2 !== "LoggedIn") throw new Error(`expected LoggedIn got ${here2}`);
-await snap(page, "2-logged-in-menu");
-
-const logout = library.byName.get("submit-logout");
-const hasLogout = (await buildExploreMenu(page, graph, library, "LoggedIn")).flat.some((e) => e.block === "submit-logout");
-if (!hasLogout) throw new Error("graph menu missing submit-logout on LoggedIn");
-
-await runBlock(engine, logout, context, page, mem);
-await page.waitForSelector("#login-button");
-const here3 = await menuSummary(page, graph, library, "3. After submit-logout → LoginPage");
-if (here3 !== "LoginPage") throw new Error(`expected LoginPage got ${here3}`);
-await snap(page, "3-back-to-login-menu");
-
-console.log("\nPASS: graph cycle LoginPage → LoggedIn → LoginPage");
-await browser.close();

package/examples/saucedemo/scripts/prove-wrong-login-runtime.mjs

@@ -1,63 +0,0 @@
-/**
- * Headless runtime proof: wrong password -> LoginPage + error banner.
- * Prints PASS/FAIL to stdout only (no screenshots, no visible browser).
- */
-import { chromium } from "@playwright/test";
-import { join, dirname } from "node:path";
-import { fileURLToPath, pathToFileURL } from "node:url";
-import { createRequire } from "node:module";
-import { chromiumExecutablePath } from "waygraph";
-
-const require = createRequire(import.meta.url);
-await import(require.resolve("tsx/esm"));
-
-const root = join(dirname(fileURLToPath(import.meta.url)), "..");
-const waygraphDist = join(root, "../../dist");
-const { Engine, start, end, MemPage } = await import(pathToFileURL(join(waygraphDist, "index.js")).href);
-const { NavLoginBlock } = await import(pathToFileURL(join(root, "src/blocks/saucedemo-web/nav-login.block.js")).href);
-const { FillUsernameBlock } = await import(
-  pathToFileURL(join(root, "src/blocks/saucedemo-web/methods/fill-username.method.block.js")).href
-);
-const { FillPasswordBlock } = await import(
-  pathToFileURL(join(root, "src/blocks/saucedemo-web/methods/fill-password.method.block.js")).href
-);
-const { SubmitLoginBlock } = await import(
-  pathToFileURL(join(root, "src/blocks/saucedemo-web/methods/submit-login.method.block.js")).href
-);
-const { LoginCreds } = await import(pathToFileURL(join(root, "src/states/checkout.mem-keys.js")).href);
-
-const exe = chromiumExecutablePath();
-const baseURL = "https://www.saucedemo.com";
-
-console.log("RUNTIME: headless browser (wrong password test)...");
-console.log("RUNTIME: baseURL =", baseURL);
-
-const browser = await chromium.launch({
-  headless: true,
-  ...(exe ? { executablePath: exe, args: ["--no-sandbox", "--disable-dev-shm-usage"] } : {}),
-});
-const context = await browser.newContext({ baseURL, viewport: { width: 1280, height: 900 } });
-const page = await context.newPage();
-const engine = new Engine({ headless: true });
-const mem = new MemPage();
-mem.set(LoginCreds({ username: "standard_user", password: "wrong-password" }));
-
-const flow = engine.defineFlow([start, NavLoginBlock, FillUsernameBlock, FillPasswordBlock, SubmitLoginBlock, end]);
-const runOut = await flow.run(context, mem, { page, closeOnFinish: false });
-const result = runOut && typeof runOut === "object" && "result" in runOut ? runOut.result : runOut;
-
-const errorVisible = await page.locator('[data-test="error"]').isVisible();
-const url = page.url();
-
-console.log("RUNTIME: checkpoint =", result.__state);
-console.log("RUNTIME: url =", url);
-console.log("RUNTIME: error banner visible =", errorVisible);
-
-if (result.__state !== "LoginPage" || !errorVisible) {
-  console.error("RUNTIME: FAIL");
-  await browser.close();
-  process.exit(1);
-}
-
-console.log("RUNTIME: PASS — stayed on LoginPage with error banner.");
-await browser.close();

package/templates/quickstart/playwright.config.ts

@@ -1,14 +0,0 @@
-import { defineConfig } from "@playwright/test";
-
-export default defineConfig({
-  testDir: "./tests",
-  fullyParallel: false,
-  workers: 1,
-  timeout: 30_000,
-  reporter: [["list"], ["html", { open: "never" }]],
-  use: {
-    headless: true,
-    baseURL: "https://www.saucedemo.com",
-    trace: "retain-on-failure",
-  },
-});