From 44d7dfe9932c002d06330086e8b296ee095e5517 Mon Sep 17 00:00:00 2001 From: Knut Sveidqvist Date: Tue, 18 Jan 2022 23:02:16 +0100 Subject: [PATCH 1/3] #2646 exploration --- cypress/platform/xss19.html | 107 +++++++++++++++++++++++++ docs/directives.md | 10 +-- src/dagre-wrapper/createLabel.js | 6 +- src/diagrams/class/classDb.js | 3 + src/diagrams/class/classRenderer-v2.js | 4 +- 5 files changed, 122 insertions(+), 8 deletions(-) create mode 100644 cypress/platform/xss19.html diff --git a/cypress/platform/xss19.html b/cypress/platform/xss19.html new file mode 100644 index 0000000000..646162d0cf --- /dev/null +++ b/cypress/platform/xss19.html @@ -0,0 +1,107 @@ + + + + + + + + + +
Security check
+
+
+
+ + + + + diff --git a/docs/directives.md b/docs/directives.md index 5f7c720daa..b5ac493318 100644 --- a/docs/directives.md +++ b/docs/directives.md @@ -3,7 +3,7 @@ **Edit this Page** [![N|Solid](img/GitHub-Mark-32px.png)](https://github.com/mermaid-js/mermaid/blob/develop/docs/directives.md) ## Directives -Directives gives a diagram author the capability to alter the appearance of a diagram before rendering by changing the applied configuration. +Directives gives a diagram author the capability to alter the appearance of a diagram before rendering by changing the applied configuration. Directives are divided into two sets or orders, by priority in parsing. The first set, containing 'init' or 'initialize' directives are loaded ahead of any other directive. While the other set, containing all other kinds of directives are parsed and factored into the rendering, only after 'init' and the desired graph-type are declared. @@ -18,7 +18,7 @@ Directives are divided into two sets or orders, by priority in parsing. The firs init would be an argument-directive: %%{init: { **insert argument here**}}%% The json object that is passed as {**argument** } must be valid key value pairs and encased in quotation marks or it will be ignored. -Valid Key Value pairs can be found in config. +Valid Key Value pairs can be found in config. The init/initialize directive is parsed earlier in the flow, this allows the incorporation of `%%init%%` directives into the mermaid diagram that is being rendered. Example: ```mmd @@ -27,11 +27,11 @@ graph > A-->B ``` -will set the `logLevel` to `debug` and the `theme` to `dark` for a flowchart diagram, changing the appearance of the diagram itself. +will set the `logLevel` to `debug` and the `theme` to `dark` for a flowchart diagram, changing the appearance of the diagram itself. Note: 'init' or 'initialize' are both acceptable as init directives. Also note that `%%init%%` and `%%initialize%%` directives will be grouped together after they are parsed. This means: -```mmd +```mmd2 %%{init: { 'logLevel': 'debug', 'theme': 'forest' } }%% %%{initialize: { 'logLevel': 'fatal', "theme":'dark', 'startOnLoad': true } }%% ... @@ -79,6 +79,6 @@ Init directives and any other non-multiline directives should be backwards compa Multiline directives, however, will pose an issue and will render an error. This is unavoidable. -# example +# example diff --git a/src/dagre-wrapper/createLabel.js b/src/dagre-wrapper/createLabel.js index bf360773c8..9ae67dc13d 100644 --- a/src/dagre-wrapper/createLabel.js +++ b/src/dagre-wrapper/createLabel.js @@ -1,7 +1,9 @@ import { select } from 'd3'; import { log } from '../logger'; // eslint-disable-line import { getConfig } from '../config'; -import { evaluate } from '../diagrams/common/common'; +import { sanitizeText, evaluate } from '../diagrams/common/common'; + +const sanitizeTxt = (txt) => sanitizeText(txt, getConfig()); /** * @param dom @@ -42,7 +44,7 @@ function addHtmlLabel(node) { } const createLabel = (_vertexText, style, isTitle, isNode) => { - let vertexText = _vertexText || ''; + let vertexText = sanitizeTxt(_vertexText || ''); if (typeof vertexText === 'object') vertexText = vertexText[0]; if (evaluate(getConfig().flowchart.htmlLabels)) { // TODO: addHtmlLabel accepts a labelStyle. Do we possibly have that? diff --git a/src/diagrams/class/classDb.js b/src/diagrams/class/classDb.js index ba33b5f777..005eceab65 100644 --- a/src/diagrams/class/classDb.js +++ b/src/diagrams/class/classDb.js @@ -13,6 +13,8 @@ let classCounter = 0; let funs = []; +const sanitizeText = (txt) => common.sanitizeText(txt, configApi.getConfig()); + export const parseDirective = function (statement, context, type) { mermaidAPI.parseDirective(this, statement, context, type); }; @@ -137,6 +139,7 @@ export const addMember = function (className, member) { if (typeof member === 'string') { // Member can contain white spaces, we trim them out + // const memberString = sanitizeText(member.trim()); const memberString = member.trim(); if (memberString.startsWith('<<') && memberString.endsWith('>>')) { diff --git a/src/diagrams/class/classRenderer-v2.js b/src/diagrams/class/classRenderer-v2.js index a128d8e2e5..0f552d2ec4 100644 --- a/src/diagrams/class/classRenderer-v2.js +++ b/src/diagrams/class/classRenderer-v2.js @@ -17,6 +17,8 @@ parser.yy = classDb; let idCache = {}; const padding = 20; +const sanitizeText = (txt) => common.sanitizeText(txt, getConfig()); + const conf = { dividerMargin: 10, padding: 5, @@ -103,7 +105,7 @@ export const addClasses = function (classes, g) { g.setNode(vertex.id, { labelStyle: styles.labelStyle, shape: _shape, - labelText: vertexText, + labelText: sanitizeText(vertexText), classData: vertex, rx: radious, ry: radious, From 2210c73ae8a4370be6a72a68804cc737b1ee144c Mon Sep 17 00:00:00 2001 From: Knut Sveidqvist Date: Tue, 18 Jan 2022 23:21:09 +0100 Subject: [PATCH 2/3] fix: handling annotations --- src/dagre-wrapper/createLabel.js | 2 +- src/diagrams/class/classDb.js | 7 +++---- 2 files changed, 4 insertions(+), 5 deletions(-) diff --git a/src/dagre-wrapper/createLabel.js b/src/dagre-wrapper/createLabel.js index 9ae67dc13d..ed7b9f6fb1 100644 --- a/src/dagre-wrapper/createLabel.js +++ b/src/dagre-wrapper/createLabel.js @@ -44,7 +44,7 @@ function addHtmlLabel(node) { } const createLabel = (_vertexText, style, isTitle, isNode) => { - let vertexText = sanitizeTxt(_vertexText || ''); + let vertexText = _vertexText || ''; if (typeof vertexText === 'object') vertexText = vertexText[0]; if (evaluate(getConfig().flowchart.htmlLabels)) { // TODO: addHtmlLabel accepts a labelStyle. Do we possibly have that? diff --git a/src/diagrams/class/classDb.js b/src/diagrams/class/classDb.js index 005eceab65..16f121ec9d 100644 --- a/src/diagrams/class/classDb.js +++ b/src/diagrams/class/classDb.js @@ -139,16 +139,15 @@ export const addMember = function (className, member) { if (typeof member === 'string') { // Member can contain white spaces, we trim them out - // const memberString = sanitizeText(member.trim()); const memberString = member.trim(); if (memberString.startsWith('<<') && memberString.endsWith('>>')) { // Remove leading and trailing brackets - theClass.annotations.push(memberString.substring(2, memberString.length - 2)); + theClass.annotations.push(sanitizeText(memberString.substring(2, memberString.length - 2))); } else if (memberString.indexOf(')') > 0) { - theClass.methods.push(memberString); + theClass.methods.push(sanitizeText(memberString)); } else if (memberString) { - theClass.members.push(memberString); + theClass.members.push(sanitizeText(memberString)); } } }; From 3a2f6659a6a06e9b37ae40e04e3a4c9192b69d35 Mon Sep 17 00:00:00 2001 From: Knut Sveidqvist Date: Tue, 18 Jan 2022 23:26:43 +0100 Subject: [PATCH 3/3] fix: one more sanitization --- src/diagrams/class/classDb.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/diagrams/class/classDb.js b/src/diagrams/class/classDb.js index 16f121ec9d..163ac10ddb 100644 --- a/src/diagrams/class/classDb.js +++ b/src/diagrams/class/classDb.js @@ -163,7 +163,7 @@ export const cleanupLabel = function (label) { if (label.substring(0, 1) === ':') { return common.sanitizeText(label.substr(1).trim(), configApi.getConfig()); } else { - return label.trim(); + return sanitizeText(label.trim()); } };