From 17f5052a6f5aee254e8639db6e022349358b862d Mon Sep 17 00:00:00 2001 From: Alois Klink Date: Sat, 16 Sep 2023 00:26:24 +0100 Subject: [PATCH] test(e2e): wait for theme-directives.html The `theme-directives.html` test currently sometimes takes a screenshot before all of the Mermaid diagrams have completed rendering. We can use the `urlSnapshopTest()` helper function, which waits until a `.rendered` property exists on the page. Co-authored-by: Sidharth Vinod --- cypress/integration/rendering/conf-and-directives.spec.js | 5 ++--- cypress/platform/theme-directives.html | 7 +++++++ 2 files changed, 9 insertions(+), 3 deletions(-) diff --git a/cypress/integration/rendering/conf-and-directives.spec.js b/cypress/integration/rendering/conf-and-directives.spec.js index 401a24894..d447ea993 100644 --- a/cypress/integration/rendering/conf-and-directives.spec.js +++ b/cypress/integration/rendering/conf-and-directives.spec.js @@ -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, {}); }); }); }); diff --git a/cypress/platform/theme-directives.html b/cypress/platform/theme-directives.html index 21711a4fe..bd91688d7 100644 --- a/cypress/platform/theme-directives.html +++ b/cypress/platform/theme-directives.html @@ -121,7 +121,14 @@ fontFamily: '"arial", sans-serif', curve: 'cardinal', securityLevel: 'strict', + startOnLoad: false, }); + + await mermaid.run(); + + if (window.Cypress) { + window.rendered = true; + }