angular/angular-cli

@angular-devkit/build-angular:app-shell builder produces distribution index.html missing script tags referencing the main, runtime, and polyfills chunks when the source index.html contains a self-closing <app-root /> tag

rewento opened this issue · 2 comments

Command

run

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

If a self-closing tag bearing the selector of the AppComponent (<app-root />) is included in the source index.html rather than both opening and closing tags bearing that selector (<app-root></app-root>), and a distribution with an app shell is built with the ng run my-app:app-shell:production Angular CLI command, the index.html of that distribution will lack <script> tags referencing the "main", "runtime", and "polyfills" bundle chunks.

Minimal Reproduction

Reproduction Steps

  1. Create a new Angular workspace with one application project with this shell command for the Angular CLI:
    new repro-app-shell-issue
    And respond like this to follow-up prompts:
    Would you like to add Angular routing? Yes
    Which stylesheet format would you like to use? CSS
  2. cd into the new repro-app-shell-issue directory and run this command for the Angular CLI:
    ng generate app-shell
  3. Create a distribution for the app project without an app shell with the ng build repro-app-shell-issue --configuration production Angular CLI command. Examine the index.html of the distribution (dist/repro-app-shell-issue/browser/index.html) and note that it contains <script> tags referencing the "main", "runtime", and "polyfills" bundle chunks.
  4. Create a distribution for the app project with an app shell with the ng run repro-app-shell-issue:app-shell:production Angular CLI command. Examine the index.html of the distribution (dist/repro-app-shell-issue/browser/index.html) and note that it contains <script> tags referencing the "main", "runtime", and "polyfills" bundle chunks.
  5. Modify the source index.html (src/index.html) so that the tag bearing the selector of the AppComponent is self closing. <app-root></app-root> --> <app-root />
  6. Create a distribution for the app project without an app shell with the ng build repro-app-shell-issue --configuration production Angular CLI command. Examine the index.html of the distribution (dist/repro-app-shell-issue/browser/index.html) and note that it contains <script> tags referencing the "main", "runtime", and "polyfills" bundle chunks.
  7. Create a distribution for the app project with an app shell with the ng run repro-app-shell-issue:app-shell:production Angular CLI command. Examine the index.html of the distribution (dist/repro-app-shell-issue/browser/index.html) and note that it DOES NOT CONTAIN <script> tags referencing the "main", "runtime", and "polyfills" bundle chunks.

Reproduction Source Repository
https://github.com/rewento/repro-app-shell-issue/tree/main

Exception or Error

No response

Your Environment

Angular CLI: 16.2.14
Node: 18.18.2
Package Manager: npm 10.5.2
OS: darwin arm64

Angular: 16.2.12
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, platform-server
... router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1602.14
@angular-devkit/build-angular   16.2.14
@angular-devkit/core            16.2.14
@angular-devkit/schematics      16.2.14
@angular/cli                    16.2.14
@schematics/angular             16.2.14
rxjs                            7.8.1
typescript                      5.1.6
zone.js                         0.13.3

Anything else relevant?

No response

This is being reported as error since #27529 in upcoming v18.

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.