Service worker does not cache script files

[wesleycho]

Is this a bug report?

Yes

Did you try recovering your dependencies?

Yes, although this is irrelevant to this issue

Which terms did you search for in User Guide?

Service Worker, Service Workers

Environment

1. node -v: 8.9.1
2. npm -v: 5.5.1
3. yarn --version (if you use Yarn): 1.5.1
4. npm ls react-scripts (if you haven’t ejected): 1.1.1

Then, specify:

1. Operating system: macOS 10.13.5
2. Browser and version (if relevant): N/A

Steps to Reproduce

(Write your steps here:)

1. Create a new project with CRA
2. Execute a production build (yarn build)
3. Serve the application behind a server that intercepts requests to any static assets in the built project and redirects for authentication
4. Expire the authentication session
5. Refresh

Notice then that the app script is never cached, which then is requested by the browser and returns potentially a login page from the server redirection

Expected Behavior

I expect the service worker to cache main.js.

Actual Behavior

The service worker generated does not include any JS script reference.

Reproducible Demo

Unfortunately I cannot link a reproducible demo here for legal reasons.

Note that this was reported prior in #3595 but never fixed. This is a serious issue for us because if the index.html file is cached but the script is not, when the service worker loads the cached index.html file, it will then make a request for the app script, but the request will never properly return the data because of the authentication layer. Disabling the authentication requirement is not an option, so our only workaround currently is to disable the service worker.

There does not appear to be a technical limitation preventing this from being possible that I can tell, as the CSS is properly cached by the service worker, and the service worker precache webpack plugin does support script caching with importScripts.

I would love to see this fixed, as it is the only issue gating us using service workers - unfortunately I do not have the time until at least a month later to start to do a deep dive & get legal approval (impending work deadline & vacation for a month). I would be happy to demonstrate a reproduction in person though if necessary (I work for one of the biggest tech employers in the South Bay if it helps).

[andriijas]

can you provide your asset-manifest.json and service-worker.js from your build dir or create an isolated repository demonstrating the issue?

[wesleycho]

Unfortunately no, due to legal reasons. This should be wholly reproducible from scratch (minus the authentication steps) and can be easily seen from code analysis of the generated service worker & there being no inclusion of the app script main.js anywhere though.

[andriijas]

I scaffolded a new CRA app and compiled the production build. the main.js is in the service-worker.js file.

Whats the file size of your main.js?

[wesleycho]

1.9 MB - this should be fine based on what I see https://github.com/GoogleChromeLabs/sw-precache#maximumfilesizetocacheinbytes-number

[surielmx]

Hi, I have the same issue, my project has service worker, but apparently don't exists. Lighthouse respond 'Does not register a service worker'. Do I need to do extra configuration?

[drewbard]

Most likely the issue is your bundled javascript is larger than the default 2 MB sw-precache limit. To help debug this you should comment out https://github.com/facebook/create-react-app/blob/next/packages/react-scripts/config/webpack.config.prod.js#L475 to see if it's skipping a static resource. You can also check out your bundled js with source analyzer.

Maybe this max size should be emphasized in the service worker section of the README?

[jdetle]

@drewbard, I think from previous conversations the fix should also include a meaningful error message in the build process.

See #4260, #3882 (comment).

It's important to note that errors from this ARE NOT solved by unregistering the service worker.

[stale]

This issue has been automatically marked as stale because it has not had any recent activity. It will be closed in 7 days if no further activity occurs.