diff --git a/cypress/integration/rendering/flowchart-v2.spec.js b/cypress/integration/rendering/flowchart-v2.spec.js index d0b2323d2..acc42c68b 100644 --- a/cypress/integration/rendering/flowchart-v2.spec.js +++ b/cypress/integration/rendering/flowchart-v2.spec.js @@ -462,4 +462,140 @@ flowchart TD {htmlLabels: true, flowchart: {htmlLabels: true}, securityLevel: 'loose'} ); }); + it('66: More nested subgraph cases (TB)', () => { + imgSnapshotTest( + ` +flowchart TB + subgraph two + b1 + end + subgraph three + c2 + end + + three --> two + two --> c2 + + `, + {htmlLabels: true, flowchart: {htmlLabels: true}, securityLevel: 'loose'} + ); + }); + it('67: More nested subgraph cases (RL)', () => { + imgSnapshotTest( + ` +flowchart RL + subgraph two + b1 + end + subgraph three + c2 + end + + three --> two + two --> c2 + + `, + {htmlLabels: true, flowchart: {htmlLabels: true}, securityLevel: 'loose'} + ); + }); + it('68: More nested subgraph cases (BT)', () => { + imgSnapshotTest( + ` +flowchart BT + subgraph two + b1 + end + subgraph three + c2 + end + + three --> two + two --> c2 + + `, + {htmlLabels: true, flowchart: {htmlLabels: true}, securityLevel: 'loose'} + ); + }); + it('69: More nested subgraph cases (LR)', () => { + imgSnapshotTest( + ` +flowchart LR + subgraph two + b1 + end + subgraph three + c2 + end + + three --> two + two --> c2 + + `, + {htmlLabels: true, flowchart: {htmlLabels: true}, securityLevel: 'loose'} + ); + }); + it('70: Handle nested subgraph cases (TB) link out and link between subgraphs', () => { + imgSnapshotTest( + ` +flowchart TB + subgraph S1 + sub1 -->sub2 + end + subgraph S2 + sub4 + end + S1 --> S2 + sub1 --> sub4 + `, + {htmlLabels: true, flowchart: {htmlLabels: true}, securityLevel: 'loose'} + ); + }); + it('71: Handle nested subgraph cases (RL) link out and link between subgraphs', () => { + imgSnapshotTest( + ` +flowchart RL + subgraph S1 + sub1 -->sub2 + end + subgraph S2 + sub4 + end + S1 --> S2 + sub1 --> sub4 + `, + {htmlLabels: true, flowchart: {htmlLabels: true}, securityLevel: 'loose'} + ); + }); + it('72: Handle nested subgraph cases (BT) link out and link between subgraphs', () => { + imgSnapshotTest( + ` +flowchart BT + subgraph S1 + sub1 -->sub2 + end + subgraph S2 + sub4 + end + S1 --> S2 + sub1 --> sub4 + `, + {htmlLabels: true, flowchart: {htmlLabels: true}, securityLevel: 'loose'} + ); + }); + it('74: Handle nested subgraph cases (RL) link out and link between subgraphs', () => { + imgSnapshotTest( + ` +flowchart RL + subgraph S1 + sub1 -->sub2 + end + subgraph S2 + sub4 + end + S1 --> S2 + sub1 --> sub4 + `, + {htmlLabels: true, flowchart: {htmlLabels: true}, securityLevel: 'loose'} + ); + }); }); diff --git a/cypress/platform/knsv.html b/cypress/platform/knsv.html index 4e0261f3e..37272f297 100644 --- a/cypress/platform/knsv.html +++ b/cypress/platform/knsv.html @@ -57,7 +57,6 @@ flowchart TD
flowchart TB - subgraph two b1 end diff --git a/src/dagre-wrapper/edges.js b/src/dagre-wrapper/edges.js index 883586d57..f15574535 100644 --- a/src/dagre-wrapper/edges.js +++ b/src/dagre-wrapper/edges.js @@ -239,8 +239,8 @@ export const intersection = (node, outsidePoint, insidePoint) => { let q = insidePoint.y < outsidePoint.y ? outsidePoint.y - h - y : y - h - outsidePoint.y; r = (R * q) / Q; const res = { - x: insidePoint.x < outsidePoint.x ? insidePoint.x + R - r : insidePoint.x - R + r, - y: insidePoint.y < outsidePoint.y ? insidePoint.y + Q - q : insidePoint.y + Q - q + x: insidePoint.x < outsidePoint.x ? insidePoint.x + r : insidePoint.x - R + r, + y: insidePoint.y < outsidePoint.y ? insidePoint.y + Q - q : insidePoint.y - Q + q }; if (r === 0) { diff --git a/src/dagre-wrapper/edges.spec.js b/src/dagre-wrapper/edges.spec.js index 7eac88739..98d1d9370 100644 --- a/src/dagre-wrapper/edges.spec.js +++ b/src/dagre-wrapper/edges.spec.js @@ -32,33 +32,33 @@ describe('Graphlib decorations', () => { }); it('case 3 - intersection on otop of box outside point greater then inside point', function () { - const o = {x: 157.21875, y: 38.83361558001693}; - const i = {x: 104.1328125, y: 105}; + const o = {x: 157, y: 39}; + const i = {x: 104, y: 105}; const node2 = { - width: 211.96875, - x: 113.984375, - y: 164.25, - height: 176.5 + width: 212, + x: 114, + y: 164, + height: 176 } const int = intersection(node2, o, i); - expect(int.x).toBeCloseTo(127.39979619565217) - // expect(int.y).toBeCloseTo(76) - expect(int.y).toBeCloseTo(67.833) + expect(int.x).toBeCloseTo(133.71) + expect(int.y).toBeCloseTo(76) + // expect(int.y).toBeCloseTo(67.833) }); it('case 4 - intersection on top of box inside point greater then inside point', function () { - const o = {x: 144.65625, y: 38.83361558001693}; - const i = {x: 197.7421875, y: 105}; + const o = {x: 144, y: 38}; + const i = {x: 198, y: 105}; const node2 = { - width: 211.96875, - x: 113.984375, - y: 164.25, - height: 176.5 + width: 212, + x: 114, + y: 164, + height: 176 } const int = intersection(node2, o, i); - expect(int.x).toBeCloseTo(167.9232336956522) - // expect(int.y).toBeCloseTo(76) - expect(int.y).toBeCloseTo(67.833) + expect(int.x).toBeCloseTo(174.626 ) + expect(int.y).toBeCloseTo(76) + // expect(int.y).toBeCloseTo(67.833) }); });