[2.9.4] Improve /work command screenshot documentation
- Made capturing screenshots REQUIRED for any UI changes - Updated to use imgup skill with pixhost as default host - Clarified what to capture: new screens, before/after, Figma matches - Removed outdated curl/0x0.st reference 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "compound-engineering",
|
"name": "compound-engineering",
|
||||||
"version": "2.9.3",
|
"version": "2.9.4",
|
||||||
"description": "AI-powered development tools. 24 agents, 19 commands, 11 skills, 2 MCP servers for code review, research, design, and workflow automation.",
|
"description": "AI-powered development tools. 24 agents, 19 commands, 11 skills, 2 MCP servers for code review, research, design, and workflow automation.",
|
||||||
"author": {
|
"author": {
|
||||||
"name": "Kieran Klaassen",
|
"name": "Kieran Klaassen",
|
||||||
|
|||||||
@@ -5,6 +5,12 @@ All notable changes to the compound-engineering plugin will be documented in thi
|
|||||||
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
|
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
|
||||||
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
||||||
|
|
||||||
|
## [2.9.4] - 2025-12-08
|
||||||
|
|
||||||
|
### Changed
|
||||||
|
|
||||||
|
- **`/work` command** - Improved screenshot documentation for PR creation. Made capturing screenshots REQUIRED for any UI changes. Updated to use `imgup` skill with `pixhost` as default host (no API key needed). Clarified what to capture: new screens, before/after for modifications, and Figma design matches.
|
||||||
|
|
||||||
## [2.9.3] - 2025-12-05
|
## [2.9.3] - 2025-12-05
|
||||||
|
|
||||||
### Changed
|
### Changed
|
||||||
|
|||||||
@@ -172,32 +172,35 @@ This command takes a work document (plan, specification, or todo file) and execu
|
|||||||
)"
|
)"
|
||||||
```
|
```
|
||||||
|
|
||||||
2. **Capture Screenshots for UI Changes** (if applicable)
|
2. **Capture and Upload Screenshots for UI Changes** (REQUIRED for any UI work)
|
||||||
|
|
||||||
For any design changes, new views, or UI modifications:
|
For **any** design changes, new views, or UI modifications, you MUST capture and upload screenshots:
|
||||||
|
|
||||||
|
**Step 1: Start dev server** (if not running)
|
||||||
```bash
|
```bash
|
||||||
# Start the dev server if not already running
|
|
||||||
bin/dev # Run in background
|
bin/dev # Run in background
|
||||||
|
|
||||||
# Use Playwright to take screenshots at mobile width (320px)
|
|
||||||
# Navigate to relevant pages and capture before/after states
|
|
||||||
```
|
```
|
||||||
|
|
||||||
Using Playwright MCP tools:
|
**Step 2: Capture screenshots with Playwright MCP tools**
|
||||||
- `browser_resize` to set mobile viewport (320x568 or similar)
|
|
||||||
- `browser_navigate` to go to affected pages
|
- `browser_navigate` to go to affected pages
|
||||||
- `browser_snapshot` to check page state
|
- `browser_resize` to set viewport (desktop or mobile as needed)
|
||||||
|
- `browser_snapshot` to verify page state
|
||||||
- `browser_take_screenshot` to capture images
|
- `browser_take_screenshot` to capture images
|
||||||
|
|
||||||
Then upload screenshots using the imgup skill:
|
**Step 3: Upload using imgup skill**
|
||||||
```bash
|
```bash
|
||||||
# Upload to 0x0.st (recommended, no API key needed)
|
skill: imgup
|
||||||
curl -F "file=@screenshot-before.png" https://0x0.st
|
# Then upload each screenshot:
|
||||||
curl -F "file=@screenshot-after.png" https://0x0.st
|
imgup -h pixhost screenshot.png # pixhost works without API key
|
||||||
|
# Alternative hosts: catbox, imagebin, beeimg
|
||||||
```
|
```
|
||||||
|
|
||||||
Include the URLs in your PR description.
|
**What to capture:**
|
||||||
|
- **New screens**: Screenshot of the new UI
|
||||||
|
- **Modified screens**: Before AND after screenshots
|
||||||
|
- **Design implementation**: Screenshot showing Figma design match
|
||||||
|
|
||||||
|
**IMPORTANT**: Always include uploaded image URLs in PR description. This provides visual context for reviewers and documents the change.
|
||||||
|
|
||||||
3. **Create Pull Request**
|
3. **Create Pull Request**
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user