marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-09-18 06:49:47 +02:00
Code Issues Packages Projects Releases Wiki Activity

#2032 Adding new statement to add choice shape in state diagrams

Browse Source
This commit is contained in:
Knut Sveidqvist
2021-05-01 18:09:42 +02:00
parent b20f8668be
commit 6dc71122b8
11 changed files with 353 additions and 189 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
cypress/integration/rendering/stateDiagram-v2.spec.js
View File

@@ -329,6 +329,24 @@ describe('State diagram', () => {
}
);
});
it('v2 it should be possibel to use a choice', () => {
imgSnapshotTest(
`
stateDiagram-v2
[*] --> Off
Off --> On
state MyChoice [[choice]]
On --> MyChoice
MyChoice --> Washing
MyChoice --> Drying
Washing --> Finished
Finished --> [*]
`,
{
logLevel: 0,
}
);
});
it('v2 Simplest composite state', () => {
imgSnapshotTest(
`

45
cypress/platform/knsv.html
View File

@@ -56,51 +56,16 @@ flowchart TD
linkStyle 0,1 color:orange, stroke: orange;
</div>
<div class="mermaid" style="width: 100%; height: 20%;">
%% The width of composite states does not grow with the title
stateDiagram-v2
[*] --> Off
Off --> On
On --> Select
Select --> Washing
state MyChoice [[choice]]
On --> MyChoice
MyChoice --> Washing
MyChoice --> Drying
Washing --> Finished
Finished --> [*]
state Select
{
[*] --> Prg1
Prg1 --> [*]
[*] --> Prg2
Prg2 --> [*]
[*] --> Prg3
Prg3 --> [*]
}
state Washing {
state Using_Prg1 {
[*] --> P1Step1
P1Step1 --> P1Step2
P1Step2 --> P1Step3
P1Step3 --> [*]
}
state Using_Prg2 {
[*] --> P2Step1
P2Step1 --> P2Step2
P2Step2 --> P2Step3
P2Step3 --> [*]
}
state Using_Prg3 {
[*] --> Step1
Step1 --> Step2
Step2 --> [*]
}
[*] --> Using_Prg1
[*] --> Using_Prg2
[*] --> Using_Prg3
Using_Prg1 --> [*]
Using_Prg2 --> [*]
Using_Prg3 --> [*]
}
</div>
<div class="mermaid2" style="width: 100%; height: 20%;">
stateDiagram-v2