Agent skill

SwiftUI Visual Verifier

Launch Leavn app in iOS simulator, navigate features using MCP browser tools, take screenshots, verify UI rendering and feature functionality

View SKILL.md on GitHub Repository
Stars 163
Forks 31

Install this agent skill to your Project

npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/data/swiftui-visual-verifier

SKILL.md

SwiftUI Visual Verifier

Instructions

Visually verify Leavn app features:

  1. Build and launch:

    bash
    make sim-run DEVICE="LeavnTest"

  2. Use browser MCP tools to interact:

    • browser_snapshot - Get accessibility tree
    • browser_click - Tap buttons/tabs
    • browser_take_screenshot - Capture UI
    • browser_type - Enter text in search
    • browser_wait_for - Wait for animations

  3. Test critical features:

    • Home tab: Feelings picker circle, daily verse card
    • Bible: Chapter rendering, search (type "love")
    • Community: Prayer wall, tabs
    • ShareVerse: Tap share, verify popover

  4. Visual checks:

    • No truncated text
    • Proper spacing/alignment
    • Correct colors/gradients
    • Smooth animations
    • Responsive layouts

  5. Create test report:

    • Feature: PASS/FAIL
    • Screenshots showing working features
    • List any visual bugs found

Use this skill when: Need visual verification, test features work, check UI rendering, verify user flows

Recommended Agent Skills

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

majiayu000/claude-skill-registry

agent-ops-spec

Manage specification documents in .agent/specs/. Use when user provides requirements, acceptance criteria, or feature descriptions that need to be tracked and validated against implementation.

163 31
Explore
majiayu000/claude-skill-registry

agent-ops-state

Maintain .agent state files. Use at session start, after meaningful steps, and before concluding: read/update constitution/memory/focus/issues/baseline consistently.

163 31
Explore
majiayu000/claude-skill-registry

agent-ops-spec

Manage specification documents in .agent/specs/. Use when user provides requirements, acceptance criteria, or feature descriptions that need to be tracked and validated against implementation.

163 31
Explore
majiayu000/claude-skill-registry

agent-ops-testing

Test strategy, execution, and coverage analysis. Use when designing tests, running test suites, or analyzing test results beyond baseline checks.

163 31
Explore
majiayu000/claude-skill-registry

agent-ops-testing

Test strategy, execution, and coverage analysis. Use when designing tests, running test suites, or analyzing test results beyond baseline checks.

163 31
Explore
majiayu000/claude-skill-registry

agent-ops-state

Maintain .agent state files. Use at session start, after meaningful steps, and before concluding: read/update constitution/memory/focus/issues/baseline consistently.

163 31
Explore

Didn't find tool you were looking for?

Be as detailed as possible for better results