import { clientsClaim } from 'workbox-core';
import { precacheAndRoute } from 'workbox-precaching';
import { registerRoute } from 'workbox-routing';
import { CacheFirst } from 'workbox-strategies';
import { CacheableResponsePlugin } from 'workbox-cacheable-response';
import { ExpirationPlugin } from 'workbox-expiration';
import { googleFontsCache } from 'workbox-recipes';
//////////////////////////////////////////////////////////////
//////////////////////////// Setup ///////////////////////////
//////////////////////////////////////////////////////////////
self.__WB_DISABLE_DEV_LOGS = true;
/**
* The clientsClaim() method in workbox-core automatically adds an activate event listener to your service worker, and inside of it,
* calls self.clients.claim(). Calling self.clients.claim() before the current service worker activates will lead to a runtime exception,
* and workbox-core's wrapper helps ensure that you call it at the right time.
*/
clientsClaim();
// Required to fix error while building using workbox plugin
precacheAndRoute(self.__WB_MANIFEST);
// Fixes this issue
// DOMException: Registration failed - missing applicationServerKey, and manifest empty or missing
self.addEventListener('push', (event) => {
const title = 'Get Started With Workbox';
const options = {
body: event.data.text()
};
event.waitUntil(self.registration.showNotification(title, options));
});
//////////////////////////////////////////////////////////////
/////////////////////// Registration /////////////////////////
//////////////////////////////////////////////////////////////
// WORKBOX RECIPIES
googleFontsCache();
registerRoute(
({ request }) => request.destination === 'image',
new CacheFirst({
cacheName: 'images',
plugins: [
new CacheableResponsePlugin({
statuses: [0, 200]
}),
new ExpirationPlugin({
purgeOnQuotaError: true,
maxEntries: 100,
maxAgeSeconds: 10 * 60 // 10 mins
})
]
})
);
registerRoute(
({ url }) => {
// cache coco api responses
return new RegExp('/api/use').test(url.href);
},
new CacheFirst({
cacheName: 'api-cache',
plugins: [
new CacheableResponsePlugin({
statuses: [0, 200]
}),
new ExpirationPlugin({
maxEntries: 15,
maxAgeSeconds: 6 * 60 * 60 // 6 hours
})
]
})
);