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,45 @@
|
||||
import type { Page } from "playwright";
|
||||
|
||||
/** Options for pw_wait_predicate. */
|
||||
export interface PwWaitOptions {
|
||||
/** Maximum time to wait in milliseconds. Default: 5000 */
|
||||
timeoutMs?: number;
|
||||
/** Polling interval in milliseconds. Default: 100 */
|
||||
pollMs?: number;
|
||||
/** Argument passed to the predicate function in the page context. */
|
||||
arg?: unknown;
|
||||
/** Custom error message prepended to the timeout error. */
|
||||
message?: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* pw_wait_predicate — polls an arbitrary predicate inside the page context
|
||||
* until it returns truthy or the timeout elapses.
|
||||
*
|
||||
* Thin wrapper around `page.waitForFunction` with friendlier defaults and
|
||||
* optional custom error messages. More flexible than `waitForSelector` for
|
||||
* computed conditions such as "card has class .border-red" or "exactly 1
|
||||
* element is highlighted".
|
||||
*/
|
||||
export async function pw_wait_predicate<T = unknown>(
|
||||
page: Page,
|
||||
predicate: string | ((arg?: unknown) => unknown),
|
||||
opts: PwWaitOptions = {},
|
||||
): Promise<T> {
|
||||
const timeoutMs = opts.timeoutMs ?? 5000;
|
||||
const pollMs = opts.pollMs ?? 100;
|
||||
|
||||
try {
|
||||
const handle = await page.waitForFunction(predicate, opts.arg, {
|
||||
timeout: timeoutMs,
|
||||
polling: pollMs,
|
||||
});
|
||||
return handle.jsonValue() as Promise<T>;
|
||||
} catch (err) {
|
||||
if (opts.message) {
|
||||
const cause = err instanceof Error ? err : new Error(String(err));
|
||||
throw new Error(`${opts.message}: ${cause.message}`, { cause });
|
||||
}
|
||||
throw err;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user