How to serve angular cli app before running cypress in CI?

Question

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

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

I tried following the documentation here, but none of the commands seems to be working.

I tried varioues combination, looking 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

I wasn't satisfied with any of the answers provided, so I came up with the following:

Step 1: Install dev dependencies

npm install --save-dev concurrently wait-on

Step 2: Write the following scripts in your package.json:

"scripts": {
  "start": "ng serve",
  ...
  "cy:open": "cypress open",
  "cy:run": "cypress run",
  "e2e": "concurrently \"npm run start\" \"wait-on http-get://localhost:4200 && npm run cy:run\" --kill-others --success first",
  "e2e-gui": "concurrently \"npm run start\" \"wait-on http-get://localhost:4200 && npm run cy:open\" --kill-others --success first",
  ...
}

Then you can run npm run e2e or npm run e2e-gui.

Voila!