Playwright Questions Set- 4

In my previous post, I posted some questions on the Playwright code examples, and mentioned that next part will be focussed on the playwright.config.ts file – so here it is –

• What is the purpose of the playwright.config.ts file in Playwright?

Ans: A config file – short for a configuration file – is how you configure your tool to behave. So playwright.config.ts also does this job for you.

Let’s just say that you want you tests to be run in both Chrome and Firefox, and that too in a parallel mode, then that kind of configuration has to be done at the playwright.config.ts file.

Most of the configuration and settings for test execution, such as browser selection, timeouts, test match patterns, environment variables, test report output format, test runners, test retries, code coverage reporting, network request interception, and more are done in this file and the changes , in most cases are applicable to all the tests.

• How can you specify the browsers to be used in Playwright through the configuration file?

Ans: Browsers can be specified in the playwright.config.ts file using the projects property. You can provide an array of browser names, such as ‘chromium’, ‘firefox’, or ‘webkit’, to define which browsers to use during test execution.

• Can you explain the difference between playwright.config.ts and jest.config.js in Playwright?

Ans: This comes into picture if you’re using jest as test runner in your project. The playwright.config.ts file is specific to Playwright and is used to configure Playwright’s testing framework. On the other hand, jest.config.js is used to configure the Jest testing framework. While both files can define similar configurations like test match patterns and environment variables, they serve different frameworks and have different syntax.

• How can you configure the default timeout for tests in the playwright.config.ts file?

Ans: You can do that in the timeout property in the playwright.config.ts file. I’ve written a whole blog on this. You can read it.

• What is the use of the contextOptions property in the playwright.config.ts file?

Ans: The contextOptions property in the playwright.config.ts file allows you to define various options and settings for each browser contexts. These options include viewport size, user agent, permissions, ignoreHTTPSErrors, and more.

• How can you configure test match patterns in the playwright.config.ts file?

Ans: This can be done via the testMatch in the config file. When you set the pattern in the testMatch in config, then only that pattern files will be selected in the tests.

By default, the pattern that playwright uses is files matching this glob pattern */.@(spec|test).?(c|m)[jt]s?(x)

This means that any TS or JS files with .spec and .test would be counted for the tests. So this first-test.spec.ts would be counted but not firsttest.ts.

Suppose you want to match files that have .e2e in them, then you can do like this

• Can you provide an example of how to configure multiple browsers in the playwright.config.ts file?

Ans: Refer to the second question in the list.

• What are some commonly used environment variables that can be set in the playwright.config.ts file?

Ans: One of the most common is baseURL that can be passed in the playwright.config.ts file. Although as per my experience, it is always better to have a separate .env file to use the environment variables and use the dotenv package to use them in tests.

• How can you configure the test report output format in the playwright.config.ts file?

Ans: This setting is available under the reporters in the playwright.config.ts file.

You can also use multiple reporters like this

The documentation about reporters and their config is here.

• Is it possible to use custom test runners or frameworks with Playwright? How can you configure them in the playwright.config.ts file?

Ans: Yes, it is possible to use custom test runners or frameworks with Playwright. In the playwright.config.ts file, you can configure the preset property for using the jest playwright present

• What are the available options for configuring test retries in the playwright.config.ts file?

Ans: This is available with the retries option. When retries is set, then the failing tests would be retried until they pass or until the maximum number set with retries is reached.

You can either pass the number of retries at the run time

Or simply pass it in the playwright.config.ts file

• What are some advanced configuration options available in the playwright.config.ts file?

Ans: Some advanced configuration options available in the playwright.config.ts file include configuring test fixtures, defining global test setup and teardown functions, specifying test retries based on specific conditions, customizing test timeouts for individual tests, and more.

• How can you integrate external plugins or extensions with Playwright using the playwright.config.ts file?

Ans: This is not yet supported as per this ticket.

• How can you define global setup and teardown functions for tests in the playwright.config.ts file?

Ans : This can be done via the globalSetup and globalTeardown properties in the playwright.config.ts. The globalSetup option in the configuration file to set something up once before running all tests.

The globalTeardown is used to run something once after all the tests.

The global setup file must export a single function that takes a config object. This function will be run once before all the tests.

• What is the purpose of the projects property in the playwright.config.ts file?

Ans: The projects property in the playwright.config.ts file allows you to configure multiple test projects within a single configuration file. Each project can have its own set of configurations, such as different test match patterns, environment variables, browsers, and more.

In this example the chromium, firefox and webkit projects depend on the setup project.

This code is taken directly from Playwright documentation.

• How to configure test file watch mode in the playwright tests?

Ans: Run your tests with the --ui parameter like

npx playwright test --ui

This will open the UI mode – and in there is a watch mode ( with an eye icon)

• How can you configure the parallel execution of tests in the playwright.config.ts file?

Ans: By default, test files are run in parallel. Tests in a single file are run in order, in the same worker process. For running specific tests in parallel mode in a single file you can use test.describe.configure like below

For opting to run all tests in parallel, use fullyParallel flag as true in the playwright.config.ts file

• What is the significance of the forbidOnly property in the playwright.config.ts file?

Ans : If there is a test with test.only() or test.describe.only()  then the tests will exit with an error.

• How can you configure the maximum number of workers for parallel test execution in the playwright.config.ts file?

Ans: The maximum number of workers for parallel test execution can be configured in the playwright.config.ts file using the workers property. You can define the maximum number of workers to allocate for running tests concurrently.

• How can you configure custom browser launch options in the playwright.config.ts file?

Ans: Custom browser launch options can be configured in the playwright.config.ts file using the launchOptions property. You can provide additional options specific to each browser, such as args, executablePath, headless, and more.

• Can you provide an example of configuring network proxy settings in the playwright.config.ts file?

Ans: You can use the proxy property inside use for this purpose

I think there can be more questions about the various other configurations but I’ve limited to some 20 odd questions – you can see the config file and check the various options.

In the next series, I’ll put some questions on some general coding snippets may be.