How to service angular cli application before running cypress in CI?

Question

I am trying to use Cypress with an Angular (v. 5) CLI application.

The tests work fine when running locally, because here I can just run the serve command before running the cypress tests.

I tried following the documentation here , but none of the commands work.

I tried a varioues combination that looks like this:

"cypress:run:report": "./node_modules/.bin/cypress run --record --key <key>", "cypress:run:ci": "start-server-and-test serve:dev http://localhost:4200 cypress:run:report", "cypress:run:ci2": "npm run -s serve:dev & npm run -s cypress:run:report", 

Thanks in advance.

Answer 1

After trying to solve this for several hours, I developed a solution using the Cypress API .

Package.json

 "cypress:run:ci": "node ng-serve-and-run-cypress.js", 

ng served and run cypress

 'use strict'; const cypress = require('cypress'); const { spawn } = require('child_process'); const child = spawn('ng', ['serve']); // On error exit, and print child.on('error', (err) => process.exit(1)); child.stderr.on('data', (data) => console.log(data.toString())); // On exit, print exit code child.on('exit', (code, signal) => console.log(`Child exitting with code ${code}`)); child.stdout.on('data', (data) => { const asString = data.toString(); // Log the output to inform CI/User console.log(asString); if (asString.includes('webpack: Compiled successfully.')) { cypress.run({}) .then((results) => { const errorCode = (results.failures >= 1) ? 1 : 0; child.kill(); // When cypress is done running the tests, exit with errorCode from above. process.exit(errorCode); }) .catch((err) => { child.kill(); // If cypress hit an error, exit with code 1 process.exit(1); }) } }); 

Just send here if you are interested in more detailed information.

Answer 2

start-server-and-test seems to integrate poorly with the 'ng serve' command. I made it work without using angular-cli to serve the application - the module API is not required:

package.json

 "scripts": { "ci:serve": "ng build && http-server dist -p 4200", "cy:run": "cypress run", "cy:ci": "start-server-and-test ci:serve http://localhost:4200 cy:run" } "devDependencies": { // omitted angular & cypress deps "start-server-and-test": "xxx", "http-server": "xxx" }