CODEWITHSUNDEEP
angularprogressive-web-appslighthouseangular-pwa
WilChrist
WilChrist

Reputation: 43

Why does my Angular PWA fails on Lighthouse PWA audit while everything work fine when i manually test it?

I you go to the app https://quotesaboutjesus.netlify.com/quotes and look at Application tab in Chrome Dev tool, you'll see after few seconds the service worker runing well... and the app work well in online mode.

But Lighthouse audit result always says me :

But as you'll see in my code here or directly in my manifest.webmanifest here, i did (i think ?: because Lighthouse says me i didn't) :

  1. add a web app manifest.
  2. Check that the start_url in your manifest is correct.
  3. Add a service worker to your app.
  4. Use the service worker to cache files locally.
  5. When offline, use the service worker as a network proxy to return the locally cached version of the file.

So i don't understand why i fails the audit test (you can easily reproduce it yourself online).

i imagined that it can be cause by the fact that my SW register a little late, so i try to optimise the performance of the app, but even now it has better performances score (90 at least during audit test), it's didn't pass this test.

Can someone help me ?

Image showing the Lighthouse error messages

Image showing the service worker working well

Image Showing the (start_ul in) manifest

Upvotes: 3

Views: 2603

Answers (1)

Jalaleddin Hosseini
Jalaleddin Hosseini

Reputation: 2272

I had this issue too, then I found this solution in : https://stackoverflow.com/a/61152966/8581106

you should add registrationStrategy: "registerImmediately" to serviceWorker registeration in app.module:

ServiceWorkerModule.register("ngsw-worker.js", {
            enabled: environment.enableProdMode,
            registrationStrategy: "registerImmediately"
}),

as mentioned in

Upvotes: 1

Related Questions