Merge pull request #18 from Mermaid-Chart/MC-2265/fix-failing-e2e-shapes-test

MC-2265: Fix all failing E2E tests in Mermaid Alana
This commit is contained in:
Ashish Jain
2024-11-08 15:28:03 +01:00
committed by GitHub
5 changed files with 57 additions and 17 deletions

View File

@@ -0,0 +1,5 @@
---
'mermaid': patch
---
fix: Intersection calculations for tilted cylinder/DAS when using handdrawn look. Some random seeds could cause the calculations to break.

View File

@@ -460,7 +460,7 @@ stateDiagram-v2
[*] --> State1
State1 --> [*]
`,
{ state: { useMaxWidth: true } }
{ state: { useMaxWidth: true }, look: 'classic' }
);
cy.get('svg').should((svg) => {
expect(svg).to.have.attr('width', '100%');
@@ -482,7 +482,7 @@ stateDiagram-v2
[*] --> State1
State1 --> [*]
`,
{ state: { useMaxWidth: false } }
{ state: { useMaxWidth: false }, look: 'classic' }
);
cy.get('svg').should((svg) => {
// const height = parseFloat(svg.attr('height'));

View File

@@ -338,7 +338,7 @@ describe('State diagram', () => {
[*] --> State1
State1 --> [*]
`,
{ state: { useMaxWidth: true } }
{ state: { useMaxWidth: true }, look: 'classic', theme: 'default' }
);
cy.get('svg').should((svg) => {
expect(svg).to.have.attr('width', '100%');
@@ -361,7 +361,7 @@ describe('State diagram', () => {
[*] --> State1
State1 --> [*]
`,
{ state: { useMaxWidth: false } }
{ state: { useMaxWidth: false }, look: 'classic', theme: 'default' }
);
cy.get('svg').should((svg) => {
// const height = parseFloat(svg.attr('height'));

View File

@@ -91,70 +91,105 @@
<body>
<pre id="diagram4" class="mermaid">
---
config:
look: handDrawn
theme: default
---
flowchart LR
n00@{ shape: triangle, label: 'This is a label for triangle shape' }
n11@{ shape: sloped-rectangle, label: 'This is a label for sloped-rectangle shape' }
n22@{ shape: horizontal-cylinder, label: 'This is a label for horizontal-cylinder shape' }
n33@{ shape: flipped-triangle, label: 'This is a label for flipped-triangle shape' }
n44@{ shape: hourglass, label: 'This is a label for hourglass shape' }
n00 --> n11
n00 --> n22
n00 --> n33
n00 --> n44
n11 --> n22
n11 --> n33
n11 --> n44
n22 --> n33
n22 --> n44
n33 --> n44
</pre>
<pre id="diagram4" class="mermaid">
---
config:
look: handDrawn
theme: default
---
flowchart LR
n22@{ shape: h-cyl }
n00 --> n11
n00 --> n22
n11 --> n22
</pre>
<pre id="diagram4" class="mermaid2">
flowchart LR
nA[Default] --> A@{ icon: 'fa:bell', form: 'rounded' }
</pre>
<pre id="diagram4" class="mermaid">
<pre id="diagram4" class="mermaid2">
flowchart LR
nA[Style] --> A@{ icon: 'fa:bell', form: 'rounded' }
style A fill:#f9f,stroke:#333,stroke-width:4px
</pre>
<pre id="diagram4" class="mermaid">
<pre id="diagram4" class="mermaid2">
flowchart LR
nA[Class] --> A@{ icon: 'fa:bell', form: 'rounded' }
A:::AClass
classDef AClass fill:#f9f,stroke:#333,stroke-width:4px
</pre>
<pre id="diagram4" class="mermaid">
<pre id="diagram4" class="mermaid2">
flowchart LR
nA[Class] --> A@{ icon: 'logos:aws', form: 'rounded' }
</pre>
<pre id="diagram4" class="mermaid">
<pre id="diagram4" class="mermaid2">
flowchart LR
nA[Default] --> A@{ icon: 'fa:bell', form: 'square' }
</pre>
<pre id="diagram4" class="mermaid">
<pre id="diagram4" class="mermaid2">
flowchart LR
nA[Style] --> A@{ icon: 'fa:bell', form: 'square' }
style A fill:#f9f,stroke:#333,stroke-width:4px
</pre>
<pre id="diagram4" class="mermaid">
<pre id="diagram4" class="mermaid2">
flowchart LR
nA[Class] --> A@{ icon: 'fa:bell', form: 'square' }
A:::AClass
classDef AClass fill:#f9f,stroke:#333,stroke-width:4px
</pre>
<pre id="diagram4" class="mermaid">
<pre id="diagram4" class="mermaid2">
flowchart LR
nA[Class] --> A@{ icon: 'logos:aws', form: 'square' }
</pre>
<pre id="diagram4" class="mermaid">
<pre id="diagram4" class="mermaid2">
flowchart LR
nA[Default] --> A@{ icon: 'fa:bell', form: 'circle' }
</pre>
<pre id="diagram4" class="mermaid">
<pre id="diagram4" class="mermaid2">
flowchart LR
nA[Style] --> A@{ icon: 'fa:bell', form: 'circle' }
style A fill:#f9f,stroke:#333,stroke-width:4px
</pre>
<pre id="diagram4" class="mermaid">
<pre id="diagram4" class="mermaid2">
flowchart LR
nA[Class] --> A@{ icon: 'fa:bell', form: 'circle' }
A:::AClass
classDef AClass fill:#f9f,stroke:#333,stroke-width:4px
</pre>
<pre id="diagram4" class="mermaid">
<pre id="diagram4" class="mermaid2">
flowchart LR
nA[Class] --> A@{ icon: 'logos:aws', form: 'circle' }
A:::AClass
classDef AClass fill:#f9f,stroke:#333,stroke-width:4px
</pre>
<pre id="diagram4" class="mermaid">
<pre id="diagram4" class="mermaid2">
flowchart LR
nA[Style] --> A@{ icon: 'logos:aws', form: 'circle' }
style A fill:#f9f,stroke:#333,stroke-width:4px

View File

@@ -141,7 +141,7 @@ export async function tiltedCylinder<T extends SVGGraphicsElement>(
) {
let x = rx * rx * (1 - (y * y) / (ry * ry));
if (x != 0) {
x = Math.sqrt(x);
x = Math.sqrt(Math.abs(x));
}
x = rx - x;
if (point.x - (node.x ?? 0) > 0) {