table of contents Table of contents

How to Set Up Playwright Locally

On this page

Let’s start by creating a new directory and navigating to it. Assuming you already have Node.js available in your local environment, installing Playwright is achieved with just one instruction:

Terminal
npm init @playwright/test

Playwright comes bundled with a connected browser, so we now have all we need to run our first script. Let’s create a script to navigate to our test website:

basic-navigation.spec.ts
import { test } from '@playwright/test'

test('basic navigation', async ({ page }) => {
  await page.goto('https://danube-web.shop/')
})
Run in Checkly

Run this example as follows:

Terminal
npx playwright test basic-navigation.spec.ts

Nothing much has happened, right? Remember: by default, Playwright will run in headless mode! That means we won’t see anything of what is happening in the browser when our script runs.

Playwright creates its own browser user profile, which it cleans up on every run. In other words: all runs will be sandboxed and not interfere with one another, as state is always fully reset at the end of a session.

When you are first writing and debugging your scripts, it is a good idea to enable “headed” mode, so you can have a look at what your script is doing:

Terminal
npx playwright test basic-navigation.spec.ts --headed

After executing the updated file, you will see Chromium starting up, only to shut down after an instant. Everything is working as expected! Our script is just so short, it runs almost instantaneously.

Further reading

  1. Getting started guides for Playwright

Last updated on December 11, 2024. You can contribute to this documentation by editing this page on Github