diff --git a/src/display/xfa_layer.js b/src/display/xfa_layer.js index 90f02e30b..cc4b58dae 100644 --- a/src/display/xfa_layer.js +++ b/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 - ? document.createElementNS(child.attributes.xmlns, name) - : document.createElement(name); + const childHtml = this.#createElement( + name, + child.attributes?.xmlns, + intent + ); + if (!childHtml) { + continue; + } html.append(childHtml); if (child.attributes) { diff --git a/test/unit/display_utils_spec.js b/test/unit/display_utils_spec.js index dca05bbab..480930121 100644 --- a/test/unit/display_utils_spec.js +++ b/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(""); + }); }); }); diff --git a/web/pdf_scripting_manager.js b/web/pdf_scripting_manager.js index 9da66880d..b8f2ed9f9 100644 --- a/web/pdf_scripting_manager.js +++ b/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;