angular: ServiceWorkerModule.register is not Universal friendly.

I’m submitting a…


[ ] Regression (a behavior that used to work and stopped working in a new release)
[x] Bug report  
[ ] Feature request
[ ] Documentation issue or request
[ ] Support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior

When having setup the ServiceWorkerModule in your AppModule it crashes when the server is trying to render the application because of the navigator object not being defined in the server.

Expected behavior

No crash.

Minimal reproduction of the problem with instructions

ReferenceError: navigator is not defined at Array.initializer (C:\Users\Stan\Documents\bravobit-web\functions\node_modules\@angular\service-worker\bundles\service-worker.umd.js:373:34) at ApplicationInitStatus.runInitializers (C:\Users\Stan\Documents\bravobit-web\functions\node_modules\@angular\core\bundles\core.umd.js:3490:67) at C:\Users\Stan\Documents\bravobit-web\functions\node_modules\@angular\core\bundles\core.umd.js:5418:28 at _callAndReportToErrorHandler (C:\Users\Stan\Documents\bravobit-web\functions\node_modules\@angular\core\bundles\core.umd.js:5597:39) at C:\Users\Stan\Documents\bravobit-web\functions\node_modules\@angular\core\bundles\core.umd.js:5416:20 at ZoneDelegate.invoke (C:\Users\Stan\Documents\bravobit-web\functions\node_modules\zone.js\dist\zone-node.js:392:26) at Object.onInvoke (C:\Users\Stan\Documents\bravobit-web\functions\node_modules\@angular\core\bundles\core.umd.js:4668:33) at ZoneDelegate.invoke (C:\Users\Stan\Documents\bravobit-web\functions\node_modules\zone.js\dist\zone-node.js:391:32) at Zone.run (C:\Users\Stan\Documents\bravobit-web\functions\node_modules\zone.js\dist\zone-node.js:142:43) at NgZone.run (C:\Users\Stan\Documents\bravobit-web\functions\node_modules\@angular\core\bundles\core.umd.js:4485:69)

What is the motivation / use case for changing the behavior?

The server should not crash because of a undefined property.

Environment


Angular version: 5.0.1


Browser:
- [x] Chrome (desktop) version XX
- [x] Chrome (Android) version XX
- [x] Chrome (iOS) version XX
- [x] Firefox version XX
- [x] Safari (desktop) version XX
- [x] Safari (iOS) version XX
- [x] IE version XX
- [x] Edge version XX
 
For Tooling issues:
- Node version: 8.8.1 
- Platform: Windows

Others:

About this issue

Original URL
State: closed
Created 7 years ago
Reactions: 8
Comments: 23 (9 by maintainers)

Commits related to this issue

fix(service-worker): ensure initialised in browser only closes #20360 — committed to Toxicable/angular by deleted user 7 years ago
fix(service-worker): ensure initialised in browser only closes #20360 — committed to Toxicable/angular by deleted user 7 years ago
fix(service-worker): ensure initialised in browser only closes #20360 — committed to Toxicable/angular by deleted user 7 years ago
fix(service-worker): ensure initialised in browser only closes #20360 — committed to Toxicable/angular by deleted user 7 years ago
fix(service-worker): ensure initialised in browser only closes #20360 — committed to Toxicable/angular by deleted user 7 years ago
fix(service-worker): ensure initialised in browser only closes #20360 — committed to Toxicable/angular by deleted user 7 years ago
fix(service-worker): ensure initialised in browser only closes #20360 — committed to alxhub/angular by deleted user 7 years ago
fix(service-worker): ensure initialised in browser only closes #20360 — committed to alxhub/angular by deleted user 7 years ago
fix(service-worker): ensure initialised in browser only closes #20360 — committed to alxhub/angular by deleted user 7 years ago
fix(service-worker): ensure initialised in browser only closes #20360 — committed to alxhub/angular by deleted user 7 years ago
fix(service-worker): ensure initialised in browser only closes #20360 — committed to alxhub/angular by deleted user 7 years ago
fix(service-worker): ensure initialised in browser only closes #20360 — committed to alxhub/angular by deleted user 7 years ago
fix(service-worker): ensure initialised in browser only closes #20360 — committed to alxhub/angular by deleted user 7 years ago
fix(service-worker): ensure initialised in browser only closes #20360 — committed to alxhub/angular by deleted user 7 years ago
fix(service-worker): ensure initialised in browser only (#20782) closes #20360 PR Close #20782 — committed to angular/angular by deleted user 7 years ago
fix(service-worker): ensure initialised in browser only (#20782) closes #20360 PR Close #20782 — committed to angular/angular by deleted user 7 years ago

Most upvoted comments

cc @alxhub

A temporary workaround is to have a separate AppBrowserModule and AppServerModule with a common AppModule. Then you can load the ServiceWorkerModule into the AppBrowserModule and preserve your builds.

CaerusKaru on Nov 11, 2017

@cyrilletuzi @Toxicable had concerns about integration testing and passed the buck to @alxhub to implement. If you use either mine or @maciejtreder’s workaround, you should be able to take advantage of the new AppShell feature without issue until this gets patched.

CaerusKaru on Nov 23, 2017

Too bad it didn’t make into 5.0.5 with all the others SW fixes…

cyrilletuzi on Dec 2, 2017

@maciejtreder I cannot get ServiceWorkerModule.register('./ngsw-worker.js') to ever load the file… Not sure what I am missing. Driving me crazy

patrickmichalina on Nov 23, 2017

As a workaround, you can also provide “MockModule” for the server build.

Check out my solution here: https://github.com/maciejtreder/angular-universal-pwa

Here is module used for server-side rendering: https://github.com/maciejtreder/angular-universal-pwa/pull/65/files#diff-6bfb9b4181ded81b72a3656654e0f183

And here faked module with services: https://github.com/maciejtreder/angular-universal-pwa/pull/65/files#diff-9f8098d50dad87159602d9f8f1682d5d https://github.com/maciejtreder/angular-universal-pwa/pull/65/files#diff-c6dbc4965270cce2acf71a57db7ee05d

maciejtreder on Nov 13, 2017