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 <sidharthv96@gmail.com>
This commit is contained in:
Alois Klink
2023-09-16 00:26:24 +01:00
parent 518e277cb2
commit 17f5052a6f
2 changed files with 9 additions and 3 deletions

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

View File

@@ -121,7 +121,14 @@
fontFamily: '"arial", sans-serif', fontFamily: '"arial", sans-serif',
curve: 'cardinal', curve: 'cardinal',
securityLevel: 'strict', securityLevel: 'strict',
startOnLoad: false,
}); });
await mermaid.run();
if (window.Cypress) {
window.rendered = true;
}
</script> </script>
</body> </body>
</html> </html>