'Cypress could not verify that this server is running' error with baseUrl in component test after updating to v13

[niklashauschel]

Current behavior

In the UI it displays the warning "cannot connect base url"

But here it is possible to ignore and execute the tests.

With the CLI it fails:

Desired behavior

Before I updated it to version 13 it was working and it was not required to define the baseUrl for component tests. And the command npx nx component-test core-tables works without problems

Test code to reproduce

import { defineConfig } from 'cypress';
import { nxComponentTestingPreset } from '@nrwl/angular/plugins/component-testing';

export default defineConfig({
  component: {
    ...nxComponentTestingPreset(__filename),
    video: false,
    reporter: '../../../node_modules/cypress-multi-reporters',
    reporterOptions: {
      configFile: 'reporter.json'
    },
    screenshotsFolder: '../../../dist/cypress/libs/reports/mochawesome/screenshots/about'
  }
});

Cypress Version

13.2.0

Node version

v18.15.0

Operating System

Windows 10

Debug Logs

> nx run core-tables:component-test

DevTools listening on ws://127.0.0.1:59615/devtools/browser/3a1d1242-0013-46a8-9bd2-6d4ea7994825
Browserslist: caniuse-lite is outdated. Please run:
  npx update-browserslist-db@latest
  Why you should do it regularly: https://github.com/browserslist/update-db#readme
- Generating browser application bundles (phase: setup)...
Cypress could not verify that this server is running:

  > http://localhost:8080

We are verifying this server because it has been configured as your baseUrl.

Cypress automatically waits until your server is accessible before running tests.

We will try connecting to it 3 more times...
We will try connecting to it 2 more times...
We will try connecting to it 1 more time...

Browserslist: caniuse-lite is outdated. Please run:
  npx update-browserslist-db@latest
  Why you should do it regularly: https://github.com/browserslist/update-db#readme
Cypress failed to verify that your server is running.

Please start this server and then run Cypress again.

Other

nx version: 15.7.2

[jennifer-shehane]

What is the nx run core-tables:component-test script running? Are you passing the --component flag to cypress run?

Which version did you upgrade from?

[niklashauschel]

What is the nx run core-tables:component-test script running? Are you passing the --component flag to cypress run?

Which version did you upgrade from?

Previous version was 12.17.1

My project is an Angular nx monorepo. It is the basic command from nx to execute cypress component tests:
https://nx.dev/recipes/cypress/cypress-component-testing#watching-for-changes-headed-mode

project.json

"component-test": {
      "executor": "@nrwl/cypress:cypress",
      "options": {
        "cypressConfig": "libs/core/tables/cypress.config.ts",
        "testingType": "component",
        "skipServe": true,
        "devServerTarget": "demo-app:build"
      }
    }

[niklashauschel]

But even with the cypress command I have the same output:
libs\core\tables> npx cypress run --component

DevTools listening on ws://127.0.0.1:64440/devtools/browser/9ba17c02-7320-4b6f-abcb-a666f50afe07
[34656:1006/183419.667:ERROR:display_layout.cc(551)] PlacementList must be sorted by first 8 bits of display_id

• Generating browser application bundles (phase: setup)...
  Cypress could not verify that this server is running:

  http://localhost:8080

We are verifying this server because it has been configured as your baseUrl.

Cypress automatically waits until your server is accessible before running tests.

We will try connecting to it 3 more times...
We will try connecting to it 2 more times...
We will try connecting to it 1 more time...

[MetRonnie]

I am also getting this after upgrading to v13. If I replace localhost with its IP address in the baseUrl config, then it works as normal, but either ought to work.

[niklashauschel]

I am also getting this after upgrading to v13. If I replace localhost with its IP address in the baseUrl config, then it works as normal, but either ought to work.

@MetRonnie Could you share your config? Because for me it was not working

[MetRonnie]

@niklashauschel https://github.com/cylc/cylc-ui/blob/2549d65663fe9564f371e7805700eb9ec47295f1/cypress.config.js#L18

[niklashauschel]

Hmm does not work.
@jennifer-shehane The question is why it is required to have an e2e setup even if I just have component tests. Before it was working

[MetRonnie]

(I get the "could not verify this server is running" message for both E2E and component tests, when I didn't before. It causes cypress run E2E tests to fail but cypress open E2E still works)

[MetRonnie]

Possibly related to #25397?

[Rahul-Todupunoori]

I'm seeing a similar issue, @MetRonnie Thanks, updating the baseUrl to IP worked for e2e tests. But component testing doesn't have the property exposed in config and cannot be overridden.

interface ComponentConfigOptions<ComponentDevServerOpts = any> extends Omit<CoreConfigOptions, 'baseUrl' | 'experimentalStudio'> {
    devServer: DevServerFn<ComponentDevServerOpts> | DevServerConfigOptions
    devServerConfig?: ComponentDevServerOpts
    /**
     * Runs all component specs in a single tab, trading spec isolation for faster run mode execution.
     * @default false
     */
    experimentalSingleTabRunMode?: boolean
  }

[rkrisztian]

I have the same issue after upgrading from Cypress 12.7.2 to 13.6.2. When I run the following command on Linux, I get:

> cypress run --component --browser chromium


DevTools listening on ws://127.0.0.1:43411/devtools/browser/f036190f-b6d2-4bbf-a3b3-512953f97dbc
[356314:0109/140456.248459:ERROR:object_proxy.cc(590)] Failed to call method: org.freedesktop.portal.Settings.Read: object_path= /org/freedesktop/portal/desktop: org.freedesktop.portal.Error.NotFound: Requested setting not found
(node:356503) ExperimentalWarning: Custom ESM Loaders is an experimental feature and might change at any time
(Use `node --trace-warnings ...` to show where the warning was created)
(node:356503) ExperimentalWarning: The Node.js specifier resolution flag is experimental. It could change or be removed at any time.
vite:istanbul> Sourcemaps was automatically enabled for code coverage to be accurate.
 To hide this message set build.sourcemap to true, 'inline' or 'hidden'.
Cypress could not verify that this server is running:

  > http://localhost:5173

We are verifying this server because it has been configured as your baseUrl.

Cypress automatically waits until your server is accessible before running tests.

We will try connecting to it 3 more times...
We will try connecting to it 2 more times...
We will try connecting to it 1 more time...

Cypress failed to verify that your server is running.

Please start this server and then run Cypress again.

The cypress open --component command would also show me a warning about the base URL, but at least the tests can still be executed. Edit: If i pressed Try again, the warning would not go away until I selected a browser. Once the browser is opened, the warning disappeared when pressing Try again.

Interestingly enough, I can run component tests inside a cypress/browsers Docker image ... I don't know what the difference is yet.

[rkrisztian]

I found a clue! In /etc/hosts, if I comment out the line for ::1, component tests work:

#::1         localhost localhost.localdomain localhost6 localhost6.localdomain6
127.0.0.1	localhost.localdomain	localhost myhostname

Then this issue is now similar to #25397, except here we don't even use a base URL, and nothing I tried so far helps as a workaround.

[mdlkumaran]

@jennifer-shehane : I also reported this issue in #27967. I dont find any other workaround to resolve this issue as well. :(

[Zypzone]

After few days of reading the Cypress source code and testing on our Azure server, I found that if ENV-variable HTTP_PROXY or HTTPS_PROXY is set, the server verification would fail.

Row 59 in server/lib/util/ensure-url. ts function isListening:

export const isListening = (urlStr: string) => {
  // takes a urlStr and verifies the hostname + port is listening
  let { hostname, protocol, port } = url.parse(urlStr)

  if (port == null) {
    port = protocol === 'https:' ? '443' : '80'
  }

  if (process.env.HTTP_PROXY) { <-- HERE
    // cannot make arbitrary connections behind a proxy, attempt HTTP/HTTPS
    // For some reason, TypeScript gets confused by the "agent" parameter
    // and required double ts-ignore to allow it on local machines and on CI
    // @ts-ignore
    return rp({
      url: urlStr,
      // @ts-ignore
      agent,
      proxy: null,
    })
    .catch({ name: 'StatusCodeError' }, () => {}) // we just care if it can connect, not if it's a valid resource
  }

  return connect.getAddress(Number(port), String(hostname))
}

[Zypzone]

@jennifer-shehane: I think there is a need to verify that the NO_PROXY settings are respected everywhere in the source code

[cronwel91]

The issue is reproducible as well with Cypress version: 13.9.0

[NassrEML]

Add this line to your etc/hosts and maybe it will resolve your problem :)

127.0.0.1 localhost

[cronwel91]

Add this line to your etc/hosts and maybe it will resolve your problem :)

127.0.0.1 localhost

I have tried this already and unfortunately did not help.