JS background script doesn’t start on refresh

I’m trying to implement dark mode feature to my extension and now I’m facing a problem with dark mode after reloading. When I click on the button it changes the website perfectly but after a refresh of the site, I need to click on the extension icon so my saved option can be loaded. Here is content of background.js and manifest.json has “background”: { “scripts”: [ “background.js” ]. Using chrome.storage.local.set and chrome.storage.local.get gives me error on console. I hope everything is clear 😀


const darkModeToggle = document.querySelector('.button_mode');

const enableDarkMode = () => { 
 
 chrome.tabs.executeScript({
   file: 'appOn.js'
})
 localStorage.setItem('darkMode', 'enabled');
}

const disableDarkMode = () => {  
 chrome.tabs.executeScript({
   file: 'appOff.js'
})
 
 localStorage.setItem('darkMode', null);
}


if (darkMode === 'enabled') {
 enableDarkMode();
} 
darkModeToggle.addEventListener('click', () => {

 darkMode = localStorage.getItem('darkMode'); 
 
 if (darkMode !== 'enabled') {
   enableDarkMode();
 } else {  
   disableDarkMode(); 
 }
});

permissions from manifest

"permissions": [
    "tabs",
    "downloads",
    "webNavigation",
    "http://*/*",
    "https://*/*", 
    "downloads",
    "storage"
  ]