# Quickstart for Visual Testing with Python and Playwright

This quickstart will show you how to visually test web apps in Python using Playwright. Visual testing can help you catch problems that traditional automation struggles to find.

After preparing your environment, this **three-step quickstart** should take **about 15 minutes** to complete.

## Step 1: Preparing your environment

You'll need a few things to run this quickstart:

1. An [Applitools account](https://auth.applitools.com/users/register), which you can register for free.
2. A recent version of [Python 3](https://www.python.org/downloads/).
3. A good Python editor like [Visual Studio Code](https://code.visualstudio.com/docs/languages/python) or [JetBrains PyCharm](https://www.jetbrains.com/pycharm/).

## Step 2: Getting your example project

### Downloading the example project

The example project is located at [https://github.com/applitools/example-playwright-python](https://github.com/applitools/example-playwright-python). Clone this repository to your local machine:

```text
git clone https://github.com/applitools/example-playwright-python.git
cd example-playwright-python
```

Don't have Git?

Instead of running `git clone`, you can [download the project as a ZIP file](https://github.com/applitools/example-playwright-python/archive/refs/heads/master.zip) and extract it.

### Installing the dependencies

The example project uses [pip](https://packaging.python.org/en/latest/eyes/installing-packages/) for package management. For Playwright, you must install project dependencies and browsers. Run the following commands:

```text
pip3 install -r requirements.txt
playwright install
```

Adding Applitools to Another Python Project?

This example project already declares the Applitools Eyes SDK as a dependency. If you want to add the Applitools Eyes SDK into an existing Python environment, run:

```text
pip3 install eyes-playwright
```

### Deciding how to run tests

There are two ways to test the visual snapshots captured by the test:

1. Using _Applitools [Ultrafast Grid](/content/docs/eyes/concepts/test-execution/ultrafast-grid/index.html)_ for cross-browser testing in the cloud  
2. Using _Applitools Classic runner_ on your local machine

### Walking through the code

All test setup and cleanup is handled by a set of pytest fixtures located at `tests/conftest.py`.

```python
# Sample code
# --- Add your fixtures and test cases here ---
```

## Step 3: Running your tests

### Setting Applitools variables

Before running the visual test, you must [find your Applitools API key](/content/docs/eyes/getting-started/retrieve-api-key/index.html) and set it as an environment variable named `APPLITOOLS_API_KEY`.

You may set it through your IDE or from the command line:

```text
export APPLITOOLS_API_KEY=<your-api-key>  # macOS and Linux
```

Or on Windows:

```text
set APPLITOOLS_API_KEY=<your-api-key>
```

### Launching visual tests

Run the following command to launch tests:

```text
python3 -m pytest -s -v tests
```

After your tests run, you should see results in the [Eyes Test Manager](/content/docs/eyes/concepts/reviewing-tests/test-results-page/index.html).

The project contains one visual test case, located at `tests/test_acme_bank.py`:

```python
# Sample test code
def test_log_into_bank_account(page: Page, eyes: Eyes) -> None:
    page.goto("https://demo.applitools.com")
    eyes.check(Target.window().fully().with_name("Login page"))
    page.locator('id=username').fill('andy')
    page.locator('id=password').fill('i<3pandas')
    page.locator('id=log-in').click()
    eyes.check(Target.window().fully().with_name("Main page"))
```

## Taking the next steps with Applitools

Congratulations on completing this quickstart! There's still much more to learn about visual testing with Applitools, but you're off to a great start.

### Resources for next steps:

1. [Setting match levels for visual checkpoints](/content/docs/eyes/concepts/best-practices/match-levels/index.html)
2. [Organizing Tests Into Batches](/content/docs/eyes/concepts/best-practices/batching/index.html)
3. [Run A/B Tests](/content/docs/eyes/concepts/best-practices/baseline-variations/index.html)