CONTENT CREATION

Flag Stale Docs Screenshots on Every UI Pull Request

On each pull request that touches UI code, captures the affected screens from a preview deployment, diffs them against the screenshots currently embedded in your docs.

CategoryContent Creation
Enginesim
Difficultyintermediate
Triggerevent
Steps5
Setup~15 min

How it runs

The automated pipeline, trigger to output.

  • TriggerUI pull request opened or updatedGitHubGitHub
  • LogicFilter to front-end changes with a preview URL
  • ActionCapture affected screens on Vercel previewBrowserbase
  • LogicDiff captures against published doc screenshots
  • OutputComment drifted images on the PRGitHubGitHub

What it does

It watches pull requests that modify front-end code, renders the relevant screens against the PR's preview deployment, and compares those captures to the screenshots referenced in your documentation. If a screen no longer matches its published image, it posts a single PR comment listing exactly which doc pages and images are now stale.

When to use it

Use it when your product UI changes faster than your docs and reviewers keep merging changes that silently invalidate screenshots. It turns "someone will notice eventually" into a reviewer-visible checklist on the PR itself.

How it works

  1. 1A pull request touching UI paths opens or updates, firing a GitHub webhook.
  2. 2A filter step confirms the diff includes front-end files and that a Vercel preview URL is available.
  3. 3Browserbase loads each mapped screen on the preview deployment and captures fresh screenshots.
  4. 4A compare step pixel-diffs each capture against the screenshot URL recorded for that screen in the docs manifest.
  5. 5For screens above the drift threshold, the workflow posts a GitHub PR comment naming each affected doc page and image so the author can regenerate before merge.

Set it up

What you configure once, before turning it on.

  1. 1
    Connect GitHubRepos, issues, pull requests, actions.
  2. 2
    Connect BrowserbaseHeadless browsers, sessions, replays.
  3. 3
    Connect VercelDeploys, runtime logs, analytics.
  4. 4
    Set each agent's modelWe leave models unset so you pick the tier — fast + cheap, or top-quality.
  5. 5
    Tune it to your dataEdit the prompts, filters, and field mappings so it matches how your team works.
  6. 6
    Test, then turn it onRun once against a sample, confirm the output, then enable the trigger.

Run this workflow in your colony.

14-day trial. No DevOps. No Sales call. Provisioned in under a minute.