ng test fails to build lazy loading modules

[tsangste]

Bug Report or Feature Request (mark with an x)

- [x] bug report
- [ ] feature request

Versions.

Angular CLI: 1.5.0-rc.0
Node: 8.5.0
OS: win32 x64
Angular: 5.0.0-rc.2
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cli: 1.5.0-rc.0
@angular-devkit/build-optimizer: 0.0.27
@angular-devkit/core: 0.0.20
@angular-devkit/schematics: 0.0.33
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.8.0-rc.0
@schematics/angular: 0.0.45
typescript: 2.3.4
webpack: 3.7.1

Repro steps.

• ng new apptest
• update packages to latest pre-releases angular 5.0.0-rc.2, angluar/cli 1.5.0-rc.0 and typescript 2.4.0
• Create a module to be lazy loaded
• run ng test

The log given by the failure.

C:\Users\development\apptest>ng test
 10% building modules 1/1 modules 0 active16 10 2017 08:13:36.642:WARN [karma]: No captured browser, open http://localhost:9876/
16 10 2017 08:13:36.662:WARN [karma]: Port 9876 in use
16 10 2017 08:13:36.665:INFO [karma]: Karma v1.7.1 server started at http://0.0.0.0:9877/
16 10 2017 08:13:36.665:INFO [launcher]: Launching browser Chrome with unlimited concurrency
16 10 2017 08:13:36.690:INFO [launcher]: Starting browser Chrome                                                                                                                                                              [../../../../../src/polyfills.ts] ./src/po
lyfills.ts 299 bytes {polyfills} [built] [failed] [1 error]
   [0] multi ./src/polyfills.ts 28 bytes {polyfills} [built]
[../../../../../src/test.ts] ./src/test.ts 299 bytes {main} [built] [failed] [1 error]

ERROR in ./src/test.ts
Module build failed: Error: TypeScript compilation failed.
    at plugin.done.then (C:\Users\development\apptest\node_modules\@ngtools\webpack\src\loader.js:479:27)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:188:7)

ERROR in ./src/polyfills.ts
Module build failed: Error: TypeScript compilation failed.
    at plugin.done.then (C:\Users\development\apptest\node_modules\@ngtools\webpack\src\loader.js:479:27)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:188:7)
 @ multi ./src/polyfills.ts

ERROR in Error: C:/Users/development/apptest/src/app/lazy/lazy.module.ts is not part of the TypeScript compilation. Please include it in your tsconfig via the 'files' or 'include' property.
    at sourceFiles._getChangedTsFiles.map (C:\Users\development\apptest\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:517:31)
    at Array.map (<anonymous>)
    at Promise.resolve.then.then.then (C:\Users\development\apptest\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:513:63)
    at <anonymous>

Desired functionality.

Should build and run tests

Mention any other details that might be useful.

• ng build works fine (jit + aot)
• current workaround is changing tsconfig.spec.json include section to **/*.ts
• works fine in angular 5 with angular-cli 1.4.7(with typescript 2.4.2) and angular 4.4.5 with angular-cli 1.5.0-rc.0 (with typescript 2.3.4)

[filipesilva]

This is a bug, will fix. Thank you for the report 👍

[leocaseiro]

Try add the file polyfills.ts and include "app/**/*" to your tsconfig.spec.json like so:

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/spec",
    "baseUrl": "./",
    "module": "commonjs",
    "target": "es5",
    "types": [
      "jasmine",
      "node"
    ]
  },
  "files": [
    "test.ts",
    "polyfills.ts" // here
  ],
  "include": [
    "app/**/*", // here
    "**/*.spec.ts",
    "**/*.d.ts"
  ]
}

[Manduro]

The workaround ("include": ["**/*.ts"] in tsconfig.spec.json) isn't working for me:

ERROR in ./src/app/lazy/lazy.module.ts
Module build failed: Error: /(...)/src/app/lazy/lazy.module.ts is not part of the compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property.
    at AngularCompilerPlugin.getCompiledFile (/(...)/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:693:23)
    at plugin.done.then (/(...)/node_modules/@ngtools/webpack/src/loader.js:467:39)
    at <anonymous>
 @ ./src/$$_lazy_route_resource lazy
 @ ./node_modules/@angular/core/esm5/core.js
 @ ./src/app/lazy/containers/lazy-page/lazy-page.component.spec.ts
 @ ./src \.spec\.ts$
 @ ./src/test.ts

[dinvlad]

Unfortunately, none of the workarounds listed here work for me either. I'm getting the same error message as @Manduro with workarounds, and @tsangste's message without.

[cexbrayat]

I'm also running into @Manduro error, even with CLI 1.5.0-rc.5 and Angular 5.0.0-rc.7

[balteo]

I am running into the same error as @Manduro with following versions:
Angular CLI: 1.5.0-rc.6
Angular: 5.0.0-rc.8

[balteo]

Same issue with Angular CLI: 1.5.0-rc.7

[filipesilva]

#8215 should fix this bug, but we'll probably require users to update their ./src/tsconfig.spec.json when using CLI 1.5.0 with Angular 5+.

Due to old boilerplate, we had some workarounds for tsconfig.spec.json. It would automatically add polyfills.ts and main.ts to the list of included files if they were not there.

polyfills.ts was needed because tests still need polyfills, but main.ts was needed because we couldn't adequately differentiate between running unit tests or a real app, so we tried to load lazy routes as if it was a normal app.

#8215 should address that.

[filipesilva]

We ended up manually adding polyfills.ts to the compilation even if it's not in tsconfig.spec.json to prevent projects breaking. It will be released as @angular/cli@1.5.0-rc.8.

[Manduro]

@filipesilva Thanks for the fix! It works as expected. I do have a question.

It's noted in polyfills.ts that core-js/es7/reflect is no longer needed when working with aot only, but the unit tests still run on jit. So if I remove the polyfill for production performance, my tests stop working. What do you recommend as a solution? Can we run tests on an aot build?

Edit: found an issue to track including a workaround: #6325

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}