mirror of
https://github.com/mermaid-js/mermaid.git
synced 2025-09-18 14:59:53 +02:00
Merge commit from fork
fix: Sanitize icons and icon labels
This commit is contained in:
7
.changeset/good-weeks-tickle.md
Normal file
7
.changeset/good-weeks-tickle.md
Normal file
@@ -0,0 +1,7 @@
|
||||
---
|
||||
'mermaid': patch
|
||||
---
|
||||
|
||||
fix: sanitize icon labels and icon SVGs
|
||||
|
||||
Resolves CVE-2025-54880 reported by @fourcube
|
@@ -142,6 +142,17 @@ describe('XSS', () => {
|
||||
cy.get('#the-malware').should('not.exist');
|
||||
});
|
||||
|
||||
it('should sanitize icon labels in architecture diagrams', () => {
|
||||
const str = JSON.stringify({
|
||||
code: `architecture-beta
|
||||
group api(cloud)[API]
|
||||
service db "<img src=x onerror=\\"xssAttack()\\">" [Database] in api`,
|
||||
});
|
||||
imgSnapshotTest(utf8ToB64(str), {}, true);
|
||||
cy.wait(1000);
|
||||
cy.get('#the-malware').should('not.exist');
|
||||
});
|
||||
|
||||
it('should sanitize katex blocks', () => {
|
||||
const str = JSON.stringify({
|
||||
code: `sequenceDiagram
|
||||
|
@@ -1118,7 +1118,7 @@ end
|
||||
imgSnapshotTest(
|
||||
`flowchart TB
|
||||
A(["Start"]) --> n1["Untitled Node"]
|
||||
A --> n2["Untitled Node"]
|
||||
A --> n2["Untitled Node"]
|
||||
`,
|
||||
{}
|
||||
);
|
||||
@@ -1127,7 +1127,7 @@ end
|
||||
imgSnapshotTest(
|
||||
`flowchart BT
|
||||
n2["Untitled Node"] --> n1["Diamond"]
|
||||
n1@{ shape: diam}
|
||||
n1@{ shape: diam}
|
||||
`,
|
||||
{}
|
||||
);
|
||||
@@ -1138,7 +1138,7 @@ end
|
||||
n2["Untitled Node"] --> n1["Rounded Rectangle"]
|
||||
n3["Untitled Node"] --> n1
|
||||
n1@{ shape: rounded}
|
||||
n3@{ shape: rect}
|
||||
n3@{ shape: rect}
|
||||
`,
|
||||
{}
|
||||
);
|
||||
|
@@ -20,14 +20,14 @@
|
||||
width: 800
|
||||
nodeAlignment: left
|
||||
---
|
||||
sankey
|
||||
sankey
|
||||
a,b,8
|
||||
b,c,8
|
||||
c,d,8
|
||||
d,e,8
|
||||
|
||||
|
||||
x,c,4
|
||||
c,y,4
|
||||
c,y,4
|
||||
</pre>
|
||||
|
||||
<h2>Energy flow</h2>
|
||||
|
@@ -3,6 +3,7 @@ import { getConfig } from '../../diagram-api/diagramAPI.js';
|
||||
import { createText } from '../../rendering-util/createText.js';
|
||||
import { getIconSVG } from '../../rendering-util/icons.js';
|
||||
import type { D3Element } from '../../types.js';
|
||||
import { sanitizeText } from '../common/common.js';
|
||||
import type { ArchitectureDB } from './architectureDb.js';
|
||||
import { architectureIcons } from './architectureIcons.js';
|
||||
import {
|
||||
@@ -271,6 +272,7 @@ export const drawServices = async function (
|
||||
elem: D3Element,
|
||||
services: ArchitectureService[]
|
||||
): Promise<number> {
|
||||
const config = getConfig();
|
||||
for (const service of services) {
|
||||
const serviceElem = elem.append('g');
|
||||
const iconSize = db.getConfigField('iconSize');
|
||||
@@ -285,7 +287,7 @@ export const drawServices = async function (
|
||||
width: iconSize * 1.5,
|
||||
classes: 'architecture-service-label',
|
||||
},
|
||||
getConfig()
|
||||
config
|
||||
);
|
||||
|
||||
textElem
|
||||
@@ -320,7 +322,7 @@ export const drawServices = async function (
|
||||
.attr('class', 'node-icon-text')
|
||||
.attr('style', `height: ${iconSize}px;`)
|
||||
.append('div')
|
||||
.html(service.iconText);
|
||||
.html(sanitizeText(service.iconText, config));
|
||||
const fontSize =
|
||||
parseInt(
|
||||
window
|
||||
|
@@ -26,7 +26,7 @@ Drawing a pie chart is really simple in mermaid.
|
||||
|
||||
**Note:**
|
||||
|
||||
> Pie chart values must be **positive numbers greater than zero**.
|
||||
> Pie chart values must be **positive numbers greater than zero**.
|
||||
> **Negative values are not allowed** and will result in an error.
|
||||
|
||||
[pie] [showData] (OPTIONAL)
|
||||
|
@@ -1,6 +1,7 @@
|
||||
import { describe, expect, it } from 'vitest';
|
||||
import { replaceIconSubstring } from './createText.js';
|
||||
import { sanitizeText } from '../diagram-api/diagramAPI.js';
|
||||
import mermaid from '../mermaid.js';
|
||||
import { replaceIconSubstring } from './createText.js';
|
||||
|
||||
describe('replaceIconSubstring', () => {
|
||||
it('converts FontAwesome icon notations to HTML tags', async () => {
|
||||
@@ -56,7 +57,7 @@ describe('replaceIconSubstring', () => {
|
||||
]);
|
||||
const input = 'Icons galore: fa:fa-bell';
|
||||
const output = await replaceIconSubstring(input);
|
||||
const expected = staticBellIconPack.icons.bell.body;
|
||||
const expected = sanitizeText(staticBellIconPack.icons.bell.body);
|
||||
expect(output).toContain(expected);
|
||||
});
|
||||
});
|
||||
|
@@ -1,7 +1,9 @@
|
||||
import { log } from '../logger.js';
|
||||
import type { ExtendedIconifyIcon, IconifyIcon, IconifyJSON } from '@iconify/types';
|
||||
import type { IconifyIconCustomisations } from '@iconify/utils';
|
||||
import { getIconData, iconToHTML, iconToSVG, replaceIDs, stringToIcon } from '@iconify/utils';
|
||||
import { getConfig } from '../config.js';
|
||||
import { sanitizeText } from '../diagrams/common/common.js';
|
||||
import { log } from '../logger.js';
|
||||
|
||||
interface AsyncIconLoader {
|
||||
name: string;
|
||||
@@ -100,5 +102,5 @@ export const getIconSVG = async (
|
||||
...renderData.attributes,
|
||||
...extraAttributes,
|
||||
});
|
||||
return svg;
|
||||
return sanitizeText(svg, getConfig());
|
||||
};
|
||||
|
Reference in New Issue
Block a user