__NG_CLI_RESOURCE__0 is not defined

🐞 Bug report

Command (ng test)

• test

Is this a regression?

Did this behavior used to work in the previous version? Yes, 10.0 was working

Description

when running ng test and I have ng template with template url I got an error

🔬 Minimal Reproduction

commands:

• npm install -g @angular/cli
• ng new template-url-ng-cli-issue ? Would you like to add Angular routing? No ? Which stylesheet format would you like to use? CSS
• cd template-url-ng-cli-issue
• add "module": "CommonJS" tsconfig.spec.json

🔥 Exception or Error

Chrome 85.0.4183.83 (Mac OS 10.15.5) ERROR
  An error was thrown in afterAll
  Uncaught ReferenceError: __NG_CLI_RESOURCE__0 is not defined
  ReferenceError: __NG_CLI_RESOURCE__0 is not defined
      at Object.Sy1n (http://localhost:9876/_karma_webpack_/src/app/app.component.ts:5:3)
      at __webpack_require__ (http://localhost:9876/_karma_webpack_/webpack/bootstrap:79:1)
      at Object.eQIV (http://localhost:9876/_karma_webpack_/src/app/app.component.spec.ts:2:1)
      at __webpack_require__ (http://localhost:9876/_karma_webpack_/webpack/bootstrap:79:1)
      at webpackContext (http://localhost:9876/_karma_webpack_/src sync \.spec\.ts$:8:1)
      at Array.map (<anonymous>)
      at Object.CB3P (http://localhost:9876/_karma_webpack_/src/test.ts:25:16)
      at __webpack_require__ (http://localhost:9876/_karma_webpack_/webpack/bootstrap:79:1)
      at checkDeferredModules (http://localhost:9876/_karma_webpack_/webpack/bootstrap:45:1)
Chrome 85.0.4183.83 (Mac OS 10.15.5): Executed 0 of 0 ERROR (0.006 secs / 0 secs)

Example Repo

https://github.com/alyahmedaly/template-url-ng-cli-issue

Findings

I tried to debug the problem and here a repo with my findings

https://github.com/alyahmedaly/ng-bug-resourceload

if you checked output file for es2015 build looks correct

But for commonJS it’s not correct.

If you check line 10 and line 17 you will see the variable name is not correct

Note: I did copy https://github.com/angular/angular-cli/blob/60a42c28f641d47f635bc1621c7c8ef45de87e76/packages/ngtools/webpack/src/transformers/replace_resources.ts#L131 to reproduce this problem

looks like it’s typescript issue or because this happening in transform phase and ts symbols is already created I don’t know 🤷‍♂️

🌍 Your Environment

Angular CLI: 10.1.0
Node: 12.18.3
OS: darwin x64

Angular: 
... 
Ivy Workspace: 

Package                      Version
------------------------------------------------------
@angular-devkit/architect    0.1001.0
@angular-devkit/core         10.1.0
@angular-devkit/schematics   10.1.0
@schematics/angular          10.1.0
@schematics/update           0.1001.0
rxjs                         6.6.2

[coffeymatt]

I’m seeing the same error just running ng serve since going from 10.0.8 to 10.1.0, can’t start my project

[alan-agius4]

More info: https://github.com/microsoft/TypeScript/issues/18369#issuecomment-329852888

Will land a fix tomorrow.