# Preview & QA

URL: https://docs.ablyft.com/guides/experiments/preview-and-qa/

> Check variations, targeting and goals before an experiment goes live, and share previews with your team.



Before real visitors see an experiment, check it. ABlyft offers a **Preview mode** that shows an experiment only to
people who open a special link, and a **quality assurance (QA) tool** that shows which pages, experiments and goals are
active on a page.

## Start the preview mode

1. Open the experiment.
2. In the status controls at the top of the page, choose **Preview mode** and confirm.

The experiment now has the status **Preview** and a **Preview** box appears above the cards. An experiment in preview
behaves like a running one, but only visitors who activate the preview see it.

The experiment needs at least one variation, page and goal, see
[Before you can preview or start](https://docs.ablyft.com/guides/experiments/start-pause-stop/#before-you-can-preview-or-start).

## The Preview box

| Element                               | Description                                                                                                                                                                                                                 |
| ------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Variation to preview**              | The variation you want to see. By default the first variation that is not the baseline.                                                                                                                                     |
| **URL to preview**                    | The page to open. It starts with the example URL of the experiment. You can change it, for example to check another page.                                                                                                   |
| **Exclude other running experiments** | On by default. Other running experiments are then not shown during your preview, so they do not influence what you see. Switch it off to see how your experiment works together with the experiments that are already live. |
| **Open preview directly in browser**  | Opens the preview in a new tab.                                                                                                                                                                                             |
| **Open with quality assurance tool**  | Opens the preview with the QA tool. See [QA tool](#qa-tool).                                                                                                                                                                |
| QR code (**Scan to preview**)         | Scan it to preview on a phone or tablet.                                                                                                                                                                                    |
| **Preview/Sharing URL**               | The complete link. Copy it with the copy button and share it with colleagues.                                                                                                                                               |
| Camera icon (**Take screenshots**)    | Creates screenshots of the variation for desktop and/or mobile. Optionally dismiss cookie banners and capture the full page. Depending on your plan; otherwise ABlyft asks you to contact them.                             |

When you open the preview link, the page behaves as follows:

* You see the selected variation, regardless of traffic allocation and exclusion groups.
* For experiments in the status **Preview**, audiences are not checked, so you see the experiment even if you are not
  part of the audience. The experiment's pages and [environments](https://docs.ablyft.com/guides/audiences-and-delivery/environments/) must
  still match.
* Goals are **not** tracked and no results are collected from your preview visits.
* The preview stays active in your browser session, also when you move to other pages. Closing the tab or browser ends
  it.

> **Snippet required:** The preview works through the snippet. If the page does not contain the ABlyft snippet, nothing will change. See
> [Embed the snippet](https://docs.ablyft.com/developers/installation/snippet/).

## Preview links and URL parameters

The preview link is your example URL plus URL parameters that the snippet reads:

```text
https://example.com/product?ablyft_preview=12345678_98765432
```

The parameters are described in [URL parameters](https://docs.ablyft.com/developers/reference/url-parameters/): `ablyft_preview`
(`<experiment ID>_<variation ID>`), `ablyft_exclude_running` and `ablyft_qa_token`. ABlyft adds the last two
automatically when you switch off **Exclude other running experiments** or use **Open with quality assurance tool**.

To preview several experiments together, paste an existing preview link into **URL to preview**. The new link then
contains both combinations.

> **Treat the QA link with care:** The `ablyft_qa_token` is specific to your project. Share links with the QA tool only with people who may see your
> experiments' setup.

## QA tool

Open it with **Open with quality assurance tool**. A panel with the ABlyft logo appears on the page with three tabs.
It updates every second while you click through the page.

| Tab             | Shows                                                                                                                                                                 |
| --------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Pages**       | All pages of the project with their **Trigger** and whether they are currently **active** or **inactive** on this page.                                               |
| **Experiments** | All experiments with the **Variation** you see, the **Status** and whether the experiment is **active** or **inactive**.                                              |
| **Goals**       | "Goal events on this page": each goal that fires. See [Check goals with the QA tool](https://docs.ablyft.com/guides/goals-and-measurement/verify-measurement/#check-goals-with-the-qa-tool). |

The names link to the matching entry in ABlyft. Close the panel with the X in the top right.

Use it to answer questions such as: Is my page targeting matching on this URL? Did the experiment start? Is my click
goal firing, and with which value? If something is wrong, see
[Experiment does not appear](https://docs.ablyft.com/guides/troubleshooting/experiment-not-showing/) and
[Verify measurement](https://docs.ablyft.com/guides/goals-and-measurement/verify-measurement/).

## Force a variation

Besides the preview, developers can force a specific variation for a visitor with code, for example to test the real flow,
including goals, in an automated test. See [`forceVariation`](https://docs.ablyft.com/developers/reference/javascript-api/push/#forcevariation).

## End the preview

Use the status controls to choose **Start** to run the experiment, or open the status menu (for example
**Experiment is in preview**) and choose **Set back to draft**. See [Start, pause & finish](https://docs.ablyft.com/guides/experiments/start-pause-stop/).

## Checklist before the start

* Every variation looks and works correctly on desktop and mobile.
* The experiment runs only on the intended pages (**Pages** card) and, if used, environments.
* The QA tool shows your goals firing at the right moment.
* **Traffic Split & Distribution** is as intended.
* Other experiments that run on the same pages do not conflict, see [Exclusion groups](https://docs.ablyft.com/guides/experiments/exclusion-groups/).

## Next steps

- [Start, pause & finish](https://docs.ablyft.com/guides/experiments/start-pause-stop/): Go live with your experiment.
- [Verify measurement](https://docs.ablyft.com/guides/goals-and-measurement/verify-measurement/): Make sure goals are measured correctly.
- [Debugging](https://docs.ablyft.com/developers/debugging/): Technical tools for developers.

