Library Affected:
workbox-sw

Browser & Platform:
Safari 12

Issue or Feature Request Description:
No matter what strategy I use within Workbox, I cannot get a .mp4 to play via Safari that is cached with a service worker with a file served from AWS S3. I even wrote my own strategy using IndexedDb (one that converted to ArrayBuffer to get around known Safari issues with storage and one that didn't, https://developers.google.com/web/fundamentals/instant-and-offline/web-storage/indexeddb-best-practices) to no avail.

I did remove the service worker to prove it worked and it played just fine. Images, JSON, and other text based content seemed to work just fine. I don't have any other video types to easily test with.

This does appear to be a known issue with Safari, per https://bugs.webkit.org/show_bug.cgi?id=184447, but they are basically claiming you need to fix it. Also, this is possibly a hole in the fetch spec to begin with, per whatwg/fetch#747, but the gist of it there seems to also be "you have to fix it". I did try adding the header they wanted in my custom strategy, but that also didn't work (although, granted, this is my first service worker, so I may have done something wrong). I'm also not sure if Workbox is eating my headers I am adding (although I can see the header on the response in the network tab, so I have to assume it is not).

const fetchedResponse = await fetch(url.href);
const blob = await fetchedResponse.blob();

const arrayBuffer = await blobToArrayBuffer(blob);
await db.assets.put({ sig: queryParams.sig, asset: arrayBuffer, type: blob.type });

const headers = new Headers(event.request.headers);
headers.append('Accept-Encoding', 'identity');
return new Response(blob, { headers });

Somewhat amusingly, if you right click on the video element and say "Download", it downloads almost immediately and works, implying it's pulling from cache.

In summation, I'm not 100% sure there is work that can be done, but raising awareness of the issue within workbox to see if there is a simple fix that can potentially be implemented for the strategies for this somewhat acute issue.