paveg/browser-e2e-test
dot_claude/skills/browser-e2e-test/SKILL.md
E2E testing workflow for web applications using Chrome in Claude. Automates functional testing, bug detection, and GitHub Issue creation. Use when: (1) running functional tests on web apps, (2) verifying staging/production behavior, (3) finding bugs and creating Issues, (4) capturing UI behavior with screenshots
$ install --global
skillsauthnpx skillsauth add paveg/dots browser-e2e-testInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: Apr 16, 2026, 4:50 AM4.4s2 files scanned
SKILL.md
- name:
- browser-e2e-test
- description:
- |
- Use when:
- (1) running functional tests on web apps, (2) verifying staging/production behavior,
Browser E2E Test
E2E testing workflow for web applications using Chrome in Claude.
Workflow
1. Setup
1. tabs_context_mcp to get browser context
2. tabs_create_mcp to create a new test tab
3. Confirm project structure (root, API endpoints)
4. TodoWrite to create a test plan
2. Test Execution
For each feature under test:
1. navigate to the page
2. wait (2s) for page load
3. screenshot to capture current state
4. read_page (filter: interactive) to get actionable elements
5. Prefer click-and-type over form_input (especially for textareas)
6. After each field input, read back all visible field values to verify no unintended changes
7. screenshot to capture result
8. read_network_requests to check API responses
9. read_console_messages (onlyErrors: true) to check for errors
3. Issue Recording
When a problem is found:
- Record API status codes (especially 4xx, 5xx)
- Record console errors
- Record reproduction steps
- Record screenshot IDs
4. Issue Creation
Create a GitHub Issue for each discovered problem via gh issue create.
See references/issue-template.md for the template.
Chrome in Claude Tips
Page Interaction
- Use
read_pagewithfilter: interactiveto get only buttons/links/inputs - Use
refparameter for click targets (more stable than coordinates) - Use
hoverto reveal elements that only appear on hover
Debugging
read_network_requestscaptures requests made after the first callread_console_messagesworks the same way — call it early to start capturing- Filter by API pattern:
urlPattern: "/api/"
Caveats
- Avoid triggering alert dialogs (they block all interaction)
- Always use tab IDs from fresh tabs_context_mcp calls
- Add appropriate
waitafter interactions
Cleanup
After testing is complete:
- Delete any test data created during the session
- Mark all TodoWrite tasks as complete
- Output a test results summary
Related Skills
paveg/empirical-prompt-tuning
development
VerifiedTrustedCommunity
Iteratively improve agent-facing text instructions (skills, slash commands, task prompts, CLAUDE.md sections, code-generation prompts) by having a bias-free executor run them and evaluating from both sides (executor self-report + caller-side metrics). Repeat until improvement plateaus. Use immediately after creating or significantly revising a skill/prompt, or when unexpected agent behavior is suspected to stem from ambiguous instructions.
3SKILL.mdUpdated Apr 21, 2026
paveg/x-post-craft
development
VerifiedTrustedCommunity
Create viral X/Twitter posts based on the official X algorithm (Phoenix/Grok). Generates and improves posts optimized for maximum engagement. Use when (1) creating X posts for products, services, or information, (2) improving existing post drafts, (3) designing thread structures for long content.
3SKILL.mdUpdated Apr 16, 2026
paveg/ui-design-standards
development
VerifiedTrustedCommunity
UI design quality standards and principles for frontend implementation and code review. Use when (1) implementing UI from design specs or mockups, (2) reviewing frontend/UI code, (3) creating new UI components, (4) building user interfaces for web or mobile apps. Complements frontend-design skills with quality enforcement.
3SKILL.mdUpdated Apr 16, 2026
paveg/trend-arbitrage
testing
VerifiedTrustedCommunity
End-to-end workflow for finding content, app, service, or product opportunities where search demand is high but quality supply is low (trend arbitrage). Use when: finding content gaps, keyword opportunities, niche research, analyzing whether a topic or idea is worth pursuing, or competitive gap analysis.
3SKILL.mdUpdated Apr 16, 2026