Nx: [BUG] New project instructions don't work

Created on 20 Mar 2019  路  4Comments  路  Source: nrwl/nx

I followed the official docs to create a new app.

Environment (latest of everything):
nx 7.7.2
angular-cli 7.3.1
node 10.15.3
npm 6.9.0
ubuntu 18
vscode 1.32.3

Repro:
````
sudo npm install --global @angular/[email protected] # latest
npx create-nx-workspace myworkspace # choose empty workspace
cd myworkspace
ng g application myapp # choose angular, jest, cypress
npm install

npm run test # succeeds
ng test # succeeds
````

Problem: running tests in IDE, or using jest in terminal, fails:

  • From vscode: open vscode, then open the /apps/myapp/src/app/app.component.spec.ts
  • From terminal: node_modules/.bin/jest apps/myapp/src/app/app.component.spec.ts --testNamePattern="AppComponent"

In both cases error is

"Zone is needed for the async() test helper but could not be found. Please make sure that your environment includes zone.js/dist/zone.js"

This is significant because the IDE tooling and various test extensions use the jest approach to find and run tests (rather than npm run test / ng test).

bug

Most helpful comment

This extension has a configuration option for jest executable: https://github.com/jest-community/vscode-jest

This PR makes integration much better:
https://github.com/nrwl/nx/pull/1118

_After_ that, you can set your path to the ./node_modules/.bin/ng test and it will work:
image

All 4 comments

This appears to be a problem for VSCode. However since it is the most used IDE in the node/angular world, this is a serious problem.

Has anyone figured out how to solve this? Can anyone share a boilerplate project which actually works?

After following the workaround in that issue, the error is now

Uncaught (in promise): Failed to load app.component.html

and

This test module uses the component AppComponent which is using a "templateUrl" or "styleUrls", but they were never compiled. Please call "TestBed.compileComponents" before your test.

This is for a vanilla new project, using nx's generators. I've added nothing.

I also tried some tips on the angular site for this specific error, but they didn't help.

I've tried loads of workarounds and versions, without any progress. And there are many breaking changes with new versions of the dependencies.

This extension has a configuration option for jest executable: https://github.com/jest-community/vscode-jest

This PR makes integration much better:
https://github.com/nrwl/nx/pull/1118

_After_ that, you can set your path to the ./node_modules/.bin/ng test and it will work:
image

Thanks for looking into this!

That PR looks cool, hope you guys manage to merge it soon!

Was this page helpful?
0 / 5 - 0 ratings