marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-09-14 21:09:50 +02:00
Code Issues Packages Projects Releases Wiki Activity

#552 Adding rendering test

Browse Source
This commit is contained in:
Knut Sveidqvist
2019-12-11 21:12:48 +01:00
parent aa2f9622f8
commit fcf20215a6
2 changed files with 31 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
cypress/integration/rendering/gantt.spec.js
View File

@@ -38,4 +38,20 @@ describe('Sequencediagram', () => {
{} {}
); );
}); });
it('Multiple dependencies syntax', () => {
imgSnapshotTest(
`
gantt
dateFormat YYYY-MM-DD
axisFormat %d/%m
title Adding GANTT diagram to mermaid
excludes weekdays 2014-01-10
apple :a, 2017-07-20, 1w
banana :crit, b, 2017-07-23, 1d
cherry :active, c, after b a, 1d
`,
{}
);
});
}); });

23
cypress/platform/current.html
View File

@@ -5,7 +5,7 @@
rel="stylesheet" rel="stylesheet"
/> />
<style> <style>
body {background: black} body {background: white}
h1 { color: white;} h1 { color: white;}
.arrowheadPath {fill: red;} .arrowheadPath {fill: red;}
@@ -16,22 +16,29 @@
</head> </head>
<body> <body>
<h1>info below</h1> <h1>info below</h1>
<div style="display: flex;"> <div style="display: flex;width: 100%; height: 100%">
<div class="mermaid">graph TD <div class="mermaid" style="width: 100%; height: 100%">gantt
A ==> B dateFormat YYYY-MM-DD
A --> C axisFormat %d/%m
A -.-> D title Adding GANTT diagram to mermaid
excludes weekdays 2014-01-10
apple :a, 2017-07-20, 1w
banana :crit, b, 2017-07-23, 1d
cherry :active, c, after b a, 1d
</div> </div>
</div> </div>
<script src="./mermaid.js"></script> <script src="./mermaid.js"></script>
<script> <script>
mermaid.initialize({ mermaid.initialize({
theme: 'dark', // theme: 'dark',
// arrowMarkerAbsolute: true, // arrowMarkerAbsolute: true,
// themeCSS: '.edgePath .path {stroke: red;} .arrowheadPath {fill: red;}', // themeCSS: '.edgePath .path {stroke: red;} .arrowheadPath {fill: red;}',
logLevel: 3, logLevel: 3,
flowchart: { curve: 'linear', "htmlLabels": false }, flowchart: { curve: 'linear', "htmlLabels": false },
gantt: { axisFormat: '%m/%d/%Y' }, // gantt: { axisFormat: '%m/%d/%Y' },
sequence: { actorMargin: 50 }, sequence: { actorMargin: 50 },
// sequenceDiagram: { actorMargin: 300 } // deprecated // sequenceDiagram: { actorMargin: 300 } // deprecated
}); });