Self-updating screenshots
## TLDR
- Jelly's help centre uses a Rake task with headless Chrome (Capybara + Cuprite) to auto-capture and update every doc screenshot at build time.
## Key Takeaways
- Screenshot instructions live as HTML comments in Markdown: ``, keeping spec and image colocated.
- Three capture modes: `element` (CSS selector), `full_page` (optionally cropped), `viewport`; plus `click`, `wait`, `hide`, and `torn` options for complex UI states.
- The `click` option is the high-leverage feature: it captures states behind popovers, modals, and buttons that headless navigation alone cannot reach.
- `rails manual:build` runs the full pipeline: captures all screenshots, then compiles Markdown into ERB views with breadcrumbs and section nav.
- Colocating docs with feature code means screenshots can be committed in the same PR as the UI change, eliminating drift entirely.
## Hacker News Comment Review
- Commenters broadly extended the pattern: Nix derivations, Fastlane for mobile app store screenshots across screen sizes and localizations, and agent-driven headless CLIs for game UIs all apply the same capture-at-build-time principle.
- A real risk surfaced: screenshots update automatically but prose does not. If a menu is renamed from "Options > Customize" to "Preferences > Advanced", the image reflects new labels while the text still says the old ones, creating a harder-to-spot inconsistency.
- Multiple mobile commenters noted that code blocks on the article page overflow and become unreadable on small screens due to missing `overflow-x: scroll`.
### Notable Comments
- [@CyberShadow](https://news.ycombinator.com/item?id=47916766): Uses a Nix `.#screenshots` derivation for the same idea; also generates light/dark theme pairs and swaps them via `
