Merge commit from fork

Harden the XFA layer and restrict scripting updates to known fields

src/display/xfa_layer.js

@@ -18,6 +18,7 @@
 // eslint-disable-next-line max-len
 /** @typedef {import("../../web/pdf_link_service.js").PDFLinkService} PDFLinkService */
 
+import { shadow, SVG_NS } from "../shared/util.js";
 import { PageViewport } from "./page_viewport.js";
 import { XfaText } from "./xfa_text.js";
 
@@ -31,7 +32,122 @@ import { XfaText } from "./xfa_text.js";
  * @property {string} [intent] - (default value is 'display').
  */
 
+const disallowedRichTextStyleRegExp = /url\(|image-set\(/i;
+
+const disallowedEventHandlerAttrRegExp = /^on/i;
+
 class XfaLayer {
+  static get _allowedHtmlElements() {
+    return shadow(
+      this,
+      "_allowedHtmlElements",
+      new Set([
+        "a",
+        "b",
+        "br",
+        "button",
+        "div",
+        "i",
+        "img",
+        "input",
+        "label",
+        "li",
+        "ol",
+        "option",
+        "p",
+        "select",
+        "span",
+        "sub",
+        "sup",
+        "textarea",
+        "ul",
+      ])
+    );
+  }
+
+  static get _allowedSvgElements() {
+    return shadow(
+      this,
+      "_allowedSvgElements",
+      new Set(["ellipse", "line", "path", "rect", "svg"])
+    );
+  }
+
+  // The elements the rich text renderer is allowed to create: this matches the
+  // (much smaller) set the worker can emit for rich text, see
+  // `src/core/xfa/xhtml.js`. In particular no SVG and no interactive/form
+  // elements are allowed here.
+  static get _allowedRichTextElements() {
+    return shadow(
+      this,
+      "_allowedRichTextElements",
+      new Set([
+        "a",
+        "b",
+        "br",
+        "div",
+        "i",
+        "li",
+        "ol",
+        "p",
+        "span",
+        "sub",
+        "sup",
+        "ul",
+      ])
+    );
+  }
+
+  static get _allowedRichTextAttributes() {
+    return shadow(
+      this,
+      "_allowedRichTextAttributes",
+      new Set(["class", "dir", "style"])
+    );
+  }
+
+  // The CSS properties the rich text renderer is allowed to set (camel-cased,
+  // as produced by `mapStyle` in `src/core/xfa/xhtml.js`). This mirrors that
+  // file's `VALID_STYLES`, so it excludes anything that could load a remote
+  // resource or escape the layout (e.g. `position`, `zIndex`, `background`).
+  static get _allowedRichTextStyles() {
+    return shadow(
+      this,
+      "_allowedRichTextStyles",
+      new Set([
+        "color",
+        "font",
+        "fontFamily",
+        "fontSize",
+        "fontStretch",
+        "fontStyle",
+        "fontWeight",
+        "kerningMode",
+        "letterSpacing",
+        "lineHeight",
+        "margin",
+        "marginBottom",
+        "marginLeft",
+        "marginRight",
+        "marginTop",
+        "orphans",
+        "paddingLeft",
+        "paddingRight",
+        "breakAfter",
+        "breakBefore",
+        "breakInside",
+        "tabInterval",
+        "tabStop",
+        "textAlign",
+        "textDecoration",
+        "textIndent",
+        "transform",
+        "verticalAlign",
+        "widows",
+      ])
+    );
+  }
+
   static setupStorage(html, id, element, storage, intent) {
     const storedData = storage.getValue(id, { value: null });
     switch (element.name) {
@@ -117,6 +233,14 @@ class XfaLayer {
         continue;
       }
 
+      if (disallowedEventHandlerAttrRegExp.test(key)) {
+        continue;
+      }
+
+      if (intent === "richText" && !this._allowedRichTextAttributes.has(key)) {
+        continue;
+      }
+
       switch (key) {
         case "class":
           if (value.length) {
@@ -132,7 +256,19 @@ class XfaLayer {
           html.setAttribute("data-element-id", value);
           break;
         case "style":
-          Object.assign(html.style, value);
+          if (intent === "richText") {
+            const allowedStyles = this._allowedRichTextStyles;
+            for (const [styleName, styleValue] of Object.entries(value)) {
+              if (
+                allowedStyles.has(styleName) &&
+                !disallowedRichTextStyleRegExp.test(styleValue)
+              ) {
+                html.style[styleName] = styleValue;
+              }
+            }
+          } else {
+            Object.assign(html.style, value);
+          }
           break;
         case "textContent":
           html.textContent = value;
@@ -145,7 +281,7 @@ class XfaLayer {
     }
 
     if (isHTMLAnchorElement) {
-      linkService.addLinkAttributes(
+      linkService?.addLinkAttributes(
         html,
         attributes.href,
         attributes.newWindow
@@ -158,6 +294,22 @@ class XfaLayer {
     }
   }
 
+  static #createElement(name, xmlns, intent) {
+    if (intent === "richText") {
+      return !xmlns && this._allowedRichTextElements.has(name)
+        ? document.createElement(name)
+        : null;
+    }
+    if (xmlns) {
+      return xmlns === SVG_NS && this._allowedSvgElements.has(name)
+        ? document.createElementNS(SVG_NS, name)
+        : null;
+    }
+    return this._allowedHtmlElements.has(name)
+      ? document.createElement(name)
+      : null;
+  }
+
   /**
    * Render the XFA layer.
    *
@@ -168,7 +320,9 @@ class XfaLayer {
     const linkService = parameters.linkService;
     const root = parameters.xfaHtml;
     const intent = parameters.intent || "display";
-    const rootHtml = document.createElement(root.name);
+    const rootHtml =
+      this.#createElement(root.name, root.attributes?.xmlns, intent) ??
+      document.createElement("div");
     if (root.attributes) {
       this.setAttributes({
         html: rootHtml,
@@ -230,9 +384,14 @@ class XfaLayer {
         continue;
       }
 
-      const childHtml = child?.attributes?.xmlns
+      const childHtml = this.#createElement(
-        ? document.createElementNS(child.attributes.xmlns, name)
+        name,
-        : document.createElement(name);
+        child.attributes?.xmlns,
+        intent
+      );
+      if (!childHtml) {
+        continue;
+      }
 
       html.append(childHtml);
       if (child.attributes) {

test/unit/display_utils_spec.js

@@ -440,5 +440,82 @@ describe("display_utils", function () {
         )
       );
     });
+
+    it("should only keep the supported rich text elements", function () {
+      if (isNodeJS) {
+        pending("DOM is not supported in Node.js.");
+      }
+      const container = document.createElement("div");
+      const xfaHtml = {
+        name: "div",
+        children: [
+          { name: "p", value: "kept" },
+          {
+            name: "section",
+            children: [{ name: "span", value: "removed" }],
+          },
+        ],
+      };
+      renderRichText(
+        { html: xfaHtml, dir: "ltr", className: "foo" },
+        container
+      );
+
+      expect(container.querySelector("p")).not.toBeNull();
+      expect(container.querySelector("section")).toBeNull();
+      expect(container.querySelector("span")).toBeNull();
+      expect(container.textContent).toEqual("kept");
+    });
+
+    it("should only keep the supported rich text attributes", function () {
+      if (isNodeJS) {
+        pending("DOM is not supported in Node.js.");
+      }
+      const container = document.createElement("div");
+      const xfaHtml = {
+        name: "div",
+        children: [
+          {
+            name: "p",
+            attributes: { class: ["bar"], dir: "rtl", title: "unsupported" },
+            value: "text",
+          },
+        ],
+      };
+      renderRichText(
+        { html: xfaHtml, dir: "ltr", className: "foo" },
+        container
+      );
+      const p = container.querySelector("p");
+
+      expect(p.getAttribute("class")).toEqual("bar");
+      expect(p.getAttribute("dir")).toEqual("rtl");
+      expect(p.hasAttribute("title")).toEqual(false);
+    });
+
+    it("should only apply the supported rich text style properties", function () {
+      if (isNodeJS) {
+        pending("DOM is not supported in Node.js.");
+      }
+      const container = document.createElement("div");
+      const xfaHtml = {
+        name: "div",
+        children: [
+          {
+            name: "span",
+            attributes: { style: { color: "green", width: "100px" } },
+            value: "text",
+          },
+        ],
+      };
+      renderRichText(
+        { html: xfaHtml, dir: "ltr", className: "foo" },
+        container
+      );
+      const span = container.querySelector("span");
+
+      expect(span.style.color).toEqual("green");
+      expect(span.style.width).toEqual("");
+    });
   });
 });

web/pdf_scripting_manager.js

@@ -45,6 +45,8 @@ class PDFScriptingManager {
 
   #externalServices = null;
 
+  #objectIds = null;
+
   #pdfDocument = null;
 
   #pdfViewer = null;
@@ -104,6 +106,18 @@ class PDFScriptingManager {
     if (pdfDocument !== this.#pdfDocument) {
       return; // The document was closed while the data resolved.
     }
+
+    // Collect the ids of every field annotation, so that any sandbox message
+    // targeting an unknown id can be ignored.
+    if (objects) {
+      this.#objectIds = new Set();
+      for (const fields of Object.values(objects)) {
+        for (const { id } of fields) {
+          this.#objectIds.add(id);
+        }
+      }
+    }
+
     try {
       this.#scripting = this.#initScripting();
     } catch (error) {
@@ -368,6 +382,9 @@ class PDFScriptingManager {
 
     const ids = siblings ? [id, ...siblings] : [id];
     for (const elementId of ids) {
+      if (!this.#objectIds?.has(elementId)) {
+        continue;
+      }
       const element = document.querySelector(
         `[data-element-id="${elementId}"]`
       );
@@ -456,6 +473,8 @@ class PDFScriptingManager {
   }
 
   async #destroyScripting() {
+    this.#objectIds = null;
+
     if (!this.#scripting) {
       this.#pdfDocument = null;