# Preview Environments

Preview environments let Baz open your UI in a sandboxed browser, validate the ticket’s requirements, collect screenshots, and run full Spec Reviews.\
Without a working preview environment, Baz agents will fall back on a Spec Review focused on Code <> Ticket <> Design alignment.

This guide explains **what you need**, **how to connect it**, and **how to give Baz the correct preview URL** so everything works end-to-end.

### 1. What is a preview environment?

A preview environment is an internet-accessible instance of your deployed application for a specific pull request or branch.\
Examples:

* `https://cr-123.yourcompany.com`
* `https://vercel.app/pr-77`
* `https://feature-branch.preevy.dev`

Baz uses this environment to:

* Load your UI via Playwright
* Validate the behavior against the ticket
* Take screenshots of met/unmet requirements.

### 2. What *you* need to provide

To make preview environments work with Baz, you need:

#### &#x20;1. A deployable preview environment per PR

This can come from any platform:

* **Vercel Deploy Previews**
* **Netlify Preview Deploys**
* **GitHub Actions + Docker + any hosting**
* **Internal preview clusters** (if publicly accessible)

#### 2. That preview environment must be reachable

Baz must be able to reach the URL from the public internet.

If your preview is behind a VPN or corporate firewall, you must allowlist Baz’s 3 outbound IPs:

```
18.190.165.140
3.20.124.148
3.12.220.91
```

#### 3. Any required login credentials

If users must log in to see your app, Baz needs those credentials.

You configure them inside:\
**Settings → Integrations → Preview Environment**

### 3. Connecting your preview environment in Baz

#### Step 1 — Open the integration panel

In Baz:\
**Settings → Integrations → Preview Environment → Configure**

#### Step 2 — Enter the login credentials

This is only needed if your preview app is gated behind basic auth or a simple login screen.

* **User:** the username Baz should log in with
* **Password:** the password for that user

Click **Connect**.

If the credentials are valid, you’ll see the “Connected” state:

### 4. How Baz learns the preview URL

**You must give Baz agents the URL of the preview environment in the context of the pull request.**

Ideally, you do this by posting a comment on the GitHub PR.

#### Option A — Your CI posts the URL automatically

This is the recommended approach.\
After deployment, CI adds a comment like:

```md
### Preview environment is ready
https://cr-1234.yourcompany.com
```

Baz reads this comment, validates the URL, logs in if needed, and starts Spec Review.

#### Option B — You paste the URL manually

You can also comment manually on the PR:

<pre><code><strong>Baz run spec review. Preview URL: https://cr-4567.dev.myapp.com
</strong></code></pre>

Baz will detect it and run automatically.

## FAQ

<details>

<summary>Where do I get the “preview env URL”?</summary>

From your deployment system, not from Baz.\
Examples: Vercel/Netlify preview deploys, Preevy.dev links, a URL printed by your CI, or a hostname from your internal preview cluster. Once you have that URL, paste it in a PR comment (or have CI post it) and Baz will pick it up.

</details>

<details>

<summary>How do I change or remove the preview environment integration?</summary>

Go to Settings → Integrations → Preview Environment → Configure and overwrite the user/password if they changed. If you need the integration fully removed (for example, wrong env or org), contact Baz support; the UI will support delete soon.

</details>

<details>

<summary>How do I know everything is set up correctly?</summary>

Use this quick checklist:

* You can deploy your app to a public preview URL (or Baz’s IPs are allowlisted).
* You’ve configured preview-env credentials in Settings → Integrations → Preview Environment (if needed).
* Your CI or a developer posts the preview URL as a PR comment.

When these are in place, Baz will open the URL, authenticate, run Spec Reviewer, and add a report back to the PR.

</details>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.baz.co/basics/integrations/preview-environments.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.