marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-08-15 06:19:24 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #4846 from aloisklink/test/fix-theme-directives-e2e-test

Browse Source 
Wait for `theme-directives.html` E2E test to render before taking a screenshot
This commit is contained in:
Sidharth Vinod
2023-09-19 11:18:15 +00:00
committed by GitHub
parent d6f1c11559 17f5052a6f
commit e8347cedf3
2 changed files with 9 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
cypress/integration/rendering/conf-and-directives.spec.js
View File

@@ -1,4 +1,4 @@
import { imgSnapshotTest } from '../../helpers/util.ts';
import { imgSnapshotTest, urlSnapshotTest } from '../../helpers/util.ts';
describe('Configuration and directives - nodes should be light blue', () => {
it('No config - use default', () => {
@@ -206,8 +206,7 @@ graph TD
describe('when rendering several diagrams', () => {
it('diagrams should not taint later diagrams', () => {
const url = 'http://localhost:9000/theme-directives.html';
cy.visit(url);
cy.matchImageSnapshot('conf-and-directives.spec-when-rendering-several-diagrams-diagram-1');
urlSnapshotTest(url, {});
});
});
});

28
cypress/platform/theme-directives.html
View File

@@ -1,15 +1,6 @@
<html>
<head>
<link href="https://fonts.googleapis.com/css?family=Montserrat&display=swap" rel="stylesheet" />
<link href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" rel="stylesheet" />
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"
/>
<link
href="https://fonts.googleapis.com/css?family=Noto+Sans+SC&display=swap"
rel="stylesheet"
/>
<style>
body {
/* background: rgb(221, 208, 208); */
@@ -122,26 +113,21 @@
<script type="module">
import mermaid from './mermaid.esm.mjs';
mermaid.parseError = function (err, hash) {
// console.error('Mermaid error: ', err);
};
mermaid.initialize({
// theme: 'dark',
// theme: 'dark',
// arrowMarkerAbsolute: true,
// themeCSS: '.edgePath .path {stroke: red;} .arrowheadPath {fill: red;}',
logLevel: 0,
// flowchart: { useMaxWidth: true },
graph: { curve: 'cardinal', htmlLabels: false },
// gantt: { axisFormat: '%m/%d/%Y' },
sequence: { actorMargin: 50, showSequenceNumbers: true },
// sequenceDiagram: { actorMargin: 300 } // deprecated
fontFamily: '"arial", sans-serif',
curve: 'cardinal',
securityLevel: 'strict',
startOnLoad: false,
});
function callback() {
alert('It worked');
await mermaid.run();
if (window.Cypress) {
window.rendered = true;
}
</script>
</body>