Closed wilgert closed 4 years ago
Hi @wilgert,
Could you please share your package.json file?
package.json
{
"name": "projectName",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"nx": "nx",
"start": "ng serve",
"build": "ng build --prod",
"test": "ng test",
"lint": "nx workspace-lint && ng lint",
"e2e": "ng e2e",
"affected:apps": "nx affected:apps",
"affected:libs": "nx affected:libs",
"affected:build": "nx affected:build",
"affected:e2e": "nx affected:e2e",
"affected:test": "nx affected:test",
"affected:lint": "nx affected:lint",
"affected:dep-graph": "nx affected:dep-graph",
"affected": "nx affected",
"format": "nx format:write",
"format:write": "nx format:write",
"format:check": "nx format:check",
"precise-commits": "precise-commits",
"precommit": "npm run precise-commits",
"update": "ng update @nrwl/workspace",
"update:check": "ng update",
"workspace-schematic": "nx workspace-schematic",
"dep-graph": "nx dep-graph",
"help": "nx help",
"postinstall": "ngcc --properties es2015 browser module main --first-only --create-ivy-entry-points"
},
"private": true,
"dependencies": {
"@angular/animations": "^9.0.0",
"@angular/common": "^9.0.0",
"@angular/compiler": "^9.0.0",
"@angular/core": "^9.0.0",
"@angular/forms": "^9.0.0",
"@angular/platform-browser": "^9.0.0",
"@angular/platform-browser-dynamic": "^9.0.0",
"@angular/router": "^9.0.0",
"@nrwl/angular": "^9.0.0-rc.1",
"core-js": "^2.5.4",
"rxjs": "~6.5.4",
"tslib": "^1.10.0",
"zone.js": "~0.10.2"
},
"devDependencies": {
"@angular-builders/custom-webpack": "^8.2.0",
"@angular-devkit/build-angular": "~0.900.0",
"@angular/cli": "9.0.0",
"@angular/compiler-cli": "^9.0.0",
"@angular/language-service": "^9.0.0",
"@nrwl/cypress": "^9.0.0-rc.1",
"@nrwl/jest": "9.0.0-rc.1",
"@nrwl/workspace": "9.0.0-rc.1",
"@types/jest": "24.0.9",
"@types/node": "^12.11.1",
"codelyzer": "^5.1.2",
"cypress": "3.8.3",
"dotenv": "6.2.0",
"eslint": "6.1.0",
"husky": "^3.0.9",
"jest": "24.1.0",
"jest-preset-angular": "8.0.0",
"postcss-import": "^12.0.1",
"postcss-loader": "^3.0.0",
"postcss-scss": "^2.0.0",
"precise-commits": "^1.0.2",
"prettier": "1.18.2",
"tailwindcss": "^1.1.3",
"ts-jest": "24.0.0",
"ts-node": "~7.0.0",
"tslint": "~5.11.0",
"typescript": "~3.7.5"
},
"prettier": {
"singleQuote": true,
"overrides": [
{
"files": "*.md",
"options": {
"parser": "markdown"
}
},
{
"files": "*.json",
"options": {
"parser": "json"
}
}
]
}
}
There was a breaking change in v8.x of jest-preset-angular
that is used by Angular 9. We have updated our jest-preset-angular
integration which should fix the problem for you. The latest version of Wallaby core, v1.0.835
has the updated jest-preset-angular
integration.
I can see from your diagnostics report that you are using a JetBrains editor. Wallaby should automatically update and download the latest version for you next time it starts. If it does not, you may force Wallaby to update by closing all editor instances, restarting your IDE, and starting Wallaby.
@smcenlly Thanks for the fast reponse and fix! Unfortunately I am still not able to run the tests using Wallaby. See the below test output, diagnostics file and package.json.
Test output
src/app/app.component.spec.ts AppComponent should have as text 'Coming Soon!' [12 ms]
Error: 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.
at it src/app/app.component.spec.ts:24:5
Diagnostics Report
{ editorVersion: 'WebStorm 2019.3.2',
pluginVersion: '1.0.156',
editorType: 'IntelliJ',
osVersion: 'darwin 19.3.0',
nodeVersion: 'v10.16.3',
coreVersion: '1.0.835',
config:
{ diagnostics: {},
testFramework: { version: 'jest@24.8.0', configurator: 'jest@24.8.0', reporter: 'jest@24.8.0', starter: 'jest@24.8.0', autoDetected: true },
filesWithCoverageCalculated: [],
micromatch: true,
files:
[ { pattern: '/node_modules/', regexp: /\/node_modules\//, ignore: true, trigger: true, load: true },
{ pattern: 'dist/|build/|coverage/|/\\.idea/|/\\.vscode/|/\\.git/|/\\.gitlab/', regexp: /dist\/|build\/|coverage\/|\/\.idea\/|\/\.vscode\/|\/\.git\/|\/\.gitlab\//, ignore: true, trigger: true, load: true },
{ pattern: '**/**', ignore: false, trigger: true, load: true, order: 1 },
{ pattern: '**/+(*.)+(spec|test).+(ts|js)?(x)', ignore: true, trigger: true, load: true } ],
tests:
[ { pattern: '/node_modules/', regexp: /\/node_modules\//, ignore: true, trigger: true, load: true, test: true },
{ pattern: 'dist/|build/|coverage/|/\\.idea/|/\\.vscode/|/\\.git/|/\\.gitlab/',
regexp: /dist\/|build\/|coverage\/|\/\.idea\/|\/\.vscode\/|\/\.git\/|\/\.gitlab\//,
ignore: true,
trigger: true,
load: true,
test: true },
{ pattern: '**/+(*.)+(spec|test).+(ts|js)?(x)', ignore: false, trigger: true, load: true, test: true, order: 2 } ],
filesWithNoCoverageCalculated: [],
runAllTestsInAffectedTestFile: false,
compilers: {},
preprocessors: {},
maxConsoleMessagesPerTest: 100,
autoConsoleLog: true,
delays: { run: 0, edit: 100, update: 0 },
workers: { initial: 0, regular: 0, recycle: false },
teardown: undefined,
hints:
{ ignoreCoverage: '__REGEXP /ignore coverage|istanbul ignore/',
ignoreCoverageForFile: '__REGEXP /ignore file coverage/',
commentAutoLog: '?',
testFileSelection: { include: '__REGEXP /file\\.only/', exclude: '__REGEXP /file\\.skip/' } },
automaticTestFileSelection: true,
runSelectedTestsOnly: false,
extensions: {},
env: { type: 'node', params: {}, runner: '<homeDir>/.nvm/versions/node/v10.16.3/bin/node', viewportSize: { width: 800, height: 600 }, options: { width: 800, height: 600 }, bundle: true },
reportUnhandledPromises: true,
slowTestThreshold: 75,
lowCoverageThreshold: 80,
loose: true,
configCode: 'auto.detect#-501994785' },
fs: { numberOfFiles: 32 },
debug:
[ '2020-02-09T15:26:30.966Z config Detected Jest.\n',
'2020-02-09T15:26:30.971Z config Detected Angular CLI.\n',
'2020-02-09T15:26:30.974Z config Configured Jest.\n',
'2020-02-09T15:26:30.976Z project Wallaby Node version: v10.16.3\n',
'2020-02-09T15:26:30.976Z project Wallaby config: <homeDir>/Projects/ng.amsterdam/apps/website/auto.detect\n',
'2020-02-09T15:26:31.718Z project File cache: <homeDir>/Library/Caches/WebStorm2019.3/wallaby/projects/f64cbcc90d607bf6\n',
'2020-02-09T15:26:31.727Z uiService Listening port 51235\n',
'2020-02-09T15:26:31.734Z workers Parallelism for initial run: 6, for regular run: 3\n',
'2020-02-09T15:26:31.735Z workers Starting run worker instance #0\n',
'2020-02-09T15:26:31.735Z workers Starting run worker instance #1\n',
'2020-02-09T15:26:31.735Z workers Starting run worker instance #2\n',
'2020-02-09T15:26:31.735Z workers Starting run worker instance #3\n',
'2020-02-09T15:26:31.735Z workers Starting run worker instance #4\n',
'2020-02-09T15:26:31.735Z workers Starting run worker instance #5\n',
'2020-02-09T15:26:31.736Z workers Web server is listening at 55647\n',
'2020-02-09T15:26:31.736Z project File cache requires some updates, waiting required files from IDE\n',
'2020-02-09T15:26:31.765Z project Stopping process pool\n',
'2020-02-09T15:26:31.772Z project Test run started; run priority: 3\n',
'2020-02-09T15:26:31.773Z project Running all tests\n',
'2020-02-09T15:26:31.777Z workers Starting test run, priority: 3\n',
'2020-02-09T15:26:31.777Z nodeRunner Starting sandbox [worker #0, session #nh21j]\n',
'2020-02-09T15:26:31.777Z nodeRunner Preparing sandbox [worker #0, session #nh21j]\n',
'2020-02-09T15:26:32.099Z workers Started run worker instance (delayed) #1\n',
'2020-02-09T15:26:32.100Z workers Started run worker instance (delayed) #0\n',
'2020-02-09T15:26:32.101Z nodeRunner Prepared sandbox [worker #0, session #nh21j]\n',
'2020-02-09T15:26:32.101Z workers [worker #0, session #nh21j] Running tests in sandbox\n',
'2020-02-09T15:26:32.105Z workers Started run worker instance (delayed) #2\n',
'2020-02-09T15:26:32.105Z workers Started run worker instance (delayed) #5\n',
'2020-02-09T15:26:32.105Z workers Started run worker instance (delayed) #3\n',
'2020-02-09T15:26:32.107Z workers Started run worker instance (delayed) #4\n',
'2020-02-09T15:26:34.921Z workers [nh21j] Loaded unknown number of test(s)\n',
'2020-02-09T15:26:35.071Z workers [nh21j] Test executed: should create the app\n',
'2020-02-09T15:26:35.072Z workers Failed to map the stack to user code, entry message: Error: Uncaught (in promise): Failed to load app.component.html, stack: Error: Uncaught (in promise): Failed to load app.component.html\n at resolvePromise (<homeDir>/Projects/ng.amsterdam/node_modules/zone.js/dist/zone.js:836:35)\n at resolvePromise (<homeDir>/Projects/ng.amsterdam/node_modules/zone.js/dist/zone.js:795:21)\n at <homeDir>/Projects/ng.amsterdam/node_modules/zone.js/dist/zone.js:897:21\n at ZoneDelegate.invokeTask (<homeDir>/Projects/ng.amsterdam/node_modules/zone.js/dist/zone.js:431:35)\n at AsyncTestZoneSpec.onInvokeTask (<homeDir>/Projects/ng.amsterdam/node_modules/zone.js/dist/async-test.js:86:33)\n at ProxyZoneSpec.onInvokeTask (<homeDir>/Projects/ng.amsterdam/node_modules/zone.js/dist/proxy.js:145:43)\n at ZoneDelegate.invokeTask (<homeDir>/Projects/ng.amsterdam/node_modules/zone.js/dist/zone.js:430:40)\n at Zone.runTask (<homeDir>/Projects/ng.amsterdam/node_modules/zone.js/dist/zone.js:198:51)\n at drainMicroTaskQueue (<homeDir>/Projects/ng.amsterdam/node_modules/zone.js/dist/zone.js:611:39)\n \n',
'2020-02-09T15:26:35.075Z workers [nh21j] Test executed: should have as title \'ngAmsterdam\'\n',
'2020-02-09T15:26:35.076Z workers [nh21j] Test executed: should have as text \'Coming Soon!\'\n',
'2020-02-09T15:26:35.078Z workers [nh21j] Run 3 test(s), skipped 0 test(s)\n',
'2020-02-09T15:26:35.080Z workers [nh21j] Sandbox is responsive, closing it\n',
'2020-02-09T15:26:35.081Z project Test run finished\n',
'2020-02-09T15:26:35.081Z project Processed console.log entries\n',
'2020-02-09T15:26:35.082Z project Processed loading sequences\n',
'2020-02-09T15:26:35.082Z project Processed executed tests\n',
'2020-02-09T15:26:35.083Z project Processed code coverage\n',
'2020-02-09T15:26:35.098Z project Test run result processed and sent to IDE\n' ] }
package.json
{
"name": "projectName",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"nx": "nx",
"start": "ng serve",
"build": "ng build --prod",
"test": "ng test",
"lint": "nx workspace-lint && ng lint",
"e2e": "ng e2e",
"affected:apps": "nx affected:apps",
"affected:libs": "nx affected:libs",
"affected:build": "nx affected:build",
"affected:e2e": "nx affected:e2e",
"affected:test": "nx affected:test",
"affected:lint": "nx affected:lint",
"affected:dep-graph": "nx affected:dep-graph",
"affected": "nx affected",
"format": "nx format:write",
"format:write": "nx format:write",
"format:check": "nx format:check",
"precise-commits": "precise-commits",
"precommit": "npm run precise-commits",
"update": "ng update @nrwl/workspace",
"update:check": "ng update",
"workspace-schematic": "nx workspace-schematic",
"dep-graph": "nx dep-graph",
"help": "nx help",
"postinstall": "ngcc --properties es2015 browser module main --first-only --create-ivy-entry-points"
},
"private": true,
"dependencies": {
"@angular/animations": "^9.0.0",
"@angular/common": "^9.0.0",
"@angular/compiler": "^9.0.0",
"@angular/core": "^9.0.0",
"@angular/forms": "^9.0.0",
"@angular/platform-browser": "^9.0.0",
"@angular/platform-browser-dynamic": "^9.0.0",
"@angular/router": "^9.0.0",
"@nrwl/angular": "^9.0.0-rc.2",
"core-js": "^2.5.4",
"rxjs": "~6.5.4",
"tslib": "^1.10.0",
"zone.js": "~0.10.2"
},
"devDependencies": {
"@angular-builders/custom-webpack": "^8.2.0",
"@angular-devkit/build-angular": "~0.900.1",
"@angular/cli": "9.0.1",
"@angular/compiler-cli": "^9.0.0",
"@angular/language-service": "^9.0.0",
"@nrwl/cypress": "^9.0.0-rc.2",
"@nrwl/jest": "9.0.0-rc.2",
"@nrwl/workspace": "9.0.0-rc.2",
"@types/jest": "24.0.9",
"@types/node": "^12.11.1",
"codelyzer": "^5.1.2",
"cypress": "3.8.3",
"dotenv": "6.2.0",
"eslint": "6.1.0",
"husky": "^3.0.9",
"jest": "24.1.0",
"jest-preset-angular": "8.0.0",
"postcss-import": "^12.0.1",
"postcss-loader": "^3.0.0",
"postcss-scss": "^2.0.0",
"precise-commits": "^1.0.2",
"prettier": "1.18.2",
"tailwindcss": "^1.1.3",
"ts-jest": "24.0.0",
"ts-node": "~7.0.0",
"tslint": "~5.11.0",
"typescript": "~3.7.5"
},
"prettier": {
"singleQuote": true,
"overrides": [
{
"files": "*.md",
"options": {
"parser": "markdown"
}
},
{
"files": "*.json",
"options": {
"parser": "json"
}
}
]
}
}
@wilgert - thanks for the update. The change we made 2 days ago was to only attempt to set InlineHtmlStripStylesTransformer
for jest-preset-angular when using v7.x, and otherwise for v8.x we did nothing (assuming that the default in v8.x would be OK). Today we have updated our integration to set astTransformers
for v8.x, which should fix the new problem for you.
Could you please update to the latest version of Wallaby core (v1.0.836) and confirm this is working for you?
I'm still getting the same error unfortunately. Now on core v1.0.838
Unfortunately we are unable to replicate your problem. We have set up a sample repository with the same dependencies and an Angular v8.x project that was upgraded to v9.x.
Could you please clone the sample repo that we created and confirm that everything is working for you:
git clone git@github.com:wallabyjs/wallaby2327.git
cd wallaby2327
npm install
Open WebStorm
Automatic Configuration
and the root path set to \apps\angularapp
If that is working for you, could you please compare our sample to your project and copy over the configuration parts of your project that are different to see if you can replicate the problem in our sample repo? Alternatively, could you please provide us with a sample of your project/structure so that we can see replicate the problem ourselves?
Thank you for taking the time to try and reproduce it.
It was hard to make sense of the differences between the sample repo and my own project.
In the end I got my tests working by doing ng update @nrwl/workspace@9.0.0-rc.4
.
Previously I was on @nrlw/*@9.0.0-rc.2
while your repo was on 9.0.0-rc.1
. So there must have been a bug in version9.0.0-rc.2
of @nrwl/*
.
Problem solved! Again thank you very much!
As of today we have added experimental support to Wallaby's automatic configuration for nx workspaces (both angular.json
and workspace.json
) that use jest (the nx default) as their test runner. Both Angular and React project types are supported. Please note that your @nrwl/workspace
version must be >= 8.0.0.
If you are using a configuration file, you should be able to switch your Wallaby project to use automatic configuration. If you encounter problems using automatic configuration, please let us know. This will allow you to run Wallaby for all projects in your nx workspacce.
Could wallaby make use of the affected
intelligence of Nx to determine which tests to run?
Could wallaby make use of the affected intelligence of Nx to determine which tests to run?
Why/when do you think Wallaby needs it? Initially Wallaby needs to run all tests (unless you want an exclusive test run), and then during incremental runs Wallaby has a pretty good knowledge of what tests to run based on your changes. Not sure if nx affected
is capable on operating on a more granular level than Wallaby, for example Wallaby will only run one test (not all tests in the test file) if you change that test.
Maybe in a really large project, with thousands of tests you do not want Wallaby to run all tests initially. But only the tests that are relevant as indicated by the affected
command.
Issue description or question
Just updated to Angular 9 in an Nx workspace. Getting an error probably because there is a new version of
jest-preset-angular
that is not yet supported by WallabyJS with auto configuration.Running the test by starting Jest from the terminal works fine.
Wallaby diagnostics report