test: External diagram rendering test

This commit is contained in:
Sidharth Vinod 2024-09-02 14:05:37 +05:30
parent 007da4588b
commit f5cc0dcaea
No known key found for this signature in database
GPG Key ID: FB5CCD378D3907CD
3 changed files with 45 additions and 2 deletions

View File

@ -73,7 +73,7 @@ export const imgSnapshotTest = (
export const urlSnapshotTest = (
url: string,
options: CypressMermaidConfig,
options: CypressMermaidConfig = {},
_api = false,
validation?: any
): void => {

View File

@ -1,4 +1,4 @@
import { imgSnapshotTest } from '../../helpers/util.ts';
import { imgSnapshotTest, urlSnapshotTest } from '../../helpers/util.ts';
describe.skip('architecture diagram', () => {
it('should render a simple architecture diagram with groups', () => {
@ -172,3 +172,7 @@ describe.skip('architecture diagram', () => {
);
});
});
it('should allow adding external icons', () => {
urlSnapshotTest('http://localhost:9000/architecture-external.html');
});

View File

@ -0,0 +1,39 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>Architecture Mermaid Test Page</title>
<link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgo=" />
<style>
div.mermaid {
/* font-family: 'trebuchet ms', verdana, arial; */
font-family: 'Courier New', Courier, monospace !important;
}
</style>
</head>
<body>
<h2>External Icons Demo</h2>
<pre class="mermaid">
architecture-beta
service s3(logos:aws-s3)[Cloud Store]
service ec2(logos:aws-ec2)[Server]
service api(logos:aws-api-gateway)[Api Gateway]
</pre>
<script type="module">
import mermaid from './mermaid.esm.mjs';
mermaid.initialize({
startOnLoad: false,
logLevel: 0,
});
const logos = await fetch('https://unpkg.com/@iconify-json/logos/icons.json');
mermaid.registerIconPacks(await logos.json());
await mermaid.run();
if (window.Cypress) {
window.rendered = true;
}
</script>
</body>
</html>