Lazily loaded root module causes headed Cypress to fail

[Teebo]

Current Behavior

When the root path loads a module like below

const routes: Routes = [{
  path: '',
  loadChildren: () => import('./modules/lazy-module/lazy-module.module').then(m => m.LazyModuleModule)
}];

The command to start Cypress in headed mode fails with the error.

1. Install packages (npm i)
2. Run the e2e script (npm run e2e), this will build and open the Cypress desktop app.
3. Select Chrome as the browser - Does not work (Check the Devtools console to see the error)

But if you select another browser like Electron the error is not there

ERROR Error: Uncaught (in promise): Error: NG04002: Cannot match any routes. URL Segment: '__'

This happens on Chrome and Firefox but works with Electron and Edge

Expected Behavior

The Angular application to be loaded on the browser.

GitHub Repo

https://github.com/Teebo/cypress-bug

Steps to Reproduce

1. Create a new Angular project
2. Follow instructions: https://nx.dev/nx-api/cypress
3. Configure routing where root path loads a module on the router-outlet directive

Nx Report

Node   : 16.15.1
   OS     : darwin-arm64
   npm    : 8.11.0

   nx                 : 17.0.3
   @nx/js             : 17.0.3
   @nx/jest           : 17.0.3
   @nx/linter         : 17.0.3
   @nx/eslint         : 17.0.3
   @nx/workspace      : 17.0.3
   @nx/angular        : 17.0.3
   @nx/cypress        : 17.0.3
   @nx/devkit         : 17.0.3
   @nx/eslint-plugin  : 17.0.3
   @nrwl/tao          : 17.0.3
   @nx/web            : 17.0.3
   @nx/webpack        : 17.0.3
   typescript         : 5.1.6

Failure Logs

No response

Package Manager Version

No response

Operating System

• [X] macOS
• [ ] Linux
• [ ] Windows
• [ ] Other (Please specify)

Additional Information

This issue exists with the below Nx report also:

  NX   Report complete - copy this into the issue template

   Node   : 16.15.1
   OS     : darwin-arm64
   npm    : 8.11.0

   nx                 : 16.10.0
   @nx/js             : 16.10.0
   @nx/jest           : 16.10.0
   @nx/linter         : 16.10.0
   @nx/workspace      : 16.10.0
   @nx/angular        : 16.10.0
   @nx/cypress        : 16.10.0
   @nx/devkit         : 16.10.0
   @nx/eslint-plugin  : 16.10.0
   @nx/storybook      : 16.10.0
   @nrwl/tao          : 16.10.0
   @nx/webpack        : 16.10.0
   typescript         : 5.1.6
   ---------------------------------------
   Community plugins:
   @storybook/angular : 7.4.6

[Teebo]

Hi @FrozenPandaz , is this something I address with Nx or maybe Cypress? Thanks

[FrozenPandaz]

Your repo seems to be gone or I don't have access. Did you solve the issue?

[Teebo]

@FrozenPandaz I have updated the issue. You should be able to access the repo now. Thanks

[github-actions[bot]]

This issue has been automatically marked as stale because no reproduction was provided within 7 days. Please help us help you. Providing a repository exhibiting the issue helps us diagnose and fix the issue. Any time that we spend reproducing this issue is time taken away from addressing this issue and other issues. This issue will be closed in 21 days if a reproduction is not provided. If a reproduction has been provided, please reply to keep it active. Thanks for being a part of the Nx community! 🙏

[leosvelperez]

@Teebo thanks for providing access to the repo. Unfortunately, I can't reproduce the issue using the provided reproduction. When I run npm run e2e in that repo, I can see the lazy-component works! text correctly rendered in all browsers.

The issue might be caused by an environment-specific configuration. I can see that this has been reported in the Cypress repo in the past: https://github.com/cypress-io/cypress/issues/7509, but there was no clear resolution because the Cypress team couldn't reproduce it either. Someone mentioned the issue only happened to them when they had, and quote, "a corporate security/monitoring software running (Symantec WSS Agent)". It might be worth checking if you're also using other similar corporate security tools and if you still have the issue when running your tests in an environment without them.

In any case, since the issue has been reported in the Cypress repo for non-Nx repos, it seems to be a Cypress issue and not something caused by Nx. I'm going to close this for the time being, and I suggest you bring this up in the Cypress repo. If you find any evidence this is caused by Nx, please leave us a message or create a new issue with the needed details for us to reproduce the issue.

[github-actions[bot]]

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.