question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

ng test fails to build lazy loading modules

See original GitHub issue

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)

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Reactions:6
  • Comments:11 (6 by maintainers)

github_iconTop GitHub Comments

7reactions
filipesilvacommented, Oct 16, 2017

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

5reactions
leocaseirocommented, Oct 26, 2017

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"
  ]
}

Read more comments on GitHub >

github_iconTop Results From Across the Web

First test is always failing after modularizing and adding lazy ...
I found the reason. The problem was that I was in did having circular dependency. I had some variables in the app.module which...
Read more >
Lazy-loading feature modules - Angular
You can verify that a module is indeed being lazy loaded with the Chrome developer tools. In Chrome, open the developer tools by...
Read more >
Angular performance - Lazy loading Modules and ... - YouTube
Angular performance - Lazy loading Modules and components with and without Routing. Also we take a look into dynamic import and how to ......
Read more >
Chapter 22 Lazy Loading Routes | Angular | Unit Testing
Unit testing the Routes with lazy loaded module is easy.We need to use NgModuleFactoryLoader in our unit test cases.
Read more >
Manually Lazy Load Modules And Components In Angular
In Angular enterprise applications, it is often a requirement to load a configuration from a server via HTTP request which contains a UI...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found