@botiverse/porthole 0.1.2 → 0.1.4

package/src/shell/document.ts

@@ -1,4 +1,5 @@
 import { hostOriginProblem } from "../isolation/served.ts";
+import { ANNOTATE_RUNTIME } from "./annotate.ts";
 import { SHELL_RUNTIME } from "./runtime.ts";
 import type { ShellPlan } from "./plan.ts";
 
@@ -24,8 +25,17 @@ export interface ShellDocumentOptions {
    * both apply, and the stricter wins.
    */
   readonly cspMeta?: boolean;
+  /**
+   * The embedding page's CSP nonce, where its `script-src` is nonce-based (P054): a `srcdoc` frame
+   * inherits the embedding page's policy, so the shell's script and style carry it, and so does
+   * every script the shell runs for the content. The frame can read it.
+   */
+  readonly nonce?: string;
 }
 
+/** A CSP nonce: base64 or base64url characters, 8 to 256 of them. */
+const NONCE = /^[A-Za-z0-9+/_=-]{8,256}$/u;
+
 const escapeAttribute = (value: string): string =>
   value.replace(/&/gu, "&amp;").replace(/"/gu, "&quot;").replace(/</gu, "&lt;");
 
@@ -85,7 +95,15 @@ export function shellDocument(plan: ShellPlan, csp: string, options: ShellDocume
       throw new TypeError(`shellDocument: ${problem}`);
     }
   }
-  const runtime = SHELL_RUNTIME.replace("__PLAN__", () =>
+  if (options.nonce !== undefined && !NONCE.test(options.nonce)) {
+    throw new TypeError("shellDocument: a nonce is 8 to 256 base64 characters");
+  }
+  const nonce = options.nonce === undefined ? "" : ` nonce="${options.nonce}"`;
+  // The annotation runtime only where it is declared; spliced in before the plan, which may carry
+  // any text (a document) and must not be searched.
+  const runtime = SHELL_RUNTIME.replace("__ANNOTATE__", () =>
+    plan.capabilities.annotate === undefined ? "" : ANNOTATE_RUNTIME,
+  ).replace("__PLAN__", () =>
     scriptJson({
       ...plan,
       origins: options.origins,
@@ -108,13 +126,13 @@ export function shellDocument(plan: ShellPlan, csp: string, options: ShellDocume
 ${head.join("\n")}
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <title>${escapeText(options.title ?? "Content")}</title>
-<style>
+<style${nonce}>
 ${BASE_STYLE}
 </style>
 </head>
 <body>
 <div id="porthole-root"></div>
-<script>${runtime}</script>
+<script${nonce}>${runtime}</script>
 </body>
 </html>
 `;

package/src/shell/plan.ts

@@ -1,4 +1,4 @@
-import { capabilitySpec, type CapabilityName } from "../config/capabilities.ts";
+import { MAX_COPY_CHARS, capabilitySpec, type CapabilityName } from "../config/capabilities.ts";
 import type { PortholeConfig } from "../config/schema.ts";
 import { declaredCapabilities, effectiveGates } from "../compile/policy.ts";
 import { MCP_APPS_PROTOCOL_VERSION } from "../protocol/mcp-apps.ts";
@@ -31,6 +31,8 @@ export interface ShellPlan {
   readonly storage: "memory" | "native";
   readonly maxErrorReports: number;
   readonly maxPromptChars: number;
+  /** The most text `copyText` carries. */
+  readonly maxCopyChars: number;
   readonly protocolVersion: string;
 }
 
@@ -64,6 +66,7 @@ export function shellPlan(config: PortholeConfig): ShellPlan | null {
     storage: config.isolation === "opaque" ? "memory" : "native",
     maxErrorReports: config.limits.maxErrorReports,
     maxPromptChars: config.limits.maxPromptChars,
+    maxCopyChars: MAX_COPY_CHARS,
     protocolVersion: MCP_APPS_PROTOCOL_VERSION,
   };
 }

package/src/shell/runtime.ts

@@ -13,7 +13,10 @@
  *    engine enforces `frame-src 'none'` for `srcdoc`/`about:blank` children); and the resource
  *    hints and refreshes a CSP doesn't govern;
  * 4. closes the parser entry points that could build a shadow root step 3 can't see (declarative
- *    shadow DOM through `setHTMLUnsafe`, `parseHTMLUnsafe`, `document.write`).
+ *    shadow DOM through `setHTMLUnsafe`, `parseHTMLUnsafe`, `document.write`);
+ * 5. keeps content off the clipboard: the async Clipboard API refuses, `execCommand` won't copy or
+ *    cut, and copy and cut events never reach content, so what a person copies is what they
+ *    selected (P051). Copy buttons go through the host (`copyText`, P052).
  * A whole document (an artifact page, an MCP Apps view) is never written in: it is parsed inert,
  * imported, and its scripts run in order, as a fragment's are.
  *
@@ -28,6 +31,9 @@
 export const SHELL_RUNTIME = String.raw`(() => {
   "use strict";
   const plan = __PLAN__;
+  // The embedding page's nonce, where it gave one (a srcdoc frame inherits its policy): every
+  // script the shell runs for the content carries it.
+  const nonce = document.currentScript && document.currentScript.nonce ? document.currentScript.nonce : "";
   const declared = (name) => Object.prototype.hasOwnProperty.call(plan.capabilities, name);
   // Fixed in place: content can neither restore what is removed nor replace what is wrapped.
   const lock = (target, name, value) => {
@@ -263,13 +269,32 @@ export const SHELL_RUNTIME = String.raw`(() => {
       this.innerHTML = String(html);
     });
   }
+  // insertHTML parses markup outside these guards; copy, cut and paste reach the clipboard (P051).
+  const REFUSED_COMMANDS = ["inserthtml", "copy", "cut", "paste"];
   const execCommand = Document.prototype.execCommand;
   if (typeof execCommand === "function") {
     lock(Document.prototype, "execCommand", function (command, ...rest) {
-      return String(command).toLowerCase() === "inserthtml" ? false : execCommand.call(this, command, ...rest);
+      return REFUSED_COMMANDS.indexOf(String(command).toLowerCase()) !== -1 ? false : execCommand.call(this, command, ...rest);
     });
   }
 
+  // The clipboard is the host's to write (P051): content can neither write nor read it. A copy
+  // the person makes (their keys, their menu) copies their selection as the browser makes it: no
+  // copy or cut listener of the content's runs, so none can swap what goes on the clipboard.
+  const noClipboard = function () {
+    return Promise.reject(new DOMException("Content can't use the clipboard here" + (declared("copyText") ? ": call copyText(text) from a click" : ""), "NotAllowedError"));
+  };
+  if (typeof Clipboard === "function") {
+    for (const name of ["write", "writeText", "read", "readText"]) {
+      if (typeof Clipboard.prototype[name] === "function") {
+        lock(Clipboard.prototype, name, noClipboard);
+      }
+    }
+  }
+  for (const type of ["copy", "cut"]) {
+    window.addEventListener(type, (event) => event.stopImmediatePropagation(), true);
+  }
+
   // A connected link or meta can't become a guarded one: the change is tried on a detached copy
   // first, and if the copy would be guarded, the element leaves the document before it changes.
   const watched = (element) => element && element.nodeType === 1 && (element.localName === "link" || element.localName === "meta");
@@ -463,6 +488,9 @@ export const SHELL_RUNTIME = String.raw`(() => {
       }
       // A script made by a script is async unless told otherwise: keep the page's order.
       live.async = script.hasAttribute("async");
+      if (nonce !== "") {
+        live.nonce = nonce;
+      }
       live.textContent = script.textContent;
       const external = live.hasAttribute("src") && !live.async && live.type !== "module";
       const loaded = external
@@ -487,6 +515,27 @@ export const SHELL_RUNTIME = String.raw`(() => {
     window.dispatchEvent(new Event("load"));
   };
 
+  // Whether the content is in place: a fragment or page the shell draws, once drawn whole; a
+  // view the plan carries, once rendered; a view that is the document itself, from the start.
+  const contentHooks = [];
+  let contentIn = typeof plan.document !== "string" && plan.protocol !== "shell";
+  const contentIsIn = () => contentIn;
+  const whenContentIsIn = (run) => {
+    if (contentIn) {
+      run();
+    } else {
+      contentHooks.push(run);
+    }
+  };
+  const contentArrived = () => {
+    if (!contentIn) {
+      contentIn = true;
+      for (const run of contentHooks.splice(0)) {
+        run();
+      }
+    }
+  };
+
   // A fragment takes the person's scheme; a whole document only if it declares that it supports
   // both (or the config says always), else it shows as its author styled it (P039).
   let lastContext = null;
@@ -522,6 +571,7 @@ export const SHELL_RUNTIME = String.raw`(() => {
     schemeFollows();
     await runScripts(scripts);
     announceLoaded();
+    contentArrived();
   };
 
   // A document the plan carries (a served page, an MCP Apps view) is rendered once the shell's own
@@ -534,6 +584,8 @@ export const SHELL_RUNTIME = String.raw`(() => {
     }
   };
 
+  __ANNOTATE__
+
   if (plan.protocol !== "shell") {
     // A view that speaks for itself.
     if (typeof plan.document === "string") {
@@ -624,6 +676,18 @@ export const SHELL_RUNTIME = String.raw`(() => {
       );
     });
   }
+  if (declared("copyText")) {
+    lock(window, "copyText", (text) => {
+      if (!gestured("copyText")) {
+        return refuse("copyText needs a click: call it from a button's handler");
+      }
+      const words = String(text);
+      if (words === "" || words.length > plan.maxCopyChars) {
+        return refuse("copyText takes 1 to " + plan.maxCopyChars + " characters");
+      }
+      return request("porthole/copy-text", { text: words }).then((result) => !(result && result.isError));
+    });
+  }
   if (declared("openLink")) {
     lock(window, "openLink", (url) => {
       if (!gestured("openLink")) {
@@ -636,7 +700,10 @@ export const SHELL_RUNTIME = String.raw`(() => {
   window.addEventListener("error", (event) => {
     const error = event.error;
     const where = event.lineno ? " (line " + event.lineno + ")" : "";
-    report(error && error.stack ? String(error.stack).split("\n").slice(0, 3).join(" ") : event.message + where);
+    // V8's stack starts with the message; WebKit's and Firefox's don't, so it goes first there.
+    const stack = error && error.stack ? String(error.stack).split("\n").slice(0, 3).join(" ") : "";
+    const said = error && error.message !== undefined ? String(error.name || "Error") + ": " + String(error.message) : event.message;
+    report(stack === "" ? said + where : stack.indexOf(String(error.message)) === -1 ? said + " " + stack : stack);
   });
   window.addEventListener("unhandledrejection", (event) => {
     const reason = event.reason;
@@ -768,6 +835,7 @@ export const SHELL_RUNTIME = String.raw`(() => {
     schedule();
     await runScripts(scripts);
     announceLoaded();
+    contentArrived();
     schedule();
   };