ng generate universal (after adding pwa) update main.ts incorrectly causing syntax error

[Jun711]

Bug Report or Feature Request (mark with an x)

- [x] bug report -> please search issues before submitting
- [ ] feature request

Command (mark with an x)

- [ ] new
- [ ] build
- [ ] serve
- [ ] test
- [ ] e2e
- [x] generate
- [ ] add
- [ ] update
- [ ] lint
- [ ] xi18n
- [ ] run
- [ ] config
- [ ] help
- [ ] version
- [ ] doc

Versions

node --version
node v11.0.0

npm --version
npm 6.4.1

ng --version
Angular CLI: 7.2.1
Node: 11.0.0
OS: darwin x64
Angular: 7.2.0
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, platform-server, router
... service-worker

Package Version
@angular-devkit/architect 0.12.1
@angular-devkit/build-angular 0.12.1
@angular-devkit/build-optimizer 0.12.1
@angular-devkit/build-webpack 0.12.1
@angular-devkit/core 7.2.1
@angular-devkit/schematics 7.2.1
@angular/cli 7.2.1
@angular/pwa 0.12.1
@ngtools/webpack 7.2.1
@schematics/angular 7.2.1
@schematics/update 0.12.1
rxjs 6.3.3
typescript 3.2.2
webpack 4.23.1

OS
macOS High Sierra

Repro steps

1. check out https://github.com/Jun711/angular-app-shell/tree/master
   Note that when u check out the above repo on master branch, it already has pwa added using ng add @angular/pwa. (the issue might occur only when ng generate universal is done after ng add @angular/pwa but I am not sure if that is the case)

2. on master branch, run ng generate universal uni-app-shell --client-project angular-app-shell

CREATE src/main.server.ts (220 bytes)
CREATE src/app/app.server.module.ts (318 bytes)
CREATE src/tsconfig.server.json (219 bytes)
UPDATE package.json (1461 bytes)
UPDATE angular.json (4794 bytes)
UPDATE src/main.ts (431 bytes)
UPDATE src/app/app.module.ts (649 bytes)
added 4 packages from 5 contributors in 21.384s

3. note the src/main.ts is updated with syntax error:
   The update was from

platformBrowserDynamic().bootstrapModule(AppModule)
  .catch(err => console.error(err));

to

document.addEventListener('DOMContentLoaded', () => {
  platformBrowserDynamic().bootstrapModule(AppModule)
  .catch(err => console.error(err));
);

It just needs an extra closing curly brace.

document.addEventListener('DOMContentLoaded', () => {
  platformBrowserDynamic().bootstrapModule(AppModule)
  .catch(err => console.error(err));
});

I am not sure what source code to edit to fix that. If you could point me to it, I can do a pull request if necessary.

The log given by the failure when I ran ng serve

Date: 2019-01-09T20:25:21.997Z
Hash: 9e6345c3e1fcb145c2b1
Time: 2420ms
chunk {main} main.js, main.js.map (main) 1.86 kB [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 92.4 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 6.08 kB [entry] [rendered]
chunk {styles} styles.js, styles.js.map (styles) 16.6 kB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 322 kB [initial] [rendered]

ERROR in src/main.ts(14,1): error TS1128: Declaration or statement expected.

ℹ ｢wdm｣: Failed to compile.

Desired functionality

to have main.ts updated without any syntax error

Mention any other details that might be useful

[mgechev]

@Jun711 thanks for the catch! I can see a PR already open #13396 ❤️

[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.}