Vercel integration

The Vercel integration automatically tests Vercel deployments, as well as tracking the performance and Lighthouse scores of your production site over time.

Vercel dashboard Lighthouse scores

Getting started

  1. Install the integration on Vercel
  2. Create a DebugBear account, or use an existing one
  3. Select a Vercel project to monitor

DebugBear will crawl your site and try to automatically set up monitoring for up to 3 pages. You can add customize these pages or add additional ones.

Go to the Vercel website to read the full guide on setting up performance testing for your Vercel project.

Branch builds

When you push a commit, DebugBear will compare it to the latest build on the master branch.

By default the build status will be neutral, but you can get pass/fail statuses by setting up performance budgets.

(Side note: expect your SEO score on the branch to be lower, as the preview build is blocked from indexing.)

DebugBear build status on Vercel dashboard

Reporting to GitHub

If you install the GitHub integration the build statuses will also be added to your GitHub pull requests.

DebugBear build statuses for Vercel deployments on Github

URL filter

By default, each time you deploy your site pages in your project with URLs matching project-name* or project-name* will be tested. However, you might want to exclude some sites, or use a custom deployment suffix. The URL filter setting allows you do that.

  1. Go to the project home page on DebugBear
  2. Select the Integrations tab
  3. Click the gear icon next to your Vercel integration
  4. Change the URL filter (the value will be saved when you leave the text field)

Page URL filter setting to customize what deployed pages to test

Branch filter

By default, every Vercel deployment in your project will be tested. This can result in a large number of tests being run, and you might want restrict testing to deployments on certain branches.

You can do this by specifying one or more branch names in the Branch Filter setting. Separate branch names with spaces, for example staging dev prod.

Still need help? Contact for support.
DebugBear is a website monitoring tool built for front-end developers. Track performance metrics and Lighthouse scores in CI and production. Learn more.
© 2020 DebugBear Ltd