agentsclimarketplace
Sign in

Automate ui flows

Skill workingclassbuddha/codexmaxxing/skills/automate-ui-flows

Automate, inspect, and verify real UI flows in a browser. Use when Codex needs to open localhost or a web URL, click through an app, fill forms, reproduce UI bugs, verify browser behavior, capture screenshots, test responsive layouts, smoke-test Chrome extension side panels or popups, or produce UI evidence after frontend changes.From its SKILL.md

Install
npx -y skills add workingclassbuddha/codexmaxxing --skill automate-ui-flows

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

2 things to look at

  • 1 stars1 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
  • runs commandsInstructs the agent to run 1 command, including `scripts/browser_capture.mjs`.

SKILL.md

2.4 KB, 431 tokens by cl100k_base, as published. Nobody here has run it

Automate UI Flows

Use this skill to make UI verification concrete: browser state, screenshots, interaction evidence, console observations, and a short pass/fail handoff.

Tool Choice

  • Use the in-app Browser Use plugin when the user explicitly asks for @browser-use, "open localhost", "click", "inspect in the browser", or current-tab work.
  • Use Playwright or the bundled script when the flow should be repeatable, artifact-heavy, or checked across viewports.
  • Use existing repo test tooling when the repo already has Playwright, Cypress, Vitest browser mode, or an extension test harness.

Core Loop

  1. Start or confirm the dev server and exact URL.
  2. Open the page in a real browser.
  3. Snapshot the page before interacting.
  4. Drive the user's path with stable element refs or semantic selectors.
  5. Re-snapshot after navigation, modal changes, route changes, or dynamic content updates.
  6. Capture screenshots at the evidence point.
  7. Check desktop and mobile widths for layout regressions.
  8. Report what was verified, what failed, artifacts produced, and any untested risk.

Evidence Standard

  • Store artifacts under output/ui-evidence/ when the repo has no existing convention.
  • Capture at least one screenshot for visual UI work.
  • Include viewport size, URL, browser, and timestamp in any written evidence.
  • Note console errors, failed network requests, blocked assets, broken images, and inaccessible controls when observed.
  • Prefer semantic selectors and accessibility labels over coordinates.

Chrome Extension Notes

For extension flows, first identify the canonical repo and build output. Verify at least one of: popup opens, side panel opens, content script injects, options page loads, or background/service worker logs the expected path. Do not publish, sign, or touch store credentials unless explicitly requested.

Resources

  • Read references/flow-recipes.md for common browser, responsive, and extension flow patterns.
  • Use scripts/browser_capture.mjs for a quick Playwright screenshot and page summary when Playwright is available.

What ships with it: 3 files

4.1 KB alongside SKILL.md, 1 of them executable

agents/

references/

scripts/

Keep looking

Skills are one crate of 325,949. Ordering is by how many stacks a row turns up in, so the top of any crate is what has actually been picked rather than what has the most stars.