Merge branch 'MDL-86323_main' of https://github.com/PhilippImhof/moodle

public/lib/editor/tiny/amd/build/content.min.js

@@ -1,3 +1,3 @@
-define("editor_tiny/content",["exports"],(function(_exports){Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.addSVGSupport=_exports.addMathMLSupport=void 0;_exports.addMathMLSupport=editor=>{editor.on("PreInit",(()=>{editor.schema.addCustomElements({math:{extends:"div"},"tiny-math-span":{extends:"span"},"tiny-math-block":{extends:"div"}}),editor.parser.addNodeFilter("math",(nodes=>nodes.forEach((node=>{if(node.parent&&("tiny-math-block"===node.parent.name||"tiny-math-span"===node.parent.name))return;const displayMode=(node=>{const style=node.attr("style");return null!=style&&style.includes("display")&&style.match(/display:[^;]*inline/)?"tiny-math-span":"tiny-math-block"})(node);node.wrap(editor.editorManager.html.Node.create(displayMode,{contenteditable:"false"}))})))),editor.serializer.addNodeFilter("tiny-math-span, tiny-math-block",((nodes,name)=>nodes.forEach((node=>{const displayMode=name.replace("tiny-math-","");node.children().forEach((child=>{const currentStyle=child.attr("style");currentStyle?child.attr("style","".concat(currentStyle,";display: ").concat(displayMode)):child.attr("style","display: ".concat(displayMode))})),node.unwrap()}))))}))};_exports.addSVGSupport=editor=>{editor.on("PreInit",(()=>{editor.schema.addCustomElements({svg:{extends:"div"},"tiny-svg-block":{extends:"div"}}),editor.parser.addNodeFilter("svg",(nodes=>nodes.forEach((node=>{node.wrap(editor.editorManager.html.Node.create("tiny-svg-block",{contenteditable:"false"}))})))),editor.serializer.addNodeFilter("tiny-svg-block",(nodes=>nodes.forEach((node=>{node.unwrap()}))))}))}}));
+define("editor_tiny/content",["exports"],(function(_exports){Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.addSVGSupport=_exports.addMathMLSupport=void 0;_exports.addMathMLSupport=editor=>{editor.on("PreInit",(()=>{editor.schema.addCustomElements({math:{extends:"div"},"tiny-math-span":{extends:"span"},"tiny-math-block":{extends:"div"}}),editor.parser.addNodeFilter("math",(nodes=>nodes.forEach((node=>{if(node.parent&&("tiny-math-block"===node.parent.name||"tiny-math-span"===node.parent.name))return;const displayMode=(node=>{const style=node.attr("style");return null!=style&&style.includes("display")&&style.match(/display:[^;]*inline/)?"tiny-math-span":"tiny-math-block"})(node);node.wrap(editor.editorManager.html.Node.create(displayMode,{contenteditable:"false"}))})))),editor.serializer.addNodeFilter("tiny-math-span, tiny-math-block",((nodes,name)=>nodes.forEach((node=>{const displayMode=name.replace("tiny-math-","");node.children().forEach((child=>{const currentStyle=child.attr("style");currentStyle?child.attr("style","".concat(currentStyle,";display: ").concat(displayMode)):child.attr("style","display: ".concat(displayMode))})),node.unwrap()}))))}))};_exports.addSVGSupport=editor=>{editor.on("PreInit",(()=>{editor.schema.addCustomElements({svg:{extends:"div",attributes:["id","tabindex","lang","xml:space","class","style","x","y","width","height","viewBox","preserveAspectRatio","transform"]},"tiny-svg-block":{extends:"div"}}),editor.parser.addNodeFilter("svg",(nodes=>nodes.forEach((node=>{node.wrap(editor.editorManager.html.Node.create("tiny-svg-block",{contenteditable:"false"}))})))),editor.serializer.addNodeFilter("tiny-svg-block",(nodes=>nodes.forEach((node=>{node.unwrap()}))))}))}}));
 
 //# sourceMappingURL=content.min.js.map

public/lib/editor/tiny/amd/src/content.js

@@ -99,6 +99,21 @@ export const addSVGSupport = (editor) => {
             // Any invalid markup will be accepted.
             svg: {
                 'extends': "div",
+                'attributes': [
+                    "id",
+                    "tabindex",
+                    "lang",
+                    "xml:space",
+                    "class",
+                    "style",
+                    "x",
+                    "y",
+                    "width",
+                    "height",
+                    "viewBox",
+                    "preserveAspectRatio",
+                    "transform",
+                ],
             },
             'tiny-svg-block': {
                 'extends': "div",

public/lib/editor/tiny/tests/behat/svg.feature

@@ -0,0 +1,17 @@
+@editor @editor_tiny @javascript
+Feature: Use SVG elements in TinyMCE
+  In order to use SVG elements in TinyMCE
+  As a user
+  I need to be able to specify how they appear
+
+  Scenario: SVG attributes are respected when saving source code
+    Given I am on the "Profile advanced editing" page logged in as "admin"
+    When I set the field "Description" to multiline:
+    """
+    <svg width="200" height="200">
+      <rect width="100" height="100" x="50" y="50" fill="red" />
+    </svg>
+    """
+    And I click on the "Tools > Source code" menu item for the "Description" TinyMCE editor
+    And I click on "Save" "button"
+    Then the field "Description" matches expression "#<svg width=\"200\" height=\"200\">.*<rect[^>]+>.*</svg>#s"