@ngx-playwright/jest

Builder for running e2e tests in an angular application using jest and playwright with Angular CDK's component harnesses.

Set up

1. Install this package and ts-jest

2. Depending on your usage, you may have to install playwright, playwright-chromium, playwright-firefox or playwright-webkit

3. Create an application/jest.e2e-config.js e.g.

   module.exports = {
     ...require('ts-jest/presets').defaults,
     preset: '@ngx-playwright/jest',
   
     rootDir: '.',
     testMatch: ['<rootDir>/e2e/specs/*.spec.ts'],
   
     globals: {
       'ts-jest': {
         tsconfig: '<rootDir>/e2e/tsconfig.json',
       },
     },
   };

4. Configure your e2e tests in the angular.json:

   "e2e": {
     "builder": "@ngx-playwright/jest:run",
     "options": {
       "devServerTarget": "application:serve",
       "config": "application/jest.e2e-config.js"
     }
   },

5. Configure typescript by creating a small file called application/e2e/setup.d.ts containing

   import '@ngx-playwright/jest/global';

   and configuring application/e2e/tsconfig.json:

   {
     "compilerOptions": {
       // include any compiler options you want
       "types": ["jest"]
     },
     "include": ["setup.d.ts", "specs/*.spec.ts"]
   }

   This will make extra global variables available in your test, such as browser, browserContext, page, and harnessEnvironment, as well as all regular jest globals.

Configuration

TODO

License

Licensed under the MIT license, see LICENSE.md.