Agent skill

visual-verification

Visually verify implemented features work correctly before marking complete. Use when testing UI changes, verifying web features, or checking user flows work in the browser.

View SKILL.md on GitHub Repository
Stars 13
Forks 1

Install this agent skill to your Project

npx add-skill https://github.com/gruckion/marathon-ralph/tree/main/skills/visual-verification

SKILL.md

Visual Verification

Verify implemented features work correctly through actual user interaction, not just automated tests.

When to Use

  • After implementing any UI feature
  • Before marking an issue as complete
  • When acceptance criteria involve user-visible behavior
  • After fixing UI bugs

Approaches

Web Applications: See browser-verification.md for Playwright MCP workflow.

Mobile Applications: See mobile-verification.md (Coming soon)

Verification Checklist

Before marking any UI task complete:

  • Dev server is running and accessible
  • Feature renders without console errors
  • Elements render correctly and do not incorrectly overlap
  • User interactions work as expected
  • Edge cases handled (empty states, loading, errors)
  • Screenshot captured as evidence

What NOT to Do

  • Skip visual verification because "tests pass"
  • Mark issues complete without browser testing
  • Assume dev mode catches all errors (run npm run build too)
  • Test only happy paths

Recommended Agent Skills

Expand your agent's capabilities with these related and highly-rated skills.

gruckion/marathon-ralph

project-detection

Detects project type, package manager, and monorepo structure. Returns correct commands for test/build/lint/dev. Run at project initialization and cache results in state. Use before running any build/test commands.

13 1
Explore
gruckion/marathon-ralph

setup-playwright

Configure Playwright for E2E testing. Use when setting up end-to-end tests, when no E2E framework is detected, or when the user asks to configure browser testing.

13 1
Explore
gruckion/marathon-ralph

update-state

Programmatically update marathon-ralph state file using deterministic jq commands. Use this instead of manually editing the JSON file.

13 1
Explore
gruckion/marathon-ralph

setup-vitest

Configure Vitest for unit and integration testing. Use when setting up a test framework, when no test runner is detected, or when the user asks to configure testing.

13 1
Explore
gruckion/marathon-ralph

write-playwright-test

Write Playwright E2E tests using fixtures and best practices. Use when creating E2E tests, writing browser automation tests, or testing user flows.

13 1
Explore
gruckion/marathon-ralph

sqlite

13 1
Explore

Didn't find tool you were looking for?

Be as detailed as possible for better results