ngx-cypress-builder
Run Cypress from the Angular CLI for your E2E tests.
Credits
Big thanks to Manfred Steyer for showing this was possible with ngx-build-plus
Tested with CLI 6.1.x
This package has been created and tested with Angular CLI 6.1.x. If the CLI's underlying API changes in future, I'll provide an respective update for this version too until the CLI has build-in features for the covered use cases.
Example
https://github.com/isaacplmann/ngx-cypress-builder/sample
Usage
The next steps guides you trough getting started with ngx-cypress-builder
. The result of this description can be found in the repository's sample
directory.
-
Create a new Angular CLI based project:
ng new my-sample-app
-
Install cypress and ngx-cypress-builder:
npm i -D cypress ngx-cypress-builder
-
Open your
angular.json
and tell the CLI to usengx-cypress-builder
instead of protractor:[...] "my-sample-app-e2e": { "root": "cypress/", "projectType": "application", "architect": { "e2e": { "builder": "ngx-cypress-builder:cypress", "options": { "devServerTarget": "my-sample-app:serve" }, "configurations": { "production": { "devServerTarget": "my-sample-app:serve:production" } } } } } [...]
-
Create a default Cypress setup
npx cypress open
-
Close the Cypress application
-
Run the sample Cypress tests through the angular cli
npm run e2e# orng e2e
This will serve your application, run the Cypress tests and exit.
devServerTarget in angular.json
If you do not specify a devServerTarget
in the angular.json
file, the cli will skip that step and just run Cypress.