Run e2e with multiple devServerTargets

Description

I would like to be able to serve both frontend app and backend api before running e2e tests.

Currently I can serve multiple projects using @nrwl/workspace:run-commands as demonstrated in here: https://github.com/nrwl/nx/issues/1482

But when running e2e tests with devServerTarget set to such a command:

        "serve": {
          "builder": "@nrwl/workspace:run-commands",
          "options": {
            "commands": [
              {
                "command": "nx serve api"
              },
              {
                "command": "nx serve desktop"
              }
            ],
            "parallel": true
          }
        },

it doesn’t start tests because it doesn’t know when serve command is ready 😕

I tried to work it around with:

        "e2e-ci": {
          "builder": "@nrwl/workspace:run-commands",
          "options": {
            "commands": [
              {
                "command": "nx serve desktop-with-api"
              },
              {
                "command": "nx e2e desktop-e2e"
              }
            ],
            "parallel": true
          }
        },

But that fails to complete at the end. And readyWhen doesn’t stop processes.

Motivation

Running test in CI environment.

Suggested Implementation

I don’t know how devServerTarget knows that serve process is ready in the first place.

I image it would have to respond similarly to run-commands.

Alternate Implementations

Perhaps base it on baseUrl (https://github.com/nrwl/nx/issues/1614), but there is still issue of stoping processes.

[barbados-clemens]

Hi all this looks to be something that would be a benefit to have as it’s been referenced by a handful of other issues. I’ll try to take some time to figure out what it will take to make this happen. unsure what the timeline would look like but adding it to my todo list!

[tfohlmeister]

I found a good solution in the cypress guides using start-server-and-test.

Install dependency: npm install --save-dev start-server-and-test

Add or update your e2e script in package.json: (adapt api:serve and the port to match your BE project and port)

"scripts": {
   "e2e": "start-server-and-test \"nx run api:serve\" http://localhost:3333",
}

Run e2e and server in one command: (the part after – is provided as an argument to start-server-and-test and would start a FE / E2E project of your choice)

npm run e2e -- "nx affected:e2e"

Thats it. I am using this in a Github Action pipeline and it works great!