walkwright 0.0.1

package/build/ui.d.ts

@@ -0,0 +1,49 @@
+type Tone = "accent" | "text" | "dim" | "faint" | "ok" | "warn" | "fail" | "code" | "border";
+declare const glyph: {
+    readonly ok: "✓";
+    readonly fail: "✗";
+    readonly carried: "↺";
+    readonly unseen: "●";
+    readonly open: "▾";
+    readonly closed: "▸";
+    readonly branch: "├";
+    readonly last: "└";
+    readonly cursor: "▌";
+    readonly prompt: ">";
+    readonly filled: "▰";
+    readonly empty: "▱";
+    readonly dot: "·";
+    readonly bar: "│";
+};
+declare function paint(tone: Tone, value: string): string;
+declare function bold(value: string): string;
+declare function plain(value: string): string;
+declare function width(value: string): number;
+declare function columns(): number;
+declare function pad(value: string, to: number): string;
+declare function clip(value: string, to: number): string;
+declare function line(...parts: string[]): void;
+declare function blank(): void;
+declare function status(...segments: string[]): string;
+declare function badge(count: number, tone?: Tone): string;
+declare function key(name: string): string;
+declare function action(verb: string): string;
+declare function prompt(text: string): string;
+declare function dashed(inner: number): string;
+interface BoxOptions {
+    legend: string;
+    title?: string;
+    primary?: boolean;
+    min?: number;
+}
+declare function box(rows: string[], options: BoxOptions): string[];
+declare function progress(done: number, total: number, cells?: number): string;
+declare function duration(ms: number): string;
+declare function count(value: number, noun: string): string;
+declare function failure(message: string, hint?: string): void;
+declare function transient(text: string): () => void;
+declare function pulse(text: string, intervalMs?: number): () => void;
+declare function wordmark(): string;
+declare function logo(): string[];
+
+export { type BoxOptions, type Tone, action, badge, blank, bold, box, clip, columns, count, dashed, duration, failure, glyph, key, line, logo, pad, paint, plain, progress, prompt, pulse, status, transient, width, wordmark };

package/build/ui.js

@@ -0,0 +1,56 @@
+import {
+  action,
+  badge,
+  blank,
+  bold,
+  box,
+  clip,
+  columns,
+  count,
+  dashed,
+  duration,
+  failure,
+  glyph,
+  key,
+  line,
+  logo,
+  pad,
+  paint,
+  plain,
+  progress,
+  prompt,
+  pulse,
+  status,
+  transient,
+  width,
+  wordmark
+} from "./chunk-RNNW7OW2.js";
+import "./chunk-UAWBPTDW.js";
+export {
+  action,
+  badge,
+  blank,
+  bold,
+  box,
+  clip,
+  columns,
+  count,
+  dashed,
+  duration,
+  failure,
+  glyph,
+  key,
+  line,
+  logo,
+  pad,
+  paint,
+  plain,
+  progress,
+  prompt,
+  pulse,
+  status,
+  transient,
+  width,
+  wordmark
+};
+//# sourceMappingURL=ui.js.map

package/build/ui.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/build/upload.d.ts

@@ -0,0 +1,10 @@
+import { WalkwrightConfig } from './project.js';
+
+type UploadProgress = (done: number, total: number, file: string) => void;
+interface Uploaded {
+    url: string;
+    number: number | undefined;
+}
+declare function uploadRun(config: WalkwrightConfig, branch: string, runDir: string, files: string[], onProgress?: UploadProgress): Promise<Uploaded>;
+
+export { type UploadProgress, type Uploaded, uploadRun };

package/build/upload.js

@@ -0,0 +1,8 @@
+import {
+  uploadRun
+} from "./chunk-JYHZVRB2.js";
+import "./chunk-UAWBPTDW.js";
+export {
+  uploadRun
+};
+//# sourceMappingURL=upload.js.map

package/build/upload.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/build/wait.d.ts

@@ -0,0 +1,14 @@
+import { Page, Locator } from '@playwright/test';
+
+declare function visibleWithin(locator: Locator, timeoutMs: number): Promise<boolean>;
+declare function pollUntil(page: Page, ready: () => Promise<boolean>, options?: {
+    timeoutMs?: number;
+    refresh?: () => Promise<void>;
+}): Promise<boolean>;
+declare function revealVirtualizedRow(page: Page, options: {
+    scrollOver: Locator;
+    target: Locator;
+    timeoutMs?: number;
+}): Promise<void>;
+
+export { pollUntil, revealVirtualizedRow, visibleWithin };

package/build/wait.js

@@ -0,0 +1,50 @@
+import "./chunk-UAWBPTDW.js";
+
+// src/wait.ts
+async function visibleWithin(locator, timeoutMs) {
+  try {
+    await locator.waitFor({ state: "visible", timeout: timeoutMs });
+    return true;
+  } catch {
+    return false;
+  }
+}
+async function pollUntil(page, ready, options = {}) {
+  const timeoutMs = options.timeoutMs ?? 6e4;
+  const deadline = Date.now() + timeoutMs;
+  for (; ; ) {
+    if (await ready()) {
+      return true;
+    }
+    if (Date.now() >= deadline) {
+      return false;
+    }
+    await page.waitForTimeout(1e4);
+    await (options.refresh?.() ?? page.reload());
+    await page.waitForTimeout(1e3);
+  }
+}
+async function revealVirtualizedRow(page, options) {
+  const timeoutMs = options.timeoutMs ?? 6e4;
+  const deadline = Date.now() + timeoutMs;
+  await options.scrollOver.hover();
+  for (; ; ) {
+    if (await options.target.count() > 0) {
+      break;
+    }
+    if (Date.now() >= deadline) {
+      throw new Error(
+        `the row did not appear within ${timeoutMs}ms of scrolling`
+      );
+    }
+    await page.mouse.wheel(0, 400);
+    await page.waitForTimeout(250);
+  }
+  await options.target.first().scrollIntoViewIfNeeded();
+}
+export {
+  pollUntil,
+  revealVirtualizedRow,
+  visibleWithin
+};
+//# sourceMappingURL=wait.js.map

package/build/wait.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/wait.ts"],"sourcesContent":["import type { Locator, Page } from \"@playwright/test\";\n\nexport async function visibleWithin(\n  locator: Locator,\n  timeoutMs: number,\n): Promise<boolean> {\n  try {\n    await locator.waitFor({ state: \"visible\", timeout: timeoutMs });\n    return true;\n  } catch {\n    return false;\n  }\n}\n\nexport async function pollUntil(\n  page: Page,\n  ready: () => Promise<boolean>,\n  options: { timeoutMs?: number; refresh?: () => Promise<void> } = {},\n): Promise<boolean> {\n  const timeoutMs = options.timeoutMs ?? 60_000;\n  const deadline = Date.now() + timeoutMs;\n\n  for (;;) {\n    if (await ready()) {\n      return true;\n    }\n\n    if (Date.now() >= deadline) {\n      return false;\n    }\n\n    await page.waitForTimeout(10_000);\n    await (options.refresh?.() ?? page.reload());\n    await page.waitForTimeout(1_000);\n  }\n}\n\nexport async function revealVirtualizedRow(\n  page: Page,\n  options: { scrollOver: Locator; target: Locator; timeoutMs?: number },\n): Promise<void> {\n  const timeoutMs = options.timeoutMs ?? 60_000;\n  const deadline = Date.now() + timeoutMs;\n\n  await options.scrollOver.hover();\n\n  for (;;) {\n    if ((await options.target.count()) > 0) {\n      break;\n    }\n\n    if (Date.now() >= deadline) {\n      throw new Error(\n        `the row did not appear within ${timeoutMs}ms of scrolling`,\n      );\n    }\n\n    await page.mouse.wheel(0, 400);\n    await page.waitForTimeout(250);\n  }\n\n  await options.target.first().scrollIntoViewIfNeeded();\n}\n"],"mappings":";;;AAEA,eAAsB,cACpB,SACA,WACkB;AAClB,MAAI;AACF,UAAM,QAAQ,QAAQ,EAAE,OAAO,WAAW,SAAS,UAAU,CAAC;AAC9D,WAAO;AAAA,EACT,QAAQ;AACN,WAAO;AAAA,EACT;AACF;AAEA,eAAsB,UACpB,MACA,OACA,UAAiE,CAAC,GAChD;AAClB,QAAM,YAAY,QAAQ,aAAa;AACvC,QAAM,WAAW,KAAK,IAAI,IAAI;AAE9B,aAAS;AACP,QAAI,MAAM,MAAM,GAAG;AACjB,aAAO;AAAA,IACT;AAEA,QAAI,KAAK,IAAI,KAAK,UAAU;AAC1B,aAAO;AAAA,IACT;AAEA,UAAM,KAAK,eAAe,GAAM;AAChC,WAAO,QAAQ,UAAU,KAAK,KAAK,OAAO;AAC1C,UAAM,KAAK,eAAe,GAAK;AAAA,EACjC;AACF;AAEA,eAAsB,qBACpB,MACA,SACe;AACf,QAAM,YAAY,QAAQ,aAAa;AACvC,QAAM,WAAW,KAAK,IAAI,IAAI;AAE9B,QAAM,QAAQ,WAAW,MAAM;AAE/B,aAAS;AACP,QAAK,MAAM,QAAQ,OAAO,MAAM,IAAK,GAAG;AACtC;AAAA,IACF;AAEA,QAAI,KAAK,IAAI,KAAK,UAAU;AAC1B,YAAM,IAAI;AAAA,QACR,iCAAiC,SAAS;AAAA,MAC5C;AAAA,IACF;AAEA,UAAM,KAAK,MAAM,MAAM,GAAG,GAAG;AAC7B,UAAM,KAAK,eAAe,GAAG;AAAA,EAC/B;AAEA,QAAM,QAAQ,OAAO,MAAM,EAAE,uBAAuB;AACtD;","names":[]}

package/package.json

@@ -0,0 +1,52 @@
+{
+  "name": "walkwright",
+  "version": "0.0.1",
+  "type": "module",
+  "description": "Walkwright runtime: walk your app with Playwright and record a browsable report",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/walkwright/walkwright.git",
+    "directory": "packages/runtime"
+  },
+  "homepage": "https://github.com/walkwright/walkwright#readme",
+  "bugs": {
+    "url": "https://github.com/walkwright/walkwright/issues"
+  },
+  "license": "MIT",
+  "engines": {
+    "node": ">=20"
+  },
+  "bin": {
+    "walkwright": "./bin/walkwright.js"
+  },
+  "exports": {
+    "./*": {
+      "walkwright:source": "./src/*.ts",
+      "types": "./build/*.d.ts",
+      "default": "./build/*.js"
+    }
+  },
+  "files": [
+    "bin/walkwright.js",
+    "build/**/*.d.ts",
+    "build/**/*.js",
+    "build/**/*.js.map",
+    "src/**/*.ts"
+  ],
+  "peerDependencies": {
+    "@playwright/test": ">=1.55.0",
+    "zod": "^4.1.0"
+  },
+  "devDependencies": {
+    "@playwright/test": "1.62.1",
+    "@types/node": "24.13.3",
+    "tsup": "8.5.1",
+    "typescript": "5.9.3",
+    "zod": "4.4.3"
+  },
+  "sideEffects": false,
+  "scripts": {
+    "build": "tsup",
+    "typecheck": "tsc -p tsconfig.json --noEmit"
+  }
+}

package/src/aria.ts

@@ -0,0 +1,326 @@
+import type { Locator, Page } from "@playwright/test";
+
+import type { LazyLocator, Mount } from "./locator.js";
+import {
+  button,
+  listbox,
+  menu as menuRole,
+  menuitem,
+  option as optionLeaf,
+  radio as radioLeaf,
+  radiogroup,
+  resolveLocator,
+  tab as tabLeaf,
+  tabpanel as tabpanelLeaf,
+  textbox,
+} from "./locator.js";
+import type {
+  AnySurface,
+  Component,
+  Overlay,
+  OverlayFactory,
+  Rooted,
+  RootedComponent,
+  Surface,
+  SurfaceInstance,
+} from "./pom.js";
+import { defineComponent, defineDialog, defineOverlay, rootOf } from "./pom.js";
+
+export interface Menu<Action extends string> extends Overlay<{
+  item: (action: Action) => Locator;
+}> {
+  choose: (action: Action) => Promise<void>;
+}
+
+export interface MenuFactory {
+  <Action extends string>(
+    name: string | RegExp,
+    options?: { label?: string },
+  ): OverlayFactory<Menu<Action>>;
+  parameterized: true;
+}
+
+function labelOf(name: string | RegExp, label: string | undefined): string {
+  if (label !== undefined) {
+    return label;
+  }
+
+  if (typeof name === "string") {
+    return name;
+  }
+
+  throw new Error(
+    `the ${name.source} menu needs a label: its name is a pattern`,
+  );
+}
+
+export const menu = defineOverlay(
+  (name: string | RegExp, options?: { label?: string }) => ({
+    root: menuRole(name),
+    recorder: { label: labelOf(name, options?.label) },
+    elements: {
+      item: (action: string): LazyLocator => menuitem(action),
+    },
+    actions: {
+      async choose(action: string): Promise<void> {
+        await this.open();
+        await this.elements.item(action).click();
+        await this.waitFor("hidden");
+      },
+    },
+  }),
+) as unknown as MenuFactory;
+
+async function selectTab(tab: Locator): Promise<void> {
+  if ((await tab.getAttribute("aria-selected")) !== "true") {
+    await tab.click();
+  }
+}
+
+export interface TabsElements<N extends string> {
+  names: () => readonly N[];
+  tab: (n: N) => LazyLocator;
+  tabPanel: (n: N) => LazyLocator;
+  select: (n: N) => (scope: Mount) => Promise<void>;
+}
+
+export const tabs = <const N extends string>(
+  names: readonly N[],
+): TabsElements<N> => ({
+  names: (): readonly N[] => names,
+  tab: (n: N): LazyLocator => tabLeaf(n),
+  tabPanel: (n: N): LazyLocator => tabpanelLeaf(n),
+  select:
+    (n: N) =>
+    async (scope: Mount): Promise<void> => {
+      await selectTab(resolveLocator(scope, tabLeaf(n).chain));
+      await resolveLocator(scope, tabpanelLeaf(n).chain).waitFor();
+    },
+});
+
+export type RadioGroup<Option extends string> = RootedComponent<
+  { radio: (option: Option) => Locator },
+  { select: (option: Option) => Promise<void> }
+>;
+
+export interface RadioGroupFactory {
+  <Option extends string>(name: string): Surface<RadioGroup<Option>>;
+  parameterized: true;
+}
+
+export const radioGroup = defineComponent((name: string) => ({
+  root: radiogroup(name),
+  elements: {
+    radio: (option: string): LazyLocator => radioLeaf(option),
+  },
+  actions: {
+    async select(option: string): Promise<void> {
+      await this.elements.radio(option).check();
+    },
+  },
+})) as unknown as RadioGroupFactory;
+
+const comboboxOptions = defineOverlay({
+  root: listbox(),
+  recorder: { label: "Options" },
+  elements: {
+    option: (name: string): LazyLocator => optionLeaf(name),
+  },
+});
+
+export type ComboboxOptions<Value extends string> = Overlay<{
+  option: (value: Value) => Locator;
+}>;
+
+export type SelectCombobox<Value extends string> = RootedComponent<
+  { options: ComboboxOptions<Value> },
+  { ensureSelected: (value: Value) => Promise<void> }
+>;
+
+export type SelectComboboxFactory = <Value extends string>(
+  scope: LazyLocator,
+) => Surface<SelectCombobox<Value>>;
+
+export const selectCombobox = defineComponent({
+  elements: {
+    options: comboboxOptions,
+  },
+  actions: {
+    async ensureSelected(value: string): Promise<void> {
+      await rootOf(this).click();
+      await this.elements.options.elements.option(value).click();
+    },
+  },
+}) as unknown as SelectComboboxFactory;
+
+export type MultiCombobox<Value extends string> = RootedComponent<
+  {
+    options: ComboboxOptions<Value>;
+    selectedTag: (value: Value) => Locator;
+  },
+  {
+    ensureSelected: (
+      values: readonly Value[],
+      allValues?: readonly Value[],
+    ) => Promise<void>;
+  }
+>;
+
+export interface MultiComboboxFactory {
+  <Value extends string>(
+    selectedTag: (value: Value) => LazyLocator,
+  ): (scope: LazyLocator) => Surface<MultiCombobox<Value>>;
+  parameterized: true;
+}
+
+export const multiCombobox = defineComponent(
+  (selectedTag: (value: string) => LazyLocator) => ({
+    elements: {
+      options: comboboxOptions,
+      selectedTag,
+    },
+    actions: {
+      async ensureSelected(
+        values: readonly string[],
+        allValues: readonly string[] = [],
+      ): Promise<void> {
+        const root = rootOf(this);
+        const { options, selectedTag } = this.elements;
+
+        await root.click();
+
+        for (const value of values) {
+          const option = options.elements.option(value);
+          if ((await option.getAttribute("aria-selected")) !== "true") {
+            await option.click();
+          }
+        }
+
+        await root.press("Escape");
+
+        for (const value of values) {
+          await selectedTag(value).waitFor();
+        }
+
+        for (const value of allValues.filter((it) => !values.includes(it))) {
+          const tag = selectedTag(value);
+          if (!(await tag.isVisible())) {
+            continue;
+          }
+
+          await root.click();
+          await options.elements.option(value).click();
+          await root.press("Escape");
+          await tag.waitFor({ state: "hidden" });
+        }
+      },
+    },
+  }),
+) as unknown as MultiComboboxFactory;
+
+export const freeCombobox = defineComponent({
+  actions: {
+    async ensureSelected(values: readonly string[]): Promise<void> {
+      const root = rootOf(this);
+
+      for (const value of values) {
+        await root.fill(value);
+        await root.press("Enter");
+      }
+
+      await root.press("Escape");
+    },
+  },
+});
+
+export type Disclosure<Panel = Locator> = Component<
+  { trigger: Locator; panel: Panel },
+  { expand: () => Promise<void>; collapse: () => Promise<void> }
+>;
+
+export interface DisclosureFactory {
+  (trigger: LazyLocator, panel: LazyLocator): Surface<Disclosure>;
+  <I extends SurfaceInstance>(
+    trigger: LazyLocator,
+    panel: LazyLocator,
+    contents: Surface<I>,
+  ): Surface<Disclosure<I & Rooted>>;
+}
+
+export const disclosure = ((
+  trigger: LazyLocator,
+  panel: LazyLocator,
+  contents?: AnySurface,
+): AnySurface => {
+  const within = panel.within(trigger);
+
+  return defineComponent({
+    elements: {
+      trigger,
+      panel: contents === undefined ? within : contents(within),
+    },
+    actions: {
+      async expand(): Promise<void> {
+        const { trigger } = this.elements;
+        const expanded = trigger.and(
+          this.page.locator('[aria-expanded="true"]'),
+        );
+        const collapsed = trigger.and(
+          this.page.locator('[aria-expanded="false"]'),
+        );
+
+        await expanded.or(collapsed).waitFor();
+
+        if ((await expanded.count()) > 0) {
+          return;
+        }
+
+        await trigger.click();
+        await expanded.waitFor();
+      },
+      async collapse(): Promise<void> {
+        const { trigger } = this.elements;
+        const expanded = trigger.and(
+          this.page.locator('[aria-expanded="true"]'),
+        );
+        const collapsed = trigger.and(
+          this.page.locator('[aria-expanded="false"]'),
+        );
+
+        await expanded.or(collapsed).waitFor();
+
+        if ((await collapsed.count()) > 0) {
+          return;
+        }
+
+        await trigger.click();
+        await collapsed.waitFor();
+      },
+    },
+  });
+}) as unknown as DisclosureFactory;
+
+export const confirmDelete = defineDialog(
+  (def: {
+    name: string;
+    confirmLabel: string;
+    cancelLabel: string;
+    confirmed?: (page: Page) => Promise<void>;
+  }) => ({
+    name: def.name,
+    close: { button: button(def.cancelLabel) },
+    elements: {
+      confirmTextbox: textbox(def.confirmLabel),
+      deleteButton: button(def.name),
+      cancelButton: button(def.cancelLabel),
+    },
+    actions: {
+      async confirm(name: string): Promise<void> {
+        await this.elements.confirmTextbox.fill(name);
+        await this.elements.deleteButton.click();
+        await this.root.waitFor({ state: "hidden", timeout: 15_000 });
+        await def.confirmed?.(this.page);
+      },
+    },
+  }),
+);

package/src/browser.ts

@@ -0,0 +1,15 @@
+export function hideStyle(selectors: string[]): string | undefined {
+  if (selectors.length === 0) {
+    return undefined;
+  }
+
+  const css = selectors
+    .map((selector) => `${selector}{display:none;}`)
+    .join("");
+
+  return `document.addEventListener("DOMContentLoaded", () => {
+  const style = document.createElement("style");
+  style.textContent = ${JSON.stringify(css)};
+  document.head.append(style);
+});`;
+}