scratch-paint 4.1.52 → 4.1.54

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "scratch-paint",
-  "version": "4.1.52",
+  "version": "4.1.54",
   "description": "Graphical User Interface for the Scratch 3.0 paint editor, which is used to make and edit sprites for use in projects.",
   "main": "./dist/scratch-paint.js",
   "browser": "./src/index.js",
@@ -24,7 +24,7 @@
   },
   "dependencies": {
     "@scratch/paper": "^0.11.20221201200345",
-    "@scratch/scratch-svg-renderer": "13.7.2",
+    "@scratch/scratch-svg-renderer": "13.7.3",
     "classnames": "^2.2.5",
     "keymirror": "^0.1.1",
     "lodash.bindall": "^4.4.0",

package/src/containers/paper-canvas.jsx

@@ -7,6 +7,7 @@ import {sanitizeSvg} from '@scratch/scratch-svg-renderer';
 import Formats from '../lib/format';
 import log from '../log/log';
 
+import {stripInvalidPaperData} from '../helper/strip-invalid-paper-data';
 import {performSnapshot} from '../helper/undo';
 import {undoSnapshot, clearUndoState} from '../reducers/undo';
 import {isGroup, ungroupItems} from '../helper/group';
@@ -215,11 +216,12 @@ class PaperCanvas extends React.Component {
         // well-formed document.
         svg = sanitizeSvg.sanitizeSvgText(svg);
 
-        // Get the origin which the viewBox is defined relative to. During import, Paper will translate
-        // the viewBox to start at (0, 0), and we need to translate it back for some costumes to render
-        // correctly.
-        const parser = new DOMParser();
-        const svgDom = parser.parseFromString(svg, 'text/xml');
+        // 4. Parse once: read viewBox (translated back for some costumes
+        // to render correctly — paper translates it to (0, 0) on import)
+        // and strip data-paper-data values that fail JSON.parse (paper.js
+        // synchronously throws on these and aborts the whole import).
+        const svgDom = new DOMParser().parseFromString(svg, 'text/xml');
+        const modified = stripInvalidPaperData(svgDom);
         const viewBox = svgDom.documentElement.attributes.viewBox ?
             svgDom.documentElement.attributes.viewBox.value.match(/\S+/g) : null;
         if (viewBox) {
@@ -227,6 +229,7 @@ class PaperCanvas extends React.Component {
                 viewBox[i] = parseFloat(viewBox[i]);
             }
         }
+        if (modified) svg = new XMLSerializer().serializeToString(svgDom);
 
         paper.project.importSVG(svg, {
             expandShapes: true,

package/src/helper/strip-invalid-paper-data.js

@@ -0,0 +1,28 @@
+/**
+ * Drop `data-paper-data` attributes whose value isn't valid JSON. Paper.js
+ * synchronously calls JSON.parse on this attribute during importSVG and
+ * throws on malformed values, taking down the whole import. The attribute
+ * is paper's own serialization metadata; if it can't parse, paper wouldn't
+ * have been able to use it.
+ *
+ * Operates on a parsed Document in place so callers that already have one
+ * (e.g. for viewBox extraction) don't pay for a second parse-and-serialize.
+ * @param {Document} svgDoc - parsed SVG document; mutated in place.
+ * @returns {boolean} true if any attribute was removed (caller should
+ *   re-serialize); false if the document was untouched.
+ */
+const stripInvalidPaperData = function (svgDoc) {
+    let modified = false;
+    const els = svgDoc.querySelectorAll('[data-paper-data]');
+    for (let i = 0; i < els.length; i++) {
+        try {
+            JSON.parse(els[i].getAttribute('data-paper-data'));
+        } catch {
+            els[i].removeAttribute('data-paper-data');
+            modified = true;
+        }
+    }
+    return modified;
+};
+
+export {stripInvalidPaperData};