From a11ab3d5ea1477c02101eb7c4279b1dc0d2ef126 Mon Sep 17 00:00:00 2001
From: Mason Malone <651224+MasonM@users.noreply.github.com>
Date: Sat, 19 Nov 2022 12:48:17 -0800
Subject: [PATCH] Disallow leading whitespace before delimiter
---
.../integration/rendering/classDiagram-v2.spec.js | 10 +++++-----
cypress/integration/rendering/erDiagram.spec.js | 12 ++++++------
cypress/integration/rendering/flowchart-v2.spec.js | 10 +++++-----
cypress/integration/rendering/gitGraph.spec.js | 10 +++++-----
.../integration/rendering/stateDiagram-v2.spec.js | 12 ++++++------
demos/classchart.html | 6 +++---
demos/flowchart.html | 12 ++++++------
demos/git.html | 6 +++---
demos/journey.html | 6 +++---
demos/state.html | 12 ++++++------
packages/mermaid/src/diagram-api/frontmatter.spec.ts | 7 +++++++
packages/mermaid/src/diagram-api/frontmatter.ts | 2 +-
packages/mermaid/src/utils.spec.js | 5 ++---
13 files changed, 58 insertions(+), 52 deletions(-)
diff --git a/cypress/integration/rendering/classDiagram-v2.spec.js b/cypress/integration/rendering/classDiagram-v2.spec.js
index f9ed7c64b1..f97458857e 100644
--- a/cypress/integration/rendering/classDiagram-v2.spec.js
+++ b/cypress/integration/rendering/classDiagram-v2.spec.js
@@ -500,11 +500,11 @@ describe('Class diagram V2', () => {
it('1433: should render a simple class with a title', () => {
imgSnapshotTest(
`---
- title: simple class diagram
- ---
- classDiagram-v2
- class Class10
- `,
+title: simple class diagram
+---
+classDiagram-v2
+class Class10
+`,
{}
);
});
diff --git a/cypress/integration/rendering/erDiagram.spec.js b/cypress/integration/rendering/erDiagram.spec.js
index dea3c76204..8e8946170b 100644
--- a/cypress/integration/rendering/erDiagram.spec.js
+++ b/cypress/integration/rendering/erDiagram.spec.js
@@ -277,12 +277,12 @@ describe('Entity Relationship Diagram', () => {
it('1433: should render a simple ER diagram with a title', () => {
imgSnapshotTest(
`---
- title: simple ER diagram
- ---
- erDiagram
- CUSTOMER ||--o{ ORDER : places
- ORDER ||--|{ LINE-ITEM : contains
- `,
+title: simple ER diagram
+---
+erDiagram
+CUSTOMER ||--o{ ORDER : places
+ORDER ||--|{ LINE-ITEM : contains
+`,
{}
);
});
diff --git a/cypress/integration/rendering/flowchart-v2.spec.js b/cypress/integration/rendering/flowchart-v2.spec.js
index cdf0d07cad..30ae4f0d25 100644
--- a/cypress/integration/rendering/flowchart-v2.spec.js
+++ b/cypress/integration/rendering/flowchart-v2.spec.js
@@ -666,11 +666,11 @@ flowchart RL
it('1433: should render a titled flowchart with titleTopMargin set to 0', () => {
imgSnapshotTest(
`---
- title: Simple flowchart
- ---
- flowchart TD
- A --> B
- `,
+title: Simple flowchart
+---
+flowchart TD
+A --> B
+`,
{ titleTopMargin: 0 }
);
});
diff --git a/cypress/integration/rendering/gitGraph.spec.js b/cypress/integration/rendering/gitGraph.spec.js
index cb70f72725..0b5048b44b 100644
--- a/cypress/integration/rendering/gitGraph.spec.js
+++ b/cypress/integration/rendering/gitGraph.spec.js
@@ -325,11 +325,11 @@ describe('Git Graph diagram', () => {
it('1433: should render a simple gitgraph with a title', () => {
imgSnapshotTest(
`---
- title: simple gitGraph
- ---
- gitGraph
- commit
- `,
+title: simple gitGraph
+---
+gitGraph
+ commit
+`,
{}
);
});
diff --git a/cypress/integration/rendering/stateDiagram-v2.spec.js b/cypress/integration/rendering/stateDiagram-v2.spec.js
index 7c322c1b3f..0eca018739 100644
--- a/cypress/integration/rendering/stateDiagram-v2.spec.js
+++ b/cypress/integration/rendering/stateDiagram-v2.spec.js
@@ -562,12 +562,12 @@ stateDiagram-v2
it('1433: should render a simple state diagram with a title', () => {
imgSnapshotTest(
`---
- title: simple state diagram
- ---
- stateDiagram-v2
- [*] --> State1
- State1 --> [*]
- `,
+title: simple state diagram
+---
+stateDiagram-v2
+[*] --> State1
+State1 --> [*]
+`,
{}
);
});
diff --git a/demos/classchart.html b/demos/classchart.html
index 3481bbad59..031f3b608f 100644
--- a/demos/classchart.html
+++ b/demos/classchart.html
@@ -17,9 +17,9 @@
Class diagram demos
- ---
- title: Demo Class Diagram
- ---
+---
+title: Demo Class Diagram
+---
classDiagram
accTitle: Demo Class Diagram
accDescr: This class diagram show the abstract Animal class, and 3 classes that inherit from it: Duck, Fish, and Zebra.
diff --git a/demos/flowchart.html b/demos/flowchart.html
index 60e6160c38..7251e586e5 100644
--- a/demos/flowchart.html
+++ b/demos/flowchart.html
@@ -17,9 +17,9 @@ Comparison "graph vs. flowchart"
Sample 1
graph
- ---
- title: This is a complicated flow
- ---
+---
+title: This is a complicated flow
+---
graph LR
accTitle: This is a complicated flow
accDescr: This is the descriptoin for the complicated flow.
@@ -224,9 +224,9 @@ flowchart
Sample 2
graph
- ---
- title: What to buy
- ---
+---
+title: What to buy
+---
graph TD
accTitle: What to buy
accDescr: Options of what to buy with Christmas money
diff --git a/demos/git.html b/demos/git.html
index 5e683152aa..99c53d7d0a 100644
--- a/demos/git.html
+++ b/demos/git.html
@@ -16,9 +16,9 @@
Git diagram demo
- ---
- title: Simple Git diagram
- ---
+---
+title: Simple Git diagram
+---
gitGraph:
options
{
diff --git a/demos/journey.html b/demos/journey.html
index 71eecb5842..dadcfb13c0 100644
--- a/demos/journey.html
+++ b/demos/journey.html
@@ -16,9 +16,9 @@
Journey diagram demo
- ---
- title: My working day
- ---
+---
+title: My working day
+---
journey
accTitle: Very simple journey demo
accDescr: 2 main sections: work and home, each with just a few tasks
diff --git a/demos/state.html b/demos/state.html
index 9f126cbc25..c13da84d88 100644
--- a/demos/state.html
+++ b/demos/state.html
@@ -17,9 +17,9 @@
State diagram demos
Very simple showing change from State1 to State2
- ---
- title: Very simple diagram
- ---
+---
+title: Very simple diagram
+---
stateDiagram
accTitle: This is the accessible title
accDescr:This is an accessible description
@@ -46,9 +46,9 @@ And these are how they are applied:
- ---
- title: Very simple diagram
- ---
+---
+title: Very simple diagram
+---
stateDiagram-v2
accTitle: This is the accessible title
accDescr: This is an accessible description
diff --git a/packages/mermaid/src/diagram-api/frontmatter.spec.ts b/packages/mermaid/src/diagram-api/frontmatter.spec.ts
index 92aa70573d..4f8848f259 100644
--- a/packages/mermaid/src/diagram-api/frontmatter.spec.ts
+++ b/packages/mermaid/src/diagram-api/frontmatter.spec.ts
@@ -41,6 +41,13 @@ describe('extractFrontmatter', () => {
expect(db.setDiagramTitle).toHaveBeenCalledWith('foo---bar');
});
+ it('handles frontmatter with multi-line string and multiple delimiters', () => {
+ const db = dbMock();
+ const text = `---\ntitle: |\n multi-line string\n ---\n---\ndiagram`;
+ expect(extractFrontMatter(text, db)).toEqual('diagram');
+ expect(db.setDiagramTitle).toHaveBeenCalledWith('multi-line string\n---\n');
+ });
+
it('handles frontmatter with title', () => {
const db = dbMock();
const text = `---\ntitle: foo\n---\ndiagram`;
diff --git a/packages/mermaid/src/diagram-api/frontmatter.ts b/packages/mermaid/src/diagram-api/frontmatter.ts
index 46b161582a..b73440a7d7 100644
--- a/packages/mermaid/src/diagram-api/frontmatter.ts
+++ b/packages/mermaid/src/diagram-api/frontmatter.ts
@@ -6,7 +6,7 @@ import * as yaml from 'js-yaml';
// Note that JS doesn't support the "\A" anchor, which means we can't use
// multiline mode.
// Relevant YAML spec: https://yaml.org/spec/1.2.2/#914-explicit-documents
-export const frontMatterRegex = /^(?:\s*---\s*[\r\n])(.*?)(?:[\r\n]\s*---\s*[\r\n]+)/s;
+export const frontMatterRegex = /^(?:---\s*[\r\n])(.*?)(?:[\r\n]---\s*[\r\n]+)/s;
type FrontMatterMetadata = {
title?: string;
diff --git a/packages/mermaid/src/utils.spec.js b/packages/mermaid/src/utils.spec.js
index 04cf9b7695..4d3e07e6b5 100644
--- a/packages/mermaid/src/utils.spec.js
+++ b/packages/mermaid/src/utils.spec.js
@@ -238,10 +238,9 @@ Alice->Bob: hi`;
const type = detectType(str);
expect(type).toBe('gitGraph');
});
- it('should handle frontmatter with leading spaces', function () {
+ it('should not allow frontmatter with leading spaces', function () {
const str = ' ---\ntitle: foo\n---\n gitGraph TB:\nbfs1:queue';
- const type = detectType(str);
- expect(type).toBe('gitGraph');
+ expect(() => detectType(str)).toThrow('No diagram type detected for text');
});
});
describe('when finding substring in array ', function () {