DEV Community

Kayode
Kayode

Posted on • Originally published at blog.zt4ff.dev on

2 1 1 1 1

Playwright Tutorial for Beginners 10 - Configuration

There are options to configure how Playwright functions in our test.

In this tutorial, we will not focus on these configurations options rather, we will majorly focus on how to configure Playwright.

How can we configure Playwright?

Global configuration

Create playwright.config.js or playwright.config.ts in the root of your project. When you run the test normally, Playwright automatically picks up the configuration file and make use of it.

For instance:

// @ts-check

/** @type {import('@playwright/test').PlaywrightTestConfig} */
const config = {
  use: {
    headless: false,
    video: 'on-first-retry',
  },
    projects: [{ name: 'chrome', use: { ...devices['Desktop Chrome'] } }],
};

module.exports = config;

Enter fullscreen mode Exit fullscreen mode

Using a separate file for configuration

We can have a different js or ts file for configuration.

Why would we ever need this? It makes sense when we want to run how to test in different ways (using different configurations). For instance, where we want to run a test using all device types and also want to run the same test using only chrome with code coverage.

So run your test with the --config flag to define the path to our config file:

npx run playwright test --config=test/chrome_coverage.config.js

Enter fullscreen mode Exit fullscreen mode

Local configuration

We can use test.use to override some options for a file or a test.describe block:

const { test } = require('@playwright/test');

test.describe('override config options', () => {
  test.use({ headless: false });

  test('some test', async ({ page }) => {
    // ..
  });
});

Enter fullscreen mode Exit fullscreen mode

Sentry image

Hands-on debugging session: instrument, monitor, and fix

Join Lazar for a hands-on session where you’ll build it, break it, debug it, and fix it. You’ll set up Sentry, track errors, use Session Replay and Tracing, and leverage some good ol’ AI to find and fix issues fast.

RSVP here →

Top comments (0)

Billboard image

Create up to 10 Postgres Databases on Neon's free plan.

If you're starting a new project, Neon has got your databases covered. No credit cards. No trials. No getting in your way.

Try Neon for Free →

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay