diff --git a/.gitignore b/.gitignore index 3605aca9a6108..4a7f4708ce399 100644 --- a/.gitignore +++ b/.gitignore @@ -10,6 +10,7 @@ coverage .phpunit.result.cache .reassure + # Directories/files that may appear in your environment *.log yarn.lock @@ -37,6 +38,7 @@ test/native/junit.xml # Local overrides .wp-env.override.json +playwright.config.override.ts phpcs.xml phpunit.xml phpunit-watcher.yml diff --git a/docs/contributors/code/e2e/README.md b/docs/contributors/code/e2e/README.md index e5c4cbb534102..ad03255cf36db 100644 --- a/docs/contributors/code/e2e/README.md +++ b/docs/contributors/code/e2e/README.md @@ -114,3 +114,45 @@ test.describe( 'Grouping tests (@webkit, -chromium)', () => { } ); } ); ``` + +## Local configuration of Playwright + +Sometimes the deafults that Gutenberg offers for Playwright configuration need to be changed. While most configuration can be overriden by passing arguments to the test runner command line, we may want to make permanent confguration changes, such as setting the test to always run with `headless` mode set to `false` and you own custom slow motion value. + +To do this one can create a file named `playwright.config.override.ts` file in the `/test/e2e/` folder. In this new file we need to import the exiting configuration, then use the new values on top to override the defaults. + +For example: + +```ts +/** + * External dependencies + */ +import { defineConfig } from '@playwright/test'; +/** + * Internal dependencies + */ +import base from './playwright.config.ts'; + +const config = defineConfig( { + ...base, + use: { + ...base.use, + headless: true, + launchOptions: { + //slowMo: 500, + }, + trace: 'off', + screenshot: 'off', + video: 'off', + }, +} ); + +export default config; + +``` + +After making this file you can now run your tests passing the new configuration file with the `--config` argument: + +```bash +npm run test:e2e:playwright -- --config=test/e2e/playwright.override.config.ts +```