docs(workflow): add mandatory playwright screenshot workflow for visual changes #46
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
…al changes Add comprehensive documentation for capturing before/after screenshots of CSS/styling changes using Playwright. This workflow ensures all visual changes can be reviewed by the team without running the application locally. Key additions: - Step-by-step Playwright screenshot capture process - Chrome browser requirement for consistency - PR comment upload instructions (screenshots not committed to git) - Updated PR checklist to emphasize visual documentation requirement This workflow will help maintain visual quality and enable better async code review for UI/UX changes.
|
Failed to generate code suggestions for PR |
luandro
force-pushed
the
feat/playwright-workflow-docs
branch
from
130b87d to
7e7032c
Compare
…al changes Add comprehensive documentation and tooling for the Playwright screenshot workflow that must be followed for all CSS/styling changes. Documentation Changes (AGENTS.md): - Step-by-step visual changes workflow - Automated script usage examples - CRITICAL warning: screenshots must NEVER be committed to git - Clear instructions for manual PR comment uploads - GitHub CLI limitation explanation Tooling: - Reusable screenshot capture script with CLI arguments - Multiple viewport presets (mobile, tablet, desktop, wide) - Element-specific or full-page screenshots - Flexible output options Safety: - Added screenshots/ to .gitignore to prevent accidental commits - Explicit reminder to delete screenshots after PR upload - Documentation emphasizes screenshots are ONLY for PR review This enables async visual review without running the app locally while preventing screenshot bloat in git history.
luandro
force-pushed
the
feat/playwright-workflow-docs
branch
2 times, most recently
from
845821f to
fdc122f
Compare
Add mandatory verification step before saving PR comments with screenshots: - MUST preview screenshots before saving comment - Verify images display correctly (not 404/broken) - Re-upload if broken, only save after visual confirmation This prevents publishing broken screenshot links that show 'Page not found', which happened when attempting automated upload methods. Key lesson: GitHub does NOT support programmatic image uploads. Manual drag-and-drop with preview verification is the ONLY reliable method.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
Adds comprehensive documentation for the Playwright screenshot workflow that must be followed for all CSS/styling changes. This enables the team to review visual changes without running the application locally.
Changes
Why This Matters
Workflow Overview
Testing
Priority
🚀 Ready to merge ASAP - This unblocks all other branches from using the visual review workflow without waiting for specific feature PRs to complete QA.