@botiverse/porthole 0.1.4 → 0.1.6

package/src/react/frame.tsx

@@ -622,15 +622,22 @@ function Mount({ frame, page, initialHeightPx, placeholder, run }: MountProps):
       attempt(() => display.annotations.focus(id), latest());
     }
   }, [annotates, focusToken]);
+  // A flip or a restyle after the display was made: its first scheme and values went with it.
+  const [mountScheme] = useState(scheme);
+  const flipped = useRef(false);
   useEffect(() => {
-    handle.current?.setTheme(scheme);
-  }, [scheme]);
+    if (flipped.current || scheme !== mountScheme) {
+      flipped.current = true;
+      handle.current?.setTheme(scheme);
+    }
+  }, [scheme, mountScheme]);
   const { themeKey } = frame;
+  const [mountThemeKey] = useState(themeKey);
   useEffect(() => {
-    if (themeKey !== undefined) {
+    if (themeKey !== undefined && themeKey !== mountThemeKey) {
       handle.current?.refreshTheme();
     }
-  }, [themeKey]);
+  }, [themeKey, mountThemeKey]);
 
   return (
     <div

package/src/server/server.ts

@@ -92,6 +92,10 @@ function mergeEgress(base: EgressConfig, extra: EgressConfig | undefined): Egres
       merged[kind] = origins;
     }
   }
+  // What the host's config opens to any https site stays; a view can't ask for it (P059).
+  if (base.anyHttps !== undefined) {
+    merged.anyHttps = base.anyHttps;
+  }
   return merged;
 }
 

package/src/shell/runtime.ts

@@ -607,12 +607,16 @@ export const SHELL_RUNTIME = String.raw`(() => {
   const notify = (method, params) => send({ method, params });
 
   const themeNames = new Set(plan.themeVariables);
+  // What the content was last told of (its scheme and values): the theme it starts with is no
+  // change, and a host context that changes neither (a host re-sending it) is none either.
+  let announced = null;
   const applyTheme = (context) => {
     if (context === null || typeof context !== "object") {
       return;
     }
     // The spec's variables, and Porthole's own beside them (its own-prefixed field).
     const own = context["porthole/styles"];
+    const applied = [];
     for (const variables of [context.styles && context.styles.variables, own && own.variables]) {
       if (variables === null || typeof variables !== "object") {
         continue;
@@ -621,12 +625,21 @@ export const SHELL_RUNTIME = String.raw`(() => {
         const value = variables[name];
         if (themeNames.has(name) && typeof value === "string") {
           document.documentElement.style.setProperty(name, value);
+          applied.push(name + ":" + value);
         }
       }
     }
     lastContext = context;
     schemeFollows();
-    window.dispatchEvent(new CustomEvent(plan.themeEvent, { detail: { theme: context.theme } }));
+    const now = JSON.stringify([context.theme, applied.sort()]);
+    if (announced === null) {
+      announced = now;
+      return;
+    }
+    if (now !== announced) {
+      announced = now;
+      window.dispatchEvent(new CustomEvent(plan.themeEvent, { detail: { theme: context.theme } }));
+    }
   };
 
   // No size before there is something to size: an empty shell's height would make the host