I am working on a Chrome extension for my company. For fun, and just because I like easter eggs and I like to work an extra mile to always give a good experience for my users, I thought about replacing the Running Dinosaur game on the offline page by something branded for our company as a fun surprise. I like to develop 2D games sometimes, and I'd have fun doing this.
I migrated the Chrome extension to the manifest v3 recently (I will write a medium article on this as it was quite challenging and I had to find so many hacks to keep our extension working).
I was thinking about using the chrome.scripting.executeScript API.
What I tried so far is to add a listener on a new tab opening
using this API chrome.tabs.onUpdated.addListener and look for the status: 'complete'. Then use the executeScript this way:
chrome.tabs.onUpdated.addListener((tabId, changes, tab) => {
if (tab.status === 'complete') {
if (!navigator.onLine) {
chrome.scripting.executeScript({
target: {
tabId,
},
files: [
'/static/js/easter.js',
],
});
}
}
});
In my script for now I just console.log('loaded') to check if my script is properly injected. When I am online, the script loads successfully on the tabs, but when I switch to offline mode (using the developer network tab or actually disconnecting the wifi), the script fails to load and I get this error in the tab's console even though, the host_permissions seems to be configured properly in the manifest.json file:
Unchecked runtime.lastError: Cannot access contents of the page. Extension manifest must request permission to access the respective host.
I am not sure why it throws this error and I was wondering if anybody had the same issue and if you managed to solve this.
Thank you for your help!