question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Question: Nested paths breaks lighthouse PWA test

See original GitHub issue

I have found some problems when using nested routes with the plugin: lighthouse cannot resolve start_url when in nested path route, for example just request https://vitesse.netlify.app/hi/a in private mode on chrome, open dev tools and run lighthouse with PWA check checked:

imagen

The problem in question can be solved just adding the scope to the manifest.webmanifest file and also initializing it with the basePath.

By default it is initialized as ./, and I don’t know if this value is ok to be used as scope when registering the service worker. I register it using router.isReady callback instead on index page and change the default pattern to be /, and so the header, the manifest.webmanifest and the registration matches:

imagen

This is because it seems that the nested parent path acts as a new scope, that is distinct from the missing scope.

Another think that I don’t know if it is required is to add a header like that to the html (I just add it as a http header from the server side):

service-worker-allowed: `${basePath}`

Here is a working manifest.webmanifest.

You can see a working sample here: https://cancer.malvarez.info/conozca-su-riesgo, then click on + icon and run the test (it is with vite 1 + vitesse 1, I’m migrating it to vite 2 + vitesse 2).

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:27 (25 by maintainers)

github_iconTop GitHub Comments

1reaction
userquincommented, Feb 10, 2021

Something is wrong @antfu , go to vitesse demo page, then open manifest from devtools, it is base64 encoded.

You must configure netlify to server manifest.webmanifest files with application/manifest+json content type, it is being served with application/octet-stream content type.

imagen

1reaction
antfucommented, Feb 6, 2021

The scope would be set to base by default from v0.4.6. I think it’s good to make things just works if possible, thanks for the notice and suggestions

Read more comments on GitHub >

github_iconTop Results From Across the Web

Question: Nested paths breaks lighthouse PWA test · Issue #23
I have found some problems when using nested routes with the plugin: lighthouse cannot resolve start_url when in nested path route, ...
Read more >
Can't pass Chrome Lighthouse PWA test even when service ...
I'm building a progressive web app bundled by webpack which uses service workers generated by workbox. When I ran the Chrome Lighthouse on ......
Read more >
lighthouse/changelog.md - UNPKG
276, ## Breaking Changes for programmatic users ; 277 ; 278, These changes are unlikely to affect end users, but may be important...
Read more >
Accessibility Auditing | The Odin Project
Lighthouse provides more than just a11y auditing, including performance, best practices, search engine optimization (SEO), and progressive web app (PWA) if ...
Read more >
Lighthouse overview - Chrome Developers
Learn how to set up Lighthouse to audit your web apps. ... Check out the video below from Google I/O to learn more...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found