القائمة
Review Wavecraft UI changes for practical accessibility quality (semantic HTML, keyboard/focus behavior, contrast, ARIA, reduced motion) and provide fix-ready findings.
التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.
استنادا إلى تصنيف SOC المهني
Visual UI testing using Playwright MCP to interact with the Wavecraft web UI. Use this skill when testing UI components, verifying visual appearance, taking screenshots, or validating UI behavior that requires browser interaction. Requires the dev server running (cargo xtask dev).
Create new processor UI components in @wavecraft/components with default scope (component, unit test, typecheck, index exports), processorId-derived IDs, and targeted validation.
Execute required visual UI validation using VS Code integrated browser (Simple Browser) with screenshot evidence recorded in test-plan.md.
Creates a Pull Request using GitHub CLI with a PR summary file. Generates PR-summary.md in the feature-specs folder to avoid terminal pasting issues.
Ensure Wavecraft UI changes use existing design tokens and reusable patterns instead of ad-hoc values, with a fast normalization checklist for spacing, color, typography, and states.
Execute Wavecraft UI/UX changes through a practical end-to-end flow: discovery, proposal, implementation, verification, and handoff with minimal-scope commits.
| name | ui-accessibility-review |
| description | Review Wavecraft UI changes for practical accessibility quality (semantic HTML, keyboard/focus behavior, contrast, ARIA, reduced motion) and provide fix-ready findings. |
Use this skill to run a focused accessibility review for React/TypeScript/Tailwind changes in ui/ and sdk-template/ui/.
docs/feature-specs/_archive/**.docs/roadmap.md (PO-owned).docs/architecture/coding-standards.mddocs/architecture/coding-standards-typescript.mddocs/architecture/coding-standards-css.mddocs/architecture/coding-standards-testing.mdui/ and sdk-template/ui/.button, label, nav, main, headings in logical order).aria-label, or aria-labelledby).prefers-reduced-motion) for transitions/animations.div/span instead of button/aaria-hidden on focusable nodes, invalid role/state pairings)