feat(registry): add playwright capability group (6 TS browser fns)
New domain `browser` under frontend/functions/ with 6 Playwright helpers: - pw_launch_browser: chromium + context + page bootstrap with storageState support and baseUrl navigation. - pw_kanban_login: authenticates a Page against /api/auth/login; sets the kanban_session cookie via shared storageState; verifies login page no longer visible after navigation. - pw_drag_drop: human-like pointer drag (mousedown + activateOffset + stepped move + mouseup) compatible with @dnd-kit/core's 8px activation threshold; supports hoverMs for time-based dropzones. - pw_keyboard_sequence: ordered focus/type/press/wait steps for scripting realistic input flows (typing then arrow-key navigating autocompletes). - pw_wait_predicate: thin wrapper over page.waitForFunction with friendlier defaults and custom error messages. - pw_assert_class: poll-based assertion that a Locator has/lacks a CSS class within a timeout; useful for visual-state checks. Each function ships with vitest tests (5-8 cases each) covering both happy and error paths, plus self-documenting .md (Ejemplo + Cuando usarla + Gotchas + frontmatter with params/output schema). Adds frontend/functions/package.json with `"type": "module"` so consumers can ESM-import the .ts files from anywhere in the registry (Playwright's tsx loader respects nearest package.json). Capability page docs/capabilities/playwright.md documents the group with a canonical end-to-end example, frontiers, prerequisites, and gotchas. Index updated. First consumer (issue 0088): apps/kanban requester-input.spec.ts. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,50 @@
|
||||
import type { Page } from "playwright";
|
||||
|
||||
/**
|
||||
* A single step in a keyboard interaction sequence.
|
||||
*
|
||||
* - `focus` — focuses a DOM element via CSS selector.
|
||||
* - `type` — types text character by character with a humanlike delay.
|
||||
* - `press` — sends a single named key (e.g. "ArrowDown", "Enter", "Escape", "Tab").
|
||||
* - `wait` — pauses execution for the given number of milliseconds.
|
||||
*/
|
||||
export type KbStep =
|
||||
| { kind: "focus"; selector: string }
|
||||
| { kind: "type"; text: string; delayMs?: number }
|
||||
| { kind: "press"; key: string }
|
||||
| { kind: "wait"; ms: number };
|
||||
|
||||
/**
|
||||
* pw_keyboard_sequence — executes an ordered sequence of keyboard interactions on a Playwright Page.
|
||||
*
|
||||
* Use to script realistic input flows such as typing into an autocomplete field and then
|
||||
* navigating its dropdown with arrow keys before pressing Enter.
|
||||
*/
|
||||
export async function pw_keyboard_sequence(
|
||||
page: Page,
|
||||
sequence: KbStep[]
|
||||
): Promise<void> {
|
||||
for (const step of sequence) {
|
||||
switch (step.kind) {
|
||||
case "focus":
|
||||
await page.locator(step.selector).first().focus();
|
||||
break;
|
||||
case "type":
|
||||
await page.keyboard.type(step.text, { delay: step.delayMs ?? 30 });
|
||||
break;
|
||||
case "press":
|
||||
await page.keyboard.press(step.key);
|
||||
break;
|
||||
case "wait":
|
||||
await page.waitForTimeout(step.ms);
|
||||
break;
|
||||
default: {
|
||||
// TypeScript exhaustiveness check — will also throw at runtime for JS callers.
|
||||
const _exhaustive: never = step;
|
||||
throw new Error(
|
||||
`pw_keyboard_sequence: unknown step kind "${(step as KbStep & { kind: string }).kind}"`
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user