Service worker cache in VueJS - vue.js

Question

I have an application in VueJs using axios, service worker and recently I'm struggling with what it seems a new bug that came with our last update. A bit of context first, the URL in production of this application was for example lorem.ipsum.com and we changed to dolor.ipsum.com. With that in mind everything is working like the application and redirect from lorem.ipsum to dolor.ipsum. But the thing is that if I access lorem.ipsum the URL only changes when the user press CTRL+SHIFT+R to reload the page and what I wanted was that when the user access lorem.ipsum the redirect happened automatically to dolor.ipsum.
Here's the current state of the code
import { register } from "register-service-worker";
if (process.env.NODE_ENV === "production") {
register(`${process.env.BASE_URL}service-worker.js`, {
ready() {
console.log(
"App is being served from cache by a service worker.\n"
);
},
registered() {
console.log("Service worker has been registered.");
},
cached() {
console.log("Content has been cached for offline use.");
},
updatefound() {
console.log("New content is downloading.");
},
updated() {
console.log("New content is available; please refresh.");
setTimeout(() => {
window.location.reload();
}, 1000)
},
offline() {
console.log("No internet connection found. App is running in offline mode.");
},
error(error) {
console.error("Error during service worker registration:", error);
},
});
}
Edit 1: After adding the code below to use the application version to update/redirect the content it worked but only for those who never accessed the application before (because of cookies). When I delete all cookies, it works. So now I want a way to deal with those cookies for all users because we can't ask for all users to delete them.
workbox.core.setCacheNameDetails({ prefix: 'd4' });
const LATEST_VERSION = process.env.VUE_APP_VERSION;
self.addEventListener('activate', () => {
if (caches) {
caches.keys().then((arr) => {
arr.forEach((key) => {
if (key.indexOf('d4-precache') < -1) {
caches.delete(key).then(() => console.log(`%c Cleared ${key}`, 'background: #333; color: #ff0000'));
} else {
caches.open(key).then((cache) => {
cache.match('version').then((res) => {
if (!res) {
cache.put('version', new Response(LATEST_VERSION, { status: 200, statusText: LATEST_VERSION }));
} else if (res.statusText !== LATEST_VERSION) {
caches.delete(key).then(() => console.log(`%c Cleared Cache ${LATEST_VERSION}`));
} else console.log(`%c Great you have the latest version ${LATEST_VERSION}`);
});
});
}
});
});
}
});
workbox.skipWaiting();
workbox.clientsClaim();
self.__precacheManifest = [].concat(self.__precacheManifest || []);
workbox.precaching.suppressWarnings();
workbox.precaching.precacheAndRoute(self.__precacheManifest, {});