Nx Plugin containing executors and generators allowing your workspace to use the powerful Playwright end-to-end testing capabilities.

Quick Start

Create an Nx workspace and add the Playwirght plugin

npx create-nx-workspace@latest my-org

npm install -D @nxkit/playwright

Create a playwright E2E project

Create a web project in your workspace without a default e2e test runner. This is a @nx/react example:

npx nx generate @nx/react:app my-app --e2eTestRunner none

or, you can delete an existing e2e project, using:

npx nx generate @nx/workspace:rm --project my-app-e2e

Now, for this my-app project, you can create a Playwright e2e testing project using:

npx nx generate @nxkit/playwright:project my-app-e2e --frontendProject my-app

This will behave similar to what the official @nx/cypress plugin does. It will serve the my-app application, run e2e tests and provide the result.

Standalone E2E project

You can also create a Playwright E2E testing project without depending on an existing web project.

npx nx generate @nxkit/playwright:project my-app-e2e

This project won't run against a workspace project but against a given baseUrl instead. Check the my-app-e2e/project.json file to set your respective baseUrl.

Run your E2E tests!

Run the e2e target for your e2e testing project

npx nx e2e my-app-e2e

See your tests report

npx nx show-report my-app-e2e

That's it!

To know more about the @nxkit/playwright plugin, run:

npx nx list @nxkit/playwright