From 958204e8310f2fff1a9cf82491a04e1f8001bafb Mon Sep 17 00:00:00 2001 From: Knut Sveidqvist Date: Fri, 19 Jul 2024 18:20:39 +0200 Subject: [PATCH] Using the shape data --- .../flowchart/parser/flow-node-data.spec.js | 34 ++++++++++++++++--- .../src/diagrams/flowchart/parser/flow.jison | 19 +++++------ 2 files changed, 37 insertions(+), 16 deletions(-) diff --git a/packages/mermaid/src/diagrams/flowchart/parser/flow-node-data.spec.js b/packages/mermaid/src/diagrams/flowchart/parser/flow-node-data.spec.js index 7e44cad32..d56f56bbb 100644 --- a/packages/mermaid/src/diagrams/flowchart/parser/flow-node-data.spec.js +++ b/packages/mermaid/src/diagrams/flowchart/parser/flow-node-data.spec.js @@ -20,6 +20,8 @@ describe('when parsing directions', function () { const data4Layout = flow.parser.yy.getData(); console.log(data4Layout.nodes); expect(data4Layout.nodes.length).toBe(1); + expect(data4Layout.nodes[0].shape).toEqual('rounded'); + expect(data4Layout.nodes[0].label).toEqual('D'); }); it('should be possible to link to a node with more data', function () { const res = flow.parser.parse(`flowchart TB @@ -31,10 +33,16 @@ describe('when parsing directions', function () { `); const data4Layout = flow.parser.yy.getData(); - console.log(data4Layout.nodes); + console.log(data4Layout.edges); expect(data4Layout.nodes.length).toBe(2); + expect(data4Layout.nodes[0].shape).toEqual('squareRect'); + expect(data4Layout.nodes[0].label).toEqual('A'); + expect(data4Layout.nodes[1].label).toEqual('D'); + expect(data4Layout.nodes[1].shape).toEqual('circle'); + + expect(data4Layout.edges.length).toBe(1); }); - it('should use default direction from top level', function () { + it('should not disturb adding multiple nodes after each other', function () { const res = flow.parser.parse(`flowchart TB A[hello] B@{ @@ -45,14 +53,18 @@ describe('when parsing directions', function () { shape: circle, icon: "clock" }@ - `); const data4Layout = flow.parser.yy.getData(); - console.log(data4Layout.nodes); expect(data4Layout.nodes.length).toBe(3); + expect(data4Layout.nodes[0].shape).toEqual('squareRect'); + expect(data4Layout.nodes[0].label).toEqual('hello'); + expect(data4Layout.nodes[1].shape).toEqual('circle'); + expect(data4Layout.nodes[1].label).toEqual('B'); + expect(data4Layout.nodes[2].shape).toEqual('circle'); + expect(data4Layout.nodes[2].label).toEqual('Hello'); }); - it('should use handle } character inside the shape data', function () { + it('should use handle bracket end (}) character inside the shape data', function () { const res = flow.parser.parse(`flowchart TB A@{ label: "This is }", @@ -60,8 +72,20 @@ describe('when parsing directions', function () { }@ `); + const data4Layout = flow.parser.yy.getData(); + expect(data4Layout.nodes.length).toBe(1); + expect(data4Layout.nodes[0].shape).toEqual('squareRect'); + expect(data4Layout.nodes[0].label).toEqual('This is }'); + }); + it('Diamond shapes should work as usual', function () { + const res = flow.parser.parse(`flowchart TB + A{This is a label} +`); + const data4Layout = flow.parser.yy.getData(); console.log(data4Layout.nodes); expect(data4Layout.nodes.length).toBe(1); + expect(data4Layout.nodes[0].shape).toEqual('diamond'); + expect(data4Layout.nodes[0].label).toEqual('This is a label'); }); }); diff --git a/packages/mermaid/src/diagrams/flowchart/parser/flow.jison b/packages/mermaid/src/diagrams/flowchart/parser/flow.jison index ff898e258..eb5dc75d0 100644 --- a/packages/mermaid/src/diagrams/flowchart/parser/flow.jison +++ b/packages/mermaid/src/diagrams/flowchart/parser/flow.jison @@ -36,8 +36,7 @@ accDescr\s*"{"\s* { this.begin("acc_descr_multilin [^\}]* return "acc_descr_multiline_value"; // .*[^\n]* { return "acc_descr_line"} -[@\{] { this.pushState("shapeData"); } -// [\}][\@] { console.log('This is the end: ', yytext); this.popState(); } +\@\{ { console.log('Pushing state shapeData!'); this.pushState("shapeData"); } [^}] { console.log('End bracket found: ', yytext); this.pushState("shapeDataEndBracket");} [@] { console.log('This is the end: ', yytext); this.popState();this.popState(); } [^@]* { console.log('something else: ', yytext); return 'SHAPE_DATA'; } @@ -372,18 +371,18 @@ separator: NEWLINE | SEMI | EOF ; vertexStatement: vertexStatement link node SHAPE_DATA - { console.warn('vs SHAPE_DATA',$vertexStatement.stmt,$node); yy.addLink($vertexStatement.stmt,$node,$link); $$ = { stmt: $node, nodes: $node.concat($vertexStatement.nodes) } } + { /* console.warn('vs SHAPE_DATA',$vertexStatement.stmt,$node, $SHAPE_DATA);*/ yy.addVertex($node[0],undefined,undefined,undefined, undefined,undefined, undefined,$SHAPE_DATA); yy.addLink($vertexStatement.stmt,$node,$link); $$ = { stmt: $node, nodes: $node.concat($vertexStatement.nodes) } } | vertexStatement link node - { console.warn('vs',$vertexStatement.stmt,$node); yy.addLink($vertexStatement.stmt,$node,$link); $$ = { stmt: $node, nodes: $node.concat($vertexStatement.nodes) } } + { /*console.warn('vs',$vertexStatement.stmt,$node);*/ yy.addLink($vertexStatement.stmt,$node,$link); $$ = { stmt: $node, nodes: $node.concat($vertexStatement.nodes) } } | vertexStatement link node spaceList { /* console.warn('vs',$vertexStatement.stmt,$node); */ yy.addLink($vertexStatement.stmt,$node,$link); $$ = { stmt: $node, nodes: $node.concat($vertexStatement.nodes) } } - |node spaceList {console.warn('vertexStatement: node spaceList', $node); $$ = {stmt: $node, nodes:$node }} + |node spaceList { /*console.warn('vertexStatement: node spaceList', $node);*/ $$ = {stmt: $node, nodes:$node }} |node SHAPE_DATA { - console.warn('vertexStatement: node SHAPE_DATA', $node[0], $SHAPE_DATA); - yy.addVertex($node[0],undefined,undefined,undefined, undefined,undefined, undefined,$SHAPE_DATA+'\n}\n'); - $$ = {stmt: $node, nodes:$node, shapeData: $SHAPE_DATA+'\n}'} + /*console.warn('vertexStatement: node SHAPE_DATA', $node[0], $SHAPE_DATA);*/ + yy.addVertex($node[0],undefined,undefined,undefined, undefined,undefined, undefined,$SHAPE_DATA); + $$ = {stmt: $node, nodes:$node, shapeData: $SHAPE_DATA} } - |node { console.warn('vertexStatement: single node', $node); $$ = {stmt: $node, nodes:$node }} + |node { /* console.warn('vertexStatement: single node', $node); */ $$ = {stmt: $node, nodes:$node }} ; node: styledVertex @@ -396,8 +395,6 @@ styledVertex: vertex { /* console.warn('nodc', $vertex);*/ $$ = $vertex;} | vertex STYLE_SEPARATOR idString {$$ = $vertex;yy.setClass($vertex,$idString)} - | vertex idString - { yy.setClass($vertex,$idString)} ; vertex: idString SQS text SQE