fix: sanitize addHtmlLabel in createLabel

Co-authored-by: Chris Grieger <chris@scolp.de>

Author: sidharthv96

packages/mermaid/src/dagre-wrapper/createLabel.js

@@ -1,7 +1,7 @@
 import { select } from 'd3';
-import { log } from '../logger.js';
 import { getConfig } from '../diagram-api/diagramAPI.js';
-import { evaluate } from '../diagrams/common/common.js';
+import { evaluate, sanitizeText } from '../diagrams/common/common.js';
+import { log } from '../logger.js';
 import { decodeEntities } from '../utils.js';
 
 /**
@@ -18,20 +18,23 @@ function applyStyle(dom, styleFn) {
  * @param {any} node
  * @returns {SVGForeignObjectElement} Node
  */
-function addHtmlLabel(node) {
+function addHtmlLabel(node, config) {
   const fo = select(document.createElementNS('http://www.w3.org/2000/svg', 'foreignObject'));
   const div = fo.append('xhtml:div');
 
   const label = node.label;
   const labelClass = node.isNode ? 'nodeLabel' : 'edgeLabel';
   div.html(
-    '<span class="' +
-      labelClass +
-      '" ' +
-      (node.labelStyle ? 'style="' + node.labelStyle + '"' : '') +
-      '>' +
-      label +
-      '</span>'
+    sanitizeText(
+      '<span class="' +
+        labelClass +
+        '" ' +
+        (node.labelStyle ? 'style="' + node.labelStyle + '"' : '') +
+        '>' +
+        label +
+        '</span>',
+      config,
+    ),
   );
 
   applyStyle(div, node.labelStyle);
@@ -53,19 +56,20 @@ const createLabel = (_vertexText, style, isTitle, isNode) => {
   if (typeof vertexText === 'object') {
     vertexText = vertexText[0];
   }
-  if (evaluate(getConfig().flowchart.htmlLabels)) {
+  const config = getConfig();
+  if (evaluate(config.flowchart.htmlLabels)) {
     // TODO: addHtmlLabel accepts a labelStyle. Do we possibly have that?
     vertexText = vertexText.replace(/\\n|\n/g, '<br />');
     log.debug('vertexText' + vertexText);
     const node = {
       isNode,
       label: decodeEntities(vertexText).replace(
         /fa[blrs]?:fa-[\w-]+/g, // cspell: disable-line
-        (s) => `<i class='${s.replace(':', ' ')}'></i>`
+        (s) => `<i class='${s.replace(':', ' ')}'></i>`,
       ),
       labelStyle: style.replace('fill:', 'color:'),
     };
-    let vertexNode = addHtmlLabel(node);
+    let vertexNode = addHtmlLabel(node, config);
     // vertexNode.parentNode.removeChild(vertexNode);
     return vertexNode;
   } else {