Merge branch 'master' into refactor-svgcanvas

package.json

@@ -71,14 +71,14 @@
     "@babel/polyfill": "7.12.1",
     "browser-fs-access": "0.23.0",
     "canvg": "3.0.9",
-    "core-js": "3.19.2",
+    "core-js": "3.19.3",
     "elix": "15.0.1",
     "html2canvas": "1.3.3",
-    "i18next": "21.5.4",
+    "i18next": "21.6.0",
     "jspdf": "2.4.0",
     "pathseg": "1.2.1",
     "regenerator-runtime": "0.13.9",
-    "rollup-plugin-polyfill-node": "0.7.0",
+    "rollup-plugin-polyfill-node": "0.8.0",
     "svg2pdf.js": "2.2.0"
   },
   "devDependencies": {
@@ -87,7 +87,7 @@
     "@babel/register": "7.16.0",
     "@babel/runtime-corejs3": "7.16.3",
     "@cypress/code-coverage": "3.9.12",
-    "@cypress/fiddle": "1.19.2",
+    "@cypress/fiddle": "1.19.3",
     "@fintechstudios/eslint-plugin-chai-as-promised": "3.1.0",
     "@rollup/plugin-babel": "5.3.0",
     "@rollup/plugin-commonjs": "^18",
@@ -100,9 +100,9 @@
     "@web/dev-server-rollup": "0.3.13",
     "babel-plugin-transform-object-rest-spread": "7.0.0-beta.3",
     "copyfiles": "2.4.1",
-    "core-js-bundle": "3.19.2",
+    "core-js-bundle": "3.19.3",
     "cp-cli": "2.0.0",
-    "cypress": "9.1.0",
+    "cypress": "9.1.1",
     "cypress-multi-reporters": "1.5.0",
     "cypress-plugin-snapshots": "1.4.4",
     "eslint": "^7",
@@ -111,17 +111,17 @@
     "eslint-plugin-chai-expect": "3.0.0",
     "eslint-plugin-chai-expect-keywords": "2.1.0",
     "eslint-plugin-chai-friendly": "0.7.2",
-    "eslint-plugin-compat": "3.13.0",
+    "eslint-plugin-compat": "4.0.0",
     "eslint-plugin-cypress": "2.12.1",
     "eslint-plugin-eslint-comments": "3.2.0",
     "eslint-plugin-html": "6.2.0",
     "eslint-plugin-import": "2.25.3",
-    "eslint-plugin-jsdoc": "37.0.3",
+    "eslint-plugin-jsdoc": "37.2.0",
     "eslint-plugin-markdown": "2.2.1",
-    "eslint-plugin-no-unsanitized": "4.0.0",
+    "eslint-plugin-no-unsanitized": "4.0.1",
     "eslint-plugin-no-use-extend-native": "0.5.0",
     "eslint-plugin-node": "11.1.0",
-    "eslint-plugin-promise": "5.1.1",
+    "eslint-plugin-promise": "5.2.0",
     "eslint-plugin-standard": "4.1.0",
     "jamilih": "0.54.0",
     "jsdoc": "3.6.7",
@@ -133,9 +133,9 @@
     "qr-manipulation": "0.7.0",
     "query-result": "1.0.5",
     "remark-cli": "10.0.1",
-    "remark-lint-ordered-list-marker-value": "3.1.0",
+    "remark-lint-ordered-list-marker-value": "3.1.1",
     "rimraf": "3.0.2",
-    "rollup": "2.60.2",
+    "rollup": "2.61.0",
     "rollup-plugin-copy": "3.4.0",
     "rollup-plugin-filesize": "9.1.1",
     "rollup-plugin-html": "^0.2.1",

src/editor/components/jgraduate/Util.js

@@ -104,10 +104,7 @@ export function getClosest(elem, selector) {
  */
 export function getParents(elem, selector) {
   const parents = [];
-  let firstChar;
-  if ( selector ) {
-    firstChar = selector.charAt(0);
-  }
+  const firstChar = selector?.charAt(0);
   // Get matches
   for ( ; elem && elem !== document; elem = elem.parentNode ) {
     if ( selector ) {
@@ -138,23 +135,13 @@ export function getParents(elem, selector) {
     }
   }
   // Return parents if any exist
-  if ( parents.length === 0 ) {
-    return null;
-  } else {
-    return parents;
-  }
+  return parents.length? parents : null;
 }
 
 export function getParentsUntil(elem, parent, selector) {
   const parents = [];
-  let parentType;
-  let selectorType;
-  if ( parent ) {
-    parentType = parent.charAt(0);
-  }
-  if ( selector ) {
-    selectorType = selector.charAt(0);
-  }
+  const parentType = parent?.charAt(0);
+  const selectorType = selector?.selector.charAt(0);
   // Get matches
   for ( ; elem && elem !== document; elem = elem.parentNode ) {
     // Check if parent has been reached
@@ -210,9 +197,5 @@ export function getParentsUntil(elem, parent, selector) {
     }
   }
   // Return parents if any exist
-  if ( parents.length === 0 ) {
-    return null;
-  } else {
-    return parents;
-  }
+  return parents.length? parents : null;
 }

src/editor/panels/TopPanel.html

@@ -133,7 +133,7 @@
         <se-button id="tool_italic" title="properties.italic" src="italic.svg" shortcut="I"></se-button>
         <se-select id="tool_font_family" label="properties.font_family_label"
             options="properties.serif,properties.sans_serif,properties.cursive,properties.fantasy,properties.monospace,properties.courier,properties.helvetica,properties.times"
-            values="Serif::Sans-serif::Cursive::Fantasy::Monospace::Courier::Helvetica::Times"></select>
+            values="Serif::Sans-serif::Cursive::Fantasy::Monospace::Courier::Helvetica::Times"></se-select>
             <se-spin-input size="2" id="font_size" min=1 max=1000 step=1 title="properties.font_size"
                 src="fontsize.svg"></se-spin-input>
     </div>

src/svgcanvas/elem-get-set.js

@@ -703,7 +703,7 @@ export const setFontSizeMethod = function (val) {
   const selectedElements = svgCanvas.getSelectedElements();
   svgCanvas.setCurText('font_size', val);
   svgCanvas.changeSelectedAttribute('font-size', val);
-  if (!selectedElements[0].textContent) {
+  if (selectedElements[0] && !selectedElements[0].textContent) {
     svgCanvas.textActions.setCursor();
   }
 };

src/svgcanvas/sanitize.js

@@ -166,7 +166,9 @@ export const sanitizeSvg = function (node) {
         // We can add specific namepaces on demand for now.
         // Is there a more appropriate way to do this?
         if (attrName.startsWith('se:') || attrName.startsWith('oi:')|| attrName.startsWith('data-')) {
-          seAttrs.push([ attrName, attr.value ]);
+          // We should bypass the namespace aswell
+          const seAttrNS = (attrName.startsWith('se:')) ? NS.SE : ((attrName.startsWith('oi:')) ? NS.OI : null);
+          seAttrs.push([ attrName, attr.value, seAttrNS ]);
         } else {
           console.warn(`sanitizeSvg: attribute ${attrName} in element ${node.nodeName} not in whitelist is removed`);
           node.removeAttributeNS(attrNsURI, attrLocalName);
@@ -190,8 +192,8 @@ export const sanitizeSvg = function (node) {
       }
     }
 
-    Object.values(seAttrs).forEach(([ att, val ]) => {
-      node.setAttributeNS(NS.SE, att, val);
+    Object.values(seAttrs).forEach(([ att, val, ns ]) => {
+      node.setAttributeNS(ns, att, val);
     });
 
     // for some elements that have a xlink:href, ensure the URI refers to a local element

src/svgcanvas/selection.js

@@ -49,7 +49,7 @@ export const clearSelectionMethod = function (noCall) {
   svgCanvas?.setEmptySelectedElements();
 
   if (!noCall) {
-    svgCanvas.call("selected", selectedElements);
+    svgCanvas.call("selected", selectionContext_.getSelectedElements());
   }
 };
 

src/svgcanvas/svg-exec.js

@@ -527,7 +527,7 @@ export const importSvgString = function (xmlString) {
     // Look for symbol and make sure symbol exists in image
     if (svgCanvas.getImportIds(uid) && svgCanvas.getImportIds(uid).symbol) {
       const parents = getParents(svgCanvas.getImportIds(uid).symbol, '#svgroot');
-      if (parents.length) {
+      if (parents?.length) {
         useExisting = true;
       }
     }