> ## Documentation Index
> Fetch the complete documentation index at: https://orbitkit.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# Playwright

> A guide on how playwright is setup and used in the monorepo.

[Playwright](https://playwright.dev/) is a library used to automate the browser. It is a powerful tool to test web applications and can be used to automate tasks that require a browser.

In OrbitKit, Playwright is used to provide a way to write and run end-to-end tests for the web and marketing applications.

## How it's setup

In short terms:

* The `@playwright/test` dependency is installed at the root of the monorepo to provide a way of running `playwright install-deps --with-deps` to install the necessary browser binaries without having to change directories.
* The `@playwright/test` dependency is also installed in each of the applications.
* Tests are written in an `e2e` directory in each application.
* The `playwright.config.ts` inside each of the applications is used to configure the tests.
* To run the tests, you use turborepo and the `turbo test:e2e` command. Filtering to a single application is done using the `--filter` flag followed by the application name such as `turbo test:e2e --filter=@orbitkit/web`.
* To provide more flags to playwright while running it, you can do so by adding `-- --` followed by the flags. For example, `turbo test:e2e --filter=@orbitkit/web -- --headed` will run the tests in the web application in headed mode.
* There is also a playwright specific eslint configuration in `packages/config/eslint/playwright.js` that is used to lint the tests and is added onto the eslint configuration of each app that uses playwright using `orbitkit/playwright` in the extends array.

## Writing tests

To write tests, you can create a new file in the `e2e` directory of the application you want to write the test for. The file should have a `.spec.ts` extension.

Here is an example of a test file:

```typescript theme={null}
import { expect, test } from '@playwright/test'

test('has title', async ({ page }) => {
  await page.goto('/')

  await expect(page.getByText(/astro website/i)).toBeVisible()
})
```

## CI setup

In CI, the tests are run per application in a separate job. Refer to the `.github/workflows/pr-ci.yml` file to see how the tests are run in CI.