DIF-014 — Cursor overlay for live browser view.
Injects an animated cursor dot, click ripple, and keystroke toast into the
page via page.evaluate(). The overlay is purely visual — it does not
interfere with test execution or DOM assertions.
Ported from the Assrt CURSOR_INJECT_SCRIPT pattern referenced in the
roadmap (DIF-014).
The script is re-injected after each navigation (via the page.on("load")
handler in executeTest.js) because page.evaluate() scripts do not
survive cross-document navigations.
- Source:
Example
import { injectCursorOverlay } from "./cursorOverlay.js";
await injectCursorOverlay(page);Methods
(static) injectCursorOverlay(page) → {Promise.<void>}
Inject the cursor overlay script into a Playwright page.
Creates:
- A small red dot that follows the mouse cursor (visible in CDP screencast).
- A click ripple animation that expands and fades on each click.
- A keystroke toast that briefly shows typed characters near the cursor.
All overlay elements use pointer-events: none and high z-index so they
never interfere with the page under test.
Parameters:
| Name | Type | Description |
|---|---|---|
page |
Object | Playwright Page instance. |
- Source:
Returns:
- Type
- Promise.<void>