diff --git a/cypress/helpers/util.js b/cypress/helpers/util.js
index a7e6d47c7..143fc7ed7 100644
--- a/cypress/helpers/util.js
+++ b/cypress/helpers/util.js
@@ -1,28 +1,28 @@
/* eslint-env jest */
-import { Base64 } from 'js-base64'
+import { Base64 } from 'js-base64';
export const mermaidUrl = (graphStr, options, api) => {
const obj = {
code: graphStr,
mermaid: options
- }
- const objStr = JSON.stringify(obj)
- let url = 'http://localhost:9000/e2e.html?graph=' + Base64.encodeURI(objStr)
+ };
+ const objStr = JSON.stringify(obj);
+ let url = 'http://localhost:9000/e2e.html?graph=' + Base64.encodeURI(objStr);
if (api) {
- url = 'http://localhost:9000/xss.html?graph=' + graphStr
+ url = 'http://localhost:9000/xss.html?graph=' + graphStr;
}
if (options.listUrl) {
- cy.log(options.listId, ' ', url)
+ cy.log(options.listId, ' ', url);
}
- return url
-}
+ return url;
+};
-export const imgSnapshotTest = (graphStr, options, api) => {
- const url = mermaidUrl(graphStr, options, api)
+export const imgSnapshotTest = (graphStr, options, api) => {
+ const url = mermaidUrl(graphStr, options, api);
cy.visit(url);
- cy.get('svg')
- cy.percySnapshot()
-}
+ cy.get('svg');
+ cy.percySnapshot();
+};
diff --git a/cypress/integration/other/webpackUsage.spec.js b/cypress/integration/other/webpackUsage.spec.js
new file mode 100644
index 000000000..af93bdd50
--- /dev/null
+++ b/cypress/integration/other/webpackUsage.spec.js
@@ -0,0 +1,11 @@
+/* eslint-env jest */
+describe('Sequencediagram', () => {
+ it('should render a simple sequence diagrams', () => {
+ const url = 'http://localhost:9000/webpackUsage.html';
+
+ cy.visit(url);
+ cy.get('body')
+ .find('svg')
+ .should('have.length', 2);
+ });
+});
diff --git a/cypress/integration/other/xss.spec.js b/cypress/integration/other/xss.spec.js
new file mode 100644
index 000000000..a550b6783
--- /dev/null
+++ b/cypress/integration/other/xss.spec.js
@@ -0,0 +1,16 @@
+/* eslint-env jest */
+import { mermaidUrl } from '../../helpers/util.js';
+
+/* eslint-disable */
+describe('XSS', () => {
+ it('should handle xss in tags', () => {
+ const str = 'eyJjb2RlIjoiXG5ncmFwaCBMUlxuICAgICAgQi0tPkQoPGltZyBvbmVycm9yPWxvY2F0aW9uPWBqYXZhc2NyaXB0XFx1MDAzYXhzc0F0dGFja1xcdTAwMjhkb2N1bWVudC5kb21haW5cXHUwMDI5YCBzcmM9eD4pOyIsIm1lcm1haWQiOnsidGhlbWUiOiJkZWZhdWx0In19';
+
+ const url = mermaidUrl(str,{}, true);
+
+ cy.visit(url);
+ cy.get('svg')
+ cy.percySnapshot()
+
+ })
+})
diff --git a/cypress/integration/e2e/classDiagram.spec.js b/cypress/integration/rendering/classDiagram.spec.js
similarity index 80%
rename from cypress/integration/e2e/classDiagram.spec.js
rename to cypress/integration/rendering/classDiagram.spec.js
index 3f94589b3..b80f5d23c 100644
--- a/cypress/integration/e2e/classDiagram.spec.js
+++ b/cypress/integration/rendering/classDiagram.spec.js
@@ -1,9 +1,10 @@
/* eslint-env jest */
-import { imgSnapshotTest} from '../../helpers/util'
+import { imgSnapshotTest } from '../../helpers/util';
describe('Sequencediagram', () => {
it('should render a simple class diagrams', () => {
- imgSnapshotTest(`
+ imgSnapshotTest(
+ `
classDiagram
Class01 <|-- AveryLongClass : Cool
Class03 *-- Class04
@@ -19,7 +20,8 @@ describe('Sequencediagram', () => {
Class01 : int gorilla
Class08 <--> C2: Cool label
`,
- {})
- cy.get('svg')
- })
-})
+ {}
+ );
+ cy.get('svg');
+ });
+});
diff --git a/cypress/integration/e2e/flowchart.spec.js b/cypress/integration/rendering/flowchart.spec.js
similarity index 94%
rename from cypress/integration/e2e/flowchart.spec.js
rename to cypress/integration/rendering/flowchart.spec.js
index 775f96393..89ec06d76 100644
--- a/cypress/integration/e2e/flowchart.spec.js
+++ b/cypress/integration/rendering/flowchart.spec.js
@@ -1,20 +1,22 @@
/* eslint-env jest */
-import { imgSnapshotTest} from '../../helpers/util'
-
+import { imgSnapshotTest } from '../../helpers/util';
describe('Flowcart', () => {
it('should render a simple flowchart', () => {
- imgSnapshotTest(`graph TD
+ imgSnapshotTest(
+ `graph TD
A[Christmas] -->|Get money| B(Go shopping)
B --> C{Let me think}
C -->|One| D[Laptop]
C -->|Two| E[iPhone]
C -->|Three| F[fa:fa-car Car]
`,
- {})
- })
+ {}
+ );
+ });
it('should render a simple flowchart with line breaks', () => {
- imgSnapshotTest(`
+ imgSnapshotTest(
+ `
graph TD
A[Christmas] -->|Get money| B(Go shopping)
B --> C{Let me thinksssss
ssssssssssssssssssssss
sssssssssssssssssssssssssss}
@@ -22,11 +24,13 @@ describe('Flowcart', () => {
C -->|Two| E[iPhone]
C -->|Three| F[Car]
`,
- {})
- })
+ {}
+ );
+ });
it('should render a simple flowchart with trapezoid and inverse trapezoid vertex options.', () => {
- imgSnapshotTest(`
+ imgSnapshotTest(
+ `
graph TD
A[/Christmas\\]
A -->|Get money| B[\\Go shopping/]
@@ -35,11 +39,13 @@ describe('Flowcart', () => {
C -->|Two| E[\\iPhone\\]
C -->|Three| F[Car]
`,
- {})
- })
+ {}
+ );
+ });
it('should style nodes via a class.', () => {
- imgSnapshotTest(`
+ imgSnapshotTest(
+ `
graph TD
1A --> 1B
1B --> 1C
@@ -49,11 +55,13 @@ describe('Flowcart', () => {
classDef processHead fill:#888888,color:white,font-weight:bold,stroke-width:3px,stroke:#001f3f
class 1A,1B,D,E processHead
`,
- {})
- })
+ {}
+ );
+ });
it('should render a flowchart full of circles', () => {
- imgSnapshotTest(`
+ imgSnapshotTest(
+ `
graph LR
47(SAM.CommonFA.FMESummary)-->48(SAM.CommonFA.CommonFAFinanceBudget)
37(SAM.CommonFA.BudgetSubserviceLineVolume)-->48(SAM.CommonFA.CommonFAFinanceBudget)
@@ -76,10 +84,12 @@ describe('Flowcart', () => {
35(SAM.CommonFA.PopulationFME)-->39(SAM.CommonFA.ChargeDetails)
36(SAM.CommonFA.PremetricCost)-->39(SAM.CommonFA.ChargeDetails)
`,
- {})
- })
+ {}
+ );
+ });
it('should render a flowchart full of icons', () => {
- imgSnapshotTest(`
+ imgSnapshotTest(
+ `
graph TD
9e122290_1ec3_e711_8c5a_005056ad0002("fa:fa-creative-commons My System | Test Environment")
82072290_1ec3_e711_8c5a_005056ad0002("fa:fa-cogs Shared Business Logic Server:Service 1")
@@ -144,37 +154,45 @@ describe('Flowcart', () => {
9a072290_1ec3_e711_8c5a_005056ad0002-->d6072290_1ec3_e711_8c5a_005056ad0002
9a072290_1ec3_e711_8c5a_005056ad0002-->71082290_1ec3_e711_8c5a_005056ad0002
`,
- {})
- })
+ {}
+ );
+ });
it('should render labels with numbers at the start', () => {
- imgSnapshotTest(`
+ imgSnapshotTest(
+ `
graph TB;subgraph "number as labels";1;end;
`,
- {})
- })
+ {}
+ );
+ });
it('should render subgraphs', () => {
- imgSnapshotTest(`
+ imgSnapshotTest(
+ `
graph TB
subgraph One
a1-->a2
end
`,
- {})
- })
+ {}
+ );
+ });
it('should render subgraphs with a title startign with a digit', () => {
- imgSnapshotTest(`
+ imgSnapshotTest(
+ `
graph TB
subgraph 2Two
a1-->a2
end
`,
- {})
- })
+ {}
+ );
+ });
it('should render styled subgraphs', () => {
- imgSnapshotTest(`
+ imgSnapshotTest(
+ `
graph TB
A
B
@@ -203,11 +221,13 @@ describe('Flowcart', () => {
style foo fill:#F99,stroke-width:2px,stroke:#F0F
style bar fill:#999,stroke-width:10px,stroke:#0F0
`,
- {})
- })
+ {}
+ );
+ });
it('should render a flowchart with ling sames and class definitoins', () => {
- imgSnapshotTest(`graph LR
+ imgSnapshotTest(
+ `graph LR
sid-B3655226-6C29-4D00-B685-3D5C734DC7E1["
提交申请
@@ -303,11 +323,13 @@ describe('Flowcart', () => {
sid-7CE72B24-E0C1-46D3-8132-8BA66BE05AA7-->sid-4DA958A0-26D9-4D47-93A7-70F39FD7D51A;
sid-7CE72B24-E0C1-46D3-8132-8BA66BE05AA7-->sid-4FC27B48-A6F9-460A-A675-021F5854FE22;
`,
- {})
- })
+ {}
+ );
+ });
it('should render color of styled nodes', () => {
- imgSnapshotTest(`
+ imgSnapshotTest(
+ `
graph LR
foo-->bar
@@ -315,10 +337,11 @@ describe('Flowcart', () => {
style foo fill:#F99,stroke-width:2px,stroke:#F0F
style bar fill:#999,color: #00ff00, stroke-width:10px,stroke:#0F0
`,
- {
- listUrl: false,
- listId: 'color styling',
- logLevel: 0
- })
- })
-})
+ {
+ listUrl: false,
+ listId: 'color styling',
+ logLevel: 0
+ }
+ );
+ });
+});
diff --git a/cypress/integration/e2e/gantt.spec.js b/cypress/integration/rendering/gantt.spec.js
similarity index 92%
rename from cypress/integration/e2e/gantt.spec.js
rename to cypress/integration/rendering/gantt.spec.js
index 63b4911a6..faba97d9c 100644
--- a/cypress/integration/e2e/gantt.spec.js
+++ b/cypress/integration/rendering/gantt.spec.js
@@ -1,9 +1,10 @@
/* eslint-env jest */
-import { imgSnapshotTest } from '../../helpers/util.js'
+import { imgSnapshotTest } from '../../helpers/util.js';
describe('Sequencediagram', () => {
it('should render a gantt chart', () => {
- imgSnapshotTest(`
+ imgSnapshotTest(
+ `
gantt
dateFormat YYYY-MM-DD
axisFormat %d/%m
@@ -34,6 +35,7 @@ describe('Sequencediagram', () => {
Add gantt diagram to demo page : 20h
Add another diagram to demo page : 48h
`,
- {})
- })
-})
+ {}
+ );
+ });
+});
diff --git a/cypress/integration/e2e/gitGraph.spec.js b/cypress/integration/rendering/gitGraph.spec.js
similarity index 77%
rename from cypress/integration/e2e/gitGraph.spec.js
rename to cypress/integration/rendering/gitGraph.spec.js
index 4bdfa0bfc..c36f635b4 100644
--- a/cypress/integration/e2e/gitGraph.spec.js
+++ b/cypress/integration/rendering/gitGraph.spec.js
@@ -1,9 +1,10 @@
/* eslint-env jest */
-import { imgSnapshotTest } from '../../helpers/util.js'
+import { imgSnapshotTest } from '../../helpers/util.js';
describe('Sequencediagram', () => {
it('should render a simple git graph', () => {
- imgSnapshotTest(`
+ imgSnapshotTest(
+ `
gitGraph:
options
{
@@ -21,6 +22,7 @@ describe('Sequencediagram', () => {
commit
merge newbranch
`,
- {})
- })
-})
+ {}
+ );
+ });
+});
diff --git a/cypress/integration/e2e/info.spec.js b/cypress/integration/rendering/info.spec.js
similarity index 56%
rename from cypress/integration/e2e/info.spec.js
rename to cypress/integration/rendering/info.spec.js
index b9a5e270a..943f2357e 100644
--- a/cypress/integration/e2e/info.spec.js
+++ b/cypress/integration/rendering/info.spec.js
@@ -1,12 +1,14 @@
/* eslint-env jest */
-import { imgSnapshotTest } from '../../helpers/util.js'
+import { imgSnapshotTest } from '../../helpers/util.js';
describe('Sequencediagram', () => {
it('should render a simple info diagrams', () => {
- imgSnapshotTest(`
+ imgSnapshotTest(
+ `
info
showInfo
`,
- {})
- })
-})
+ {}
+ );
+ });
+});
diff --git a/cypress/integration/e2e/pie.spec.js b/cypress/integration/rendering/pie.spec.js
similarity index 65%
rename from cypress/integration/e2e/pie.spec.js
rename to cypress/integration/rendering/pie.spec.js
index 8450b252e..f930ac246 100644
--- a/cypress/integration/e2e/pie.spec.js
+++ b/cypress/integration/rendering/pie.spec.js
@@ -1,14 +1,16 @@
/* eslint-env jest */
-import { imgSnapshotTest } from '../../helpers/util.js'
+import { imgSnapshotTest } from '../../helpers/util.js';
describe('Pie Chart', () => {
it('should render a simple pie diagram', () => {
- imgSnapshotTest(`
+ imgSnapshotTest(
+ `
pie title Sports in Sweden
"Bandy" : 40
"Ice-Hockey" : 80
"Football" : 90
`,
- {})
- })
-})
+ {}
+ );
+ });
+});
diff --git a/cypress/integration/e2e/sequencediagram.spec.js b/cypress/integration/rendering/sequencediagram.spec.js
similarity index 87%
rename from cypress/integration/e2e/sequencediagram.spec.js
rename to cypress/integration/rendering/sequencediagram.spec.js
index 59671e0e0..e1912a307 100644
--- a/cypress/integration/e2e/sequencediagram.spec.js
+++ b/cypress/integration/rendering/sequencediagram.spec.js
@@ -1,10 +1,11 @@
///
-import { imgSnapshotTest} from '../../helpers/util';
+import { imgSnapshotTest } from '../../helpers/util';
context('Aliasing', () => {
it('should render a simple sequence diagrams', () => {
- imgSnapshotTest(`
+ imgSnapshotTest(
+ `
sequenceDiagram
participant Alice
participant Bob
@@ -27,11 +28,14 @@ context('Aliasing', () => {
and
Alice -->> John: Parallel message 2
end
- `, {})
- })
+ `,
+ {}
+ );
+ });
context('background rects', () => {
it('should render a single and nested rects', () => {
- imgSnapshotTest(`
+ imgSnapshotTest(
+ `
sequenceDiagram
participant A
participant B
@@ -56,10 +60,13 @@ context('Aliasing', () => {
E ->> E: Task 6
end
D -->> A: Complete
- `, {})
- })
+ `,
+ {}
+ );
+ });
it('should render rect around and inside loops', () => {
- imgSnapshotTest(`
+ imgSnapshotTest(
+ `
sequenceDiagram
A ->> B: 1
rect rgb(204, 0, 102)
@@ -75,10 +82,13 @@ context('Aliasing', () => {
D --> C: 4
end
end
- `, {})
- })
+ `,
+ {}
+ );
+ });
it('should render rect around and inside alts', () => {
- imgSnapshotTest(`
+ imgSnapshotTest(
+ `
sequenceDiagram
A ->> B: 1
rect rgb(204, 0, 102)
@@ -91,10 +101,13 @@ context('Aliasing', () => {
end
end
B ->> A: Return
- `, {})
- })
+ `,
+ {}
+ );
+ });
it('should render rect around and inside opts', () => {
- imgSnapshotTest(`
+ imgSnapshotTest(
+ `
sequenceDiagram
A ->> B: 1
rect rgb(204, 0, 102)
@@ -112,7 +125,9 @@ context('Aliasing', () => {
end
end
B ->> A: Return
- `, {})
- })
- })
-})
+ `,
+ {}
+ );
+ });
+ });
+});
diff --git a/e2e/spec/webpackUsage.spec.js b/e2e/spec/webpackUsage.spec.js
deleted file mode 100644
index 88aafc9f2..000000000
--- a/e2e/spec/webpackUsage.spec.js
+++ /dev/null
@@ -1,16 +0,0 @@
-/* eslint-env jest */
-const { toMatchImageSnapshot } = require('jest-image-snapshot')
-
-expect.extend({ toMatchImageSnapshot })
-
-describe('Sequencediagram', () => {
- it('should render a simple sequence diagrams', async () => {
- const url = 'http://localhost:9000/webpackUsage.html'
-
- await page.goto(url)
-
- const image = await page.screenshot()
-
- expect(image).toMatchImageSnapshot()
- })
-})