keep offscreen alive for colorScheme=system

Author: tophf

src/background/color-scheme.js

@@ -1,3 +1,5 @@
+import {kStyleViaXhr} from '@/js/consts';
+import {CONNECTED} from '@/js/port';
 import * as prefs from '@/js/prefs';
 import {debounce, isCssDarkScheme} from '@/js/util';
 import {broadcastExtension} from './broadcast';
@@ -42,6 +44,12 @@ if (__.MV3) {
     }
   }));
   bgInit.push(refreshSystemDark);
+  prefs.subscribe([kSTATE, kStyleViaXhr], () => {
+    const val = prefState === kSystem || prefs.__values[kStyleViaXhr];
+    if (val || offscreen[CONNECTED]) {
+      offscreen.keepAlive(val);
+    }
+  }, true);
 } else {
   refreshSystemDark();
 }

src/background/style-via-webrequest.js

@@ -1,4 +1,4 @@
-import {kAppJson, kMainFrame, kPopup, kSubFrame} from '@/js/consts';
+import {kAppJson, kMainFrame, kPopup, kStyleViaXhr, kSubFrame} from '@/js/consts';
 import {updateSessionRules} from '@/js/dnr';
 import {API} from '@/js/msg';
 import * as prefs from '@/js/prefs';
@@ -17,7 +17,6 @@ import * as tabMan from './tab-manager';
 
 const idCSP = 'patchCsp';
 const idOFF = 'disableAll';
-const idXHR = 'styleViaXhr';
 const REVOKE_TIMEOUT = 10e3;
 const kRuleIds = 'ruleIds';
 const kSetCookie = 'set-cookie'; // must be lowercase
@@ -55,7 +54,7 @@ if (__.MV3) {
 
 prefs.ready.then(() => {
   toggle(__.MV3); // in MV3 this will unregister unused listeners
-  prefs.subscribe([idOFF, idCSP, idXHR], toggle);
+  prefs.subscribe([idOFF, idCSP, kStyleViaXhr], toggle);
 });
 
 bgBusy.then(() => {
@@ -97,7 +96,7 @@ function toggle(prefKey) {
   const mv3init = __.MV3 && !prefKey;
   const off = prefs.__values[idOFF];
   const csp = !off && prefs.__values[idCSP];
-  const xhr = !off && prefs.__values[idXHR];
+  const xhr = !off && prefs.__values[kStyleViaXhr];
   if (!mv3init && xhr === curXHR && csp === curCSP && off === curOFF) {
     return;
   }

src/background/sw/index.js

@@ -2,8 +2,7 @@ import '../intro'; // sets global.API
 import './keep-alive'; // sets global.keepAlive
 import {kMainFrame, kSubFrame} from '@/js/consts';
 import {_execute} from '@/js/msg';
-import {CONNECTED, initRemotePort} from '@/js/port';
-import * as prefs from '@/js/prefs';
+import {initRemotePort} from '@/js/port';
 import {ownRoot} from '@/js/urls';
 import {clientDataJobs} from '../common';
 import {cloudDrive} from '../db-to-cloud-broker';
@@ -52,12 +51,6 @@ cloudDrive.webdav = async cfg => {
   return res;
 };
 
-prefs.subscribe('styleViaXhr', (key, val) => {
-  if (val || offscreen[CONNECTED]) {
-    offscreen.keepAlive(val);
-  }
-}, true);
-
 /**
  * This ensures that SW starts even before our page makes a clientData request inside.
  * The actual listener is usually invoked after `onfetch`, but there's no guarantee.

src/js/consts.js

@@ -17,6 +17,7 @@ export const kMainFrame = 'main_frame';
 export const kPopup = 'popup';
 export const kResolve = 'resolve';
 export const kStateDB = 'state';
+export const kStyleViaXhr = 'styleViaXhr';
 export const kSubFrame = 'sub_frame';
 export const kUrl = 'url';
 export const k_busy = '_busy';

src/js/port.js

@@ -115,7 +115,7 @@ export function createPortExec(getTarget, {lock, once} = {}) {
     if (once) {
       port.close();
       exec[CONNECTED] =
-      queue = port = target = null;
+      queue = port = port.onmessage = target = null;
     }
   }
   async function trackTarget(queueCopy) {