القائمة
Use when completing frontend or UI work that needs visual verification, before claiming the UI is correct
التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.
استنادا إلى تصنيف SOC المهني
Use when starting any conversation - establishes how to find and use skills, requiring skill invocation before ANY response including clarifying questions
Use when executing implementation plans with independent tasks in the current session
Use when you have a spec or requirements for a multi-step task, before touching code
Use when creating new skills, editing existing skills, or verifying skills work before deployment
Use when starting feature work that needs isolation from current workspace or before executing implementation plans - ensures an isolated workspace exists via native tools
Use when about to claim work is complete, fixed, or passing, before committing or creating PRs - requires running verification commands and confirming output before making any success claims; evidence before assertions always
| name | browser-testing |
| description | Use when completing frontend or UI work that needs visual verification, before claiming the UI is correct |
Never claim UI work is correct without visual evidence. Browser automation makes verification fast and produces artifacts the user can review.
Core principle: Evidence before assertions. Screenshots and DOM inspection prove correctness; text descriptions don't.
When to use: After implementing any UI or frontend changes, before claiming the work is correct.
| What to verify | Tool | Output |
|---|---|---|
| Visual appearance | Screenshot |  |
| DOM structure | Inspect elements | Element presence, attributes, classes |
| User flow | Recording | Embedded video in artifact |
| Responsive layout | Screenshot at viewport | Multiple screenshots at different widths |
| Mistake | Fix |
|---|---|
| Not waiting for page load before screenshot | Wait for key elements to be visible |
| Checking only one viewport size | Test at desktop (1280px) and mobile (375px) minimum |
| Visual-only verification (no DOM check) | Always inspect DOM structure — visual can hide broken markup |
| Forgetting to embed evidence | Every claim needs a screenshot or recording in the artifact |
| Saying "looks correct" without proof | Take the screenshot. Embed it. Let the user judge. |
Evidence classification in artifacts: Use GitHub-style alerts:
> [!TIP] for passing checks> [!CAUTION] for failing checks> [!NOTE] for observations that need human judgmentRecommend /browser to the user when UI verification is needed. This activates browser automation tools for the session.