fix: sanitize addHtmlLabel in createLabel

Co-authored-by: Chris Grieger <chris@scolp.de>
This commit is contained in:
Sidharth Vinod
2025-08-18 16:50:53 +05:30
parent 7509b066f1
commit 2efe338cb5

View File

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