Skip to content
Last updated on May 27, 2023
3 min read

Special Use Cases for Comments

Learn how to use and manage Comments in uncommon cases, like enabling and disabling comments for individual branches, using a CSP, and more.

Advanced comments management

Using the project settings menu is not the only way to enable or disable comments. This section teaches you how to toggle comments on or off for branches, enable them project-wide with environment variables, and more.

Enable or disable comments for branches

Enabling comments project-wide opens a new communication channel that could disrupt your current feedback and iteration workflow. Enabling or disabling comments on specific branches allows you to take advantage of comments while controlling when this new style of collaboration is possible.

Vercel allows you to set Preview environment variables, which can be scoped to individual branches or to all branches which generate previews.

To enable comments for an individual branch, add the following to the environment variables for the desired preview branch:

.env
VERCEL_PREVIEW_FEEDBACK_ENABLED=1

To disable comment for an individual branch, set the above environment variable's value to 0:

.env
VERCEL_PREVIEW_FEEDBACK_ENABLED=0

Enable or disable comments with environment variables

You can enable or disable comments project-wide with project environment variables. Navigate to your project's environment variables in your Vercel dashboard and add the VERCEL_PREVIEW_FEEDBACK_ENABLED variable.

Set its value to 1 if you want it enabled, or 0 if you want it disabled.

Disable comments temporarily

Our comments feature is designed to make iteration and development easier, so we've set it to automatically get out of your way when necessary. If your Preview Deployment is being tested in Google Lighthouse, or is visited by a bot or headless browser, the comments UI will not be injected into the DOM.

To opt out of comments while visiting a Preview Deployment, you can:

  • Select the Hide Interface or Disable for Session options in the comments menu toolbar. Doing so will hide the comments interface in the active browser tab. Opening the Preview Deployment in a new tab will restore the comments interface
  • Avoid interference with things like automated end-to-end tests by adding the x-vercel-skip-toolbar header to the request sent to the Preview Deployment URL. You can set the value to 1, but the value will not be read; sending this header at all will cause the comments toolbar to be disabled

Comments on main or master branches

Commenting is not currently supported on main or master branches. To use comments, you must open a pull request on a branch in your favorite Git provider.

Using a Content Security Policy

If you have a Content Security Policy (CSP) configured with your preview environment, you may need to adjust the CSP to enable access to Comments.

You can make one of the following adjustments to the Content-Security-Policy response header:

Note: You do not need to make these changes to your production environment. You can achieve this using Edge Middleware.
  • Add the following to script-src (Most commonly used):
  script-src https://vercel.live/ https://vercel.com 'unsafe-inline'
  • Add the following to connect-src:
  connect-src https://vercel.live/ https://vercel.com https://sockjs-mt1.pusher.com/ wss://ws-mt1.pusher.com/
  • Add the following to img-src:
  img-src https://vercel.live/ https://vercel.com https://sockjs-mt1.pusher.com/ data: blob:
  • Add the following to frame-src:
  frame-src https://vercel.live/ https://vercel.com

Using comments with a custom alias domain

To use comments with preview deployments that have custom alias domains, you must opt into comments explicitly in your project settings on the dashboard.

See our docs on enabling comments to learn more.