Use the Angular CLI Builder

The angular-testcafe builder allows you to integrate TestCafe into the Angular build process. This builder serves your Angular application, and runs TestCafe tests as soon as it is ready.

Install the Builder

Install angular-testcafe from npm:

npm install --save-dev angular-testcafe

Configure a Target in the Angular Workspace

Open angular.json and configure the Architect target as follows to run TestCafe tests:

• Specify the e2e architecture.
• Set the builder property to angular-testcafe:testcafe.
• Set the devServerTarget option to project-name:serve to start launch the server along with the tests.
• Include the remainder of TestCafe options in the options object (See the builder configuration schema for the list of supported TestCafe options.)

{
  "projects": {
    "my-project": {
      "architect": {
        "e2e": {
          "builder": "angular-testcafe:testcafe",
          "options": {
            "devServerTarget": "my-project:serve",
            "browsers": ["chrome"],
            "src": "e2e/*.e2e-spec.ts"
          }
        }
      }
    }
  }
}

Run the Build

Use npm run to run the build:

npm run build

Builder Documentation

See the angular-testcafe-builder README for more information.

Configuration Example

The following example shows the angular.json workspace configuration file with a TestCafe testing task:

{
  "projects": {
    "my-project": {
      "architect": {
        "e2e": {
          "builder": "angular-testcafe:testcafe",
          "options": {
            "devServerTarget": "my-project:serve",
            "browsers": [
              "chrome",
              "firefox"
            ],
            "src": "e2e/*.e2e-spec.ts",
            "reporters": [
              {
                "name": "json",
                "output": "reports/report.json"
              },
              {
                "name": "spec"
              }
            ],
            "concurrency": 4,
            "screenshotsPath": "artifacts/screenshots",
            "selectorTimeout": 10000,
            "quarantineMode": true,
            "stopOnFirstFail": true,
            "host": "localhost",
            "port": "4200"
          }
        }
      }
    }
  }
}