Bug: [ngtools] Replace resource transformer issue with conditional `templateUrl`

ahnpnl commented 6 months ago

Command

test

Is this a regression?

[ ] Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

When having conditional templateUrl like this

  templateUrl:
    true === true
        ? './dashboard.component.html'
        : './dashboard.component.copy.html',

replace_resources.ts couldn't transform into proper codes (either require or import)

Minimal Reproduction

Run this test file https://github.com/ahnpnl/angular-cli/blob/bug/replace-resource/packages/ngtools/webpack/src/transformers/replace_resources_spec.ts
Observe test failed
Print out the output which would contain something like
```
// esm
```

//... AppComponent = decorate([ Component({ selector: 'app-root', templateUrl: true === true ? './app.component.html' : './app.component.copy.html', styles: [NG_CLI_RESOURCE0, NG_CLI_RESOURCE__1] }) ], AppComponent);

// commonjs

//... exports.AppComponent = AppComponent = tslib_1.__decorate([ (0, core_1.Component)({ selector: 'app-root', templateUrl: true === true ? './app.component.html' : './app.component.copy.html', styles: [require("./app.component.css?ngResource"), require("./app.component.2.css?ngResource")] }) ], AppComponent);


### Exception or Error

```text
Component 'AppComponent' is not resolved:
     - templateUrl: ./app.component.html
    Did you run and wait for 'resolveComponentResources()'?


### Your Environment

```text
Angular CLI: 17.3.6
Node: 20.12.2
Package Manager: yarn 1.22.17
OS: darwin x64

Angular: 18.0.0-rc.0
... animations, cdk, common, compiler, compiler-cli, core, forms
... localize, material, platform-browser
... platform-browser-dynamic, platform-server, router
... service-worker

Package                      Version
------------------------------------------------------
@angular-devkit/architect    0.0.0-EXPERIMENTAL-PLACEHOLDER
@angular-devkit/core         0.0.0-PLACEHOLDER
@angular-devkit/schematics   0.0.0-PLACEHOLDER
@angular/bazel               18.1.0-next.0+sha-1872fcd
@angular/build-tooling       0.0.0-e6e98d32d7d4d350ecf4ec10ad9c7e75198daabd
@angular/ng-dev              <error>
@schematics/angular          0.0.0-PLACEHOLDER
ng-packagr                   18.0.0-rc.0
rxjs                         7.8.1
typescript                   5.4.5
webpack                      5.91.0
zone.js                      0.14.4

Anything else relevant?

alan-agius4 commented 6 months ago

During JIT compilations, this is expected to fail since the transformer doesn't evaluate expressions. The templateUrl should be a string literal.

ahnpnl commented 6 months ago

Should we throw an error from transformer to have a more descriptive error for this case? The current error message isn’t really clear about this caveat

alan-agius4 commented 6 months ago

We should probably add an error or warning message.

santoshyadavdev commented 6 months ago

@alan-agius4 I can take this one.

angular / angular-cli