Post-Deploy Visual Regression in n8n: Slack + GitHub

Catch visual regressions after every deploy—automatically notify Slack and open a GitHub issue

This n8n workflow runs a post-deploy visual comparison using Snapshot Site: it screenshots your baseline and newly deployed page, detects meaningful UI mismatches, alerts your team in Slack, and—when the regression crosses a defined threshold—creates a GitHub issue with the evidence.

What this workflow does

• Receives a post-deploy webhook (from your CI/CD pipeline) via an HTTP POST webhook containing the deployed page URL, baseline URL, plus optional commit and environment values.
• Waits for the page to settle for 45 seconds to allow CDN caches and client-side rendering to stabilize before taking screenshots.
• Compares baseline vs deployed using Snapshot Site Compare.
• Handles failures by detecting comparison failures (hard request errors or Snapshot Site soft errors) and sending an alert to your configured Slack channel.
• Calculates mismatch impact and checks whether the mismatch percentage exceeds a 10% threshold to classify a layout regression.
• Reports regressions with a detailed Slack message (including diff/before/after links) and opens a GitHub issue with the same evidence; otherwise it exits without action.

Use cases

• Prevent UI breakages in production by validating visual changes after each deployment.
• Speed up triage: send comparison failures and visual diffs directly to a Slack channel your team watches.
• Maintain an audit trail in GitHub by automatically filing issues when a visual regression surpasses the 10% threshold.

Technical details

• Nodes / integrations: Webhook, Wait (45s), if, no op, Slack, GitHub.
• Snapshot Site: requires the verified community node n8n-nodes-snapshot-site and Snapshot Site API credentials.
• GitHub: uses a personal access token with repo scope to create issues (repository owner/name configured in the step).
• Setup: configure Slack channels (e.g., #deploys for regressions and #deploys-alerts for comparison failures), activate the workflow, then copy the Webhook node Production URL for your CI/CD pipeline.