Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

web.dev consistently errors on Network.getResponseBody for main content #10876

Closed
brendankenny opened this issue May 29, 2020 · 16 comments · Fixed by #14520
Closed

web.dev consistently errors on Network.getResponseBody for main content #10876

brendankenny opened this issue May 29, 2020 · 16 comments · Fixed by #14520

Comments

@brendankenny
Copy link
Member

brendankenny commented May 29, 2020

  • run node lighthouse-cli/index.js https://web.dev --only-categories best-practices --view
  • get Properly defines charset – Error!

(also happens in DevTools and PSI)

lighthouse error

Example report

The error is

Required MainDocumentContent gatherer encountered an error: Protocol error (Network.getResponseBody): No resource with given identifier found

and occurs here in driver when called from main-document-content.

It seems unusual that the main document content wouldn't be available for the backend. @robdodson does mention some unusual things done with the service worker and "an app shell that pulls in an index.json of the page content when you go to other pages. We essentially replace main content area with this new content" that could be causing trouble (maybe the request really didn't have any content?).

@rpong
Copy link

rpong commented Jun 2, 2020

We are experiencing the same issue with the lighthouse npm package. leaving a comment to follow this thread.

@robdodson
Copy link
Contributor

btw I noticed that our service worker was being too aggressive (GoogleChrome/web.dev#3089). @brendankenny I tried to use canary to audit our staging server (https://web-dev-staging.appspot.com/) since it doesn't install the sw, but got an error
image

@connorjclark
Copy link
Collaborator

@robdodson #10883

should get fixed for next chromium canary

@Vadorequest
Copy link

Running into this too for the first time today. I got scored 0 for "Best Practices" when analyzing this website: https://nrn-v2-mst-aptd-at-lcz-sty-c1-ah8bmgx1e.vercel.app/en

LH Report: https://lighthouse-dot-webdotdevsite.appspot.com//lh/html?url=https%3A%2F%2Fnrn-v2-mst-aptd-at-lcz-sty-c1-ah8bmgx1e.vercel.app%2Fen#best-practices

image

image

@thepassle
Copy link

thepassle commented Aug 25, 2020

We're also running into this problem at modern-web.dev:

Screenshot 2020-08-25 at 16 50 08

It seems like disabling the service worker 'fixes' the problem. We dont do anything fancy with our service worker — we either load an index.html either from network or from cache, we dont do any transformations on the html or anything like that. I really fail to see the connection between the service worker and defining a charset in the html ☹️

@patrickhulce
Copy link
Collaborator

I really fail to see the connection between the service worker and defining a charset in the html ☹️

Certain service workers mean that Lighthouse cannot fetch the HTML document to check for a charset. Error! means a Lighthouse bug, not something the page needs to fix (see #9968)

@thepassle
Copy link

thepassle commented Aug 28, 2020

We debugged a little bit more, we use a code snippet to reload the page when a new service worker has taken over:

if("serviceWorker"in navigator){let e;navigator.serviceWorker.addEventListener("controllerchange",()=>{e||(e=!0,window.location.reload())})}

With that piece of code:

Screenshot 2020-08-28 at 12 55 47

Without that piece of code:

Screenshot 2020-08-28 at 13 02 51

It seems that the reload is causing the best practices to error, hope that helps 🙂

EDIT:

In case anybody wants to workaround this, this seems to fix it. Also skips an unnecessary reload the first time a user visits your app (even though its so fast you might not have noticed)

        async function handleUpdate() {
          if ("serviceWorker"in navigator) {
            let refreshing;

            const oldSw = (await navigator.serviceWorker.getRegistration())?.active?.state;

            navigator.serviceWorker.addEventListener('controllerchange', async () => {
              if (refreshing) return;

              const newSw = (await navigator.serviceWorker.getRegistration())?.active?.state;

              if(oldSw === 'activated' && newSw === 'activating') {
                refreshing = true;
                window.location.reload();
              }
            });
          }
        }

        handleUpdate();

@patrickhulce
Copy link
Collaborator

Ah thanks @thepassle that helps a lot! I think this is happening because Chrome might only keep the network resources from the current page load in the memory cache which is what Lighthouse relies on to get the response body of the root document. We can do a bit more digging but this is a great head start 👍

related #8984 #11027

@robdodson
Copy link
Contributor

We use a similar snippet on web.dev

@wreszelewski
Copy link

wreszelewski commented Nov 10, 2022

I run into this issue and made some debugging. I confirmed what @patrickhulce suggested. The problem is in NetworkAnalyzer.findOptionalMainDocument:

if (finalURL) {
      // equalWithExcludedFragments is expensive, so check that the finalUrl starts with the request first
      const mainResource = records.find(request => finalURL.startsWith(request.url) &&
        URL.equalWithExcludedFragments(request.url, finalURL));
      if (mainResource) return mainResource;
      // TODO: beacon !mainResource to Sentry, https://github.com/GoogleChrome/lighthouse/issues/7041
}

When reload is performed records variable contains multiple entries for the same url and only the last one can be get from memory cache. I can't find findOptionalMainDocument on main branch, so is there a point of fixing it basing on current release?

EDIT:
I found that problem still persists in new method:
https://github.com/GoogleChrome/lighthouse/blob/main/core/lib/dependency-graph/simulator/network-analyzer.js#L439

@frankii91
Copy link

I have the same problem, it's not only visible on my website. I have a more extensive worker service. Which is only a transitional version anyway. Can anyone help me solve the coding problem or improve the worker code? My website https://i-meble.eu

@adamraine
Copy link
Member

@frankii91 The issue is not reproducible on that site

@frankii91
Copy link

frankii91 commented Sep 29, 2023

Strange, the problem occurs all the time, I use the plugin in Chrome

Zrzut ekranu 2023-09-29 212932

@adamraine
Copy link
Member

The fix appears in version 11.1.0, PSI and the Chrome extension still use 11.0.0

@tunetheweb
Copy link
Member

tunetheweb commented Dec 15, 2023

@adamraine got another report for this site: https://leverx.com/

Testing it locally in Chrome (on 11.3.0) the error still shows. Any ideas why?

@adamraine
Copy link
Member

@tunetheweb looks like a different issue that is reproducible without Lighthouse. I'll open a new issue since this one is pretty old.

@GoogleChrome GoogleChrome locked as resolved and limited conversation to collaborators Dec 19, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

Successfully merging a pull request may close this issue.