diff --git a/packages/mermaid/src/diagrams/class/classDiagram.spec.ts b/packages/mermaid/src/diagrams/class/classDiagram.spec.ts index 2182e8c34..7816345c8 100644 --- a/packages/mermaid/src/diagrams/class/classDiagram.spec.ts +++ b/packages/mermaid/src/diagrams/class/classDiagram.spec.ts @@ -264,6 +264,113 @@ class C13["With Città foreign language"] const str = 'classDiagram\n' + 'note "test"\n'; parser.parse(str); }); + + const keywords = [ + 'direction', + 'classDiagram', + 'classDiagram-v2', + 'namespace', + '{}', + '{', + '}', + '()', + '(', + ')', + '[]', + '[', + ']', + 'class', + '\n', + 'cssClass', + 'callback', + 'link', + 'click', + 'note', + 'note for', + '<<', + '>>', + 'call ', + '~', + '~Generic~', + '_self', + '_blank', + '_parent', + '_top', + '<|', + '|>', + '>', + '<', + '*', + 'o', + '\\', + '--', + '..', + '-->', + '--|>', + ': label', + ':::', + '.', + '+', + 'alphaNum', + '!', + '0123', + 'function()', + 'function(arg1, arg2)', + ]; + + it.each(keywords)('should handle a note with %s in it', function (keyword: string) { + const str = `classDiagram + note "This is a keyword: ${keyword}. It truly is." + `; + parser.parse(str); + expect(classDb.getNotes()[0].text).toEqual(`This is a keyword: ${keyword}. It truly is.`); + }); + + it.each(keywords)( + 'should handle note with %s at beginning of string', + function (keyword: string) { + const str = `classDiagram + note "${keyword}"`; + + parser.parse(str); + expect(classDb.getNotes()[0].text).toEqual(`${keyword}`); + } + ); + + it.each(keywords)('should handle a "note for" with a %s in it', function (keyword: string) { + const str = `classDiagram + class Something { + int id + string name + } + note for Something "This is a keyword: ${keyword}. It truly is." + `; + + parser.parse(str); + expect(classDb.getNotes()[0].text).toEqual(`This is a keyword: ${keyword}. It truly is.`); + }); + + it.each(keywords)( + 'should handle a "note for" with a %s at beginning of string', + function (keyword: string) { + const str = `classDiagram + class Something { + int id + string name + } + note for Something "${keyword}" + `; + + parser.parse(str); + expect(classDb.getNotes()[0].text).toEqual(`${keyword}`); + } + ); + + it.each(keywords)('should elicit error for %s after NOTE token', function (keyword: string) { + const str = `classDiagram + note ${keyword}`; + expect(() => parser.parse(str)).toThrowError(/(Expecting\s'STR'|Unrecognized\stext)/); + }); }); describe('when parsing class defined in brackets', function () { diff --git a/packages/mermaid/src/diagrams/class/parser/classDiagram.jison b/packages/mermaid/src/diagrams/class/parser/classDiagram.jison index 7788fcc0c..8fdfced75 100644 --- a/packages/mermaid/src/diagrams/class/parser/classDiagram.jison +++ b/packages/mermaid/src/diagrams/class/parser/classDiagram.jison @@ -24,31 +24,50 @@ %x namespace %x namespace-body %% -\%\%\{ { this.begin('open_directive'); return 'open_directive'; } -.*direction\s+TB[^\n]* return 'direction_tb'; -.*direction\s+BT[^\n]* return 'direction_bt'; -.*direction\s+RL[^\n]* return 'direction_rl'; -.*direction\s+LR[^\n]* return 'direction_lr'; -((?:(?!\}\%\%)[^:.])*) { this.begin('type_directive'); return 'type_directive'; } -":" { this.popState(); this.begin('arg_directive'); return ':'; } -\}\%\% { this.popState(); this.popState(); return 'close_directive'; } -((?:(?!\}\%\%).|\n)*) return 'arg_directive'; -\%\%(?!\{)*[^\n]*(\r?\n?)+ /* skip comments */ -\%\%[^\n]*(\r?\n)* /* skip comments */ -accTitle\s*":"\s* { this.begin("acc_title");return 'acc_title'; } -(?!\n|;|#)*[^\n]* { this.popState(); return "acc_title_value"; } -accDescr\s*":"\s* { this.begin("acc_descr");return 'acc_descr'; } -(?!\n|;|#)*[^\n]* { this.popState(); return "acc_descr_value"; } -accDescr\s*"{"\s* { this.begin("acc_descr_multiline");} -[\}] { this.popState(); } -[^\}]* return "acc_descr_multiline_value"; +\%\%\{ { this.begin('open_directive'); return 'open_directive'; } +.*direction\s+TB[^\n]* return 'direction_tb'; +.*direction\s+BT[^\n]* return 'direction_bt'; +.*direction\s+RL[^\n]* return 'direction_rl'; +.*direction\s+LR[^\n]* return 'direction_lr'; +((?:(?!\}\%\%)[^:.])*) { this.begin('type_directive'); return 'type_directive'; } +":" { this.popState(); this.begin('arg_directive'); return ':'; } +\}\%\% { this.popState(); this.popState(); return 'close_directive'; } +((?:(?!\}\%\%).|\n)*) return 'arg_directive'; +\%\%(?!\{)*[^\n]*(\r?\n?)+ /* skip comments */ +\%\%[^\n]*(\r?\n)* /* skip comments */ +accTitle\s*":"\s* { this.begin("acc_title");return 'acc_title'; } +(?!\n|;|#)*[^\n]* { this.popState(); return "acc_title_value"; } +accDescr\s*":"\s* { this.begin("acc_descr");return 'acc_descr'; } +(?!\n|;|#)*[^\n]* { this.popState(); return "acc_descr_value"; } +accDescr\s*"{"\s* { this.begin("acc_descr_multiline");} +[\}] { this.popState(); } +[^\}]* return "acc_descr_multiline_value"; -\s*(\r?\n)+ return 'NEWLINE'; -\s+ /* skip whitespace */ +\s*(\r?\n)+ return 'NEWLINE'; +\s+ /* skip whitespace */ -"classDiagram-v2" return 'CLASS_DIAGRAM'; -"classDiagram" return 'CLASS_DIAGRAM'; -"[*]" return 'EDGE_STATE'; +"classDiagram-v2" return 'CLASS_DIAGRAM'; +"classDiagram" return 'CLASS_DIAGRAM'; +"[*]" return 'EDGE_STATE'; + +/* +---interactivity command--- +'call' adds a callback to the specified node. 'call' can only be specified when +the line was introduced with 'click'. +'call ()' attaches the function 'callback_name' with the specified +arguments to the node that was specified by 'click'. +Function arguments are optional: 'call ()' simply executes 'callback_name' without any arguments. +*/ +"call"[\s]+ this.begin("callback_name"); +\([\s]*\) this.popState(); +\( this.popState(); this.begin("callback_args"); +[^(]* return 'CALLBACK_NAME'; +\) this.popState(); +[^)]* return 'CALLBACK_ARGS'; + +["] this.popState(); +[^"]* return "STR"; +<*>["] this.begin("string"); "namespace" { this.begin('namespace'); return 'NAMESPACE'; } \s*(\r?\n)+ { this.popState(); return 'NEWLINE'; } @@ -60,26 +79,26 @@ accDescr\s*"{"\s* { this.begin("acc_descr_multili \s+ /* skip whitespace */ "[*]" return 'EDGE_STATE'; -"class" { this.begin('class'); return 'CLASS';} -\s*(\r?\n)+ { this.popState(); return 'NEWLINE'; } -\s+ /* skip whitespace */ -[}] { this.popState(); this.popState(); return 'STRUCT_STOP';} -[{] { this.begin("class-body"); return 'STRUCT_START';} -[}] { this.popState(); return 'STRUCT_STOP'; } -<> return "EOF_IN_STRUCT"; -"[*]" { return 'EDGE_STATE';} -[{] return "OPEN_IN_STRUCT"; -[\n] /* nothing */ -[^{}\n]* { return "MEMBER";} +"class" { this.begin('class'); return 'CLASS';} +\s*(\r?\n)+ { this.popState(); return 'NEWLINE'; } +\s+ /* skip whitespace */ +[}] { this.popState(); this.popState(); return 'STRUCT_STOP';} +[{] { this.begin("class-body"); return 'STRUCT_START';} +[}] { this.popState(); return 'STRUCT_STOP'; } +<> return "EOF_IN_STRUCT"; +"[*]" { return 'EDGE_STATE';} +[{] return "OPEN_IN_STRUCT"; +[\n] /* nothing */ +[^{}\n]* { return "MEMBER";} -<*>"cssClass" return 'CSSCLASS'; -<*>"callback" return 'CALLBACK'; -<*>"link" return 'LINK'; -<*>"click" return 'CLICK'; -<*>"note for" return 'NOTE_FOR'; -<*>"note" return 'NOTE'; -<*>"<<" return 'ANNOTATION_START'; -<*>">>" return 'ANNOTATION_END'; +<*>"cssClass" return 'CSSCLASS'; +<*>"callback" return 'CALLBACK'; +<*>"link" return 'LINK'; +<*>"click" return 'CLICK'; +<*>"note for" return 'NOTE_FOR'; +<*>"note" return 'NOTE'; +<*>"<<" return 'ANNOTATION_START'; +<*>">>" return 'ANNOTATION_END'; /* ---interactivity command--- @@ -87,64 +106,43 @@ accDescr\s*"{"\s* { this.begin("acc_descr_multili line was introduced with 'click'. 'href ""' attaches the specified link to the node that was specified by 'click'. */ -<*>"href"[\s]+["] this.begin("href"); -["] this.popState(); -[^"]* return 'HREF'; +<*>"href" return 'HREF'; -/* ----interactivity command--- -'call' adds a callback to the specified node. 'call' can only be specified when -the line was introduced with 'click'. -'call ()' attaches the function 'callback_name' with the specified -arguments to the node that was specified by 'click'. -Function arguments are optional: 'call ()' simply executes 'callback_name' without any arguments. -*/ -<*>"call"[\s]+ this.begin("callback_name"); -\([\s]*\) this.popState(); -\( this.popState(); this.begin("callback_args"); -[^(]* return 'CALLBACK_NAME'; -\) this.popState(); -[^)]* return 'CALLBACK_ARGS'; +[~] this.popState(); +[^~]* return "GENERICTYPE"; +<*>"~" this.begin("generic"); -[~] this.popState(); -[^~]* return "GENERICTYPE"; -<*>[~] this.begin("generic"); +[`] this.popState(); +[^`]+ return "BQUOTE_STR"; +<*>[`] this.begin("bqstring"); -["] this.popState(); -[^"]* return "STR"; -<*>["] this.begin("string"); +<*>"_self" return 'LINK_TARGET'; +<*>"_blank" return 'LINK_TARGET'; +<*>"_parent" return 'LINK_TARGET'; +<*>"_top" return 'LINK_TARGET'; -[`] this.popState(); -[^`]+ return "BQUOTE_STR"; -<*>[`] this.begin("bqstring"); - -<*>"_self" return 'LINK_TARGET'; -<*>"_blank" return 'LINK_TARGET'; -<*>"_parent" return 'LINK_TARGET'; -<*>"_top" return 'LINK_TARGET'; - -<*>\s*\<\| return 'EXTENSION'; -<*>\s*\|\> return 'EXTENSION'; -<*>\s*\> return 'DEPENDENCY'; -<*>\s*\< return 'DEPENDENCY'; -<*>\s*\* return 'COMPOSITION'; -<*>\s*o return 'AGGREGATION'; -<*>\s*\(\) return 'LOLLIPOP'; -<*>\-\- return 'LINE'; -<*>\.\. return 'DOTTED_LINE'; -<*>":"{1}[^:\n;]+ return 'LABEL'; -<*>":"{3} return 'STYLE_SEPARATOR'; -<*>\- return 'MINUS'; -<*>"." return 'DOT'; -<*>\+ return 'PLUS'; -<*>\% return 'PCT'; -<*>"=" return 'EQUALS'; -<*>\= return 'EQUALS'; -<*>\w+ return 'ALPHA'; -<*>"[" return 'SQS'; -<*>"]" return 'SQE'; -<*>[!"#$%&'*+,-.`?\\/] return 'PUNCTUATION'; -<*>[0-9]+ return 'NUM'; +<*>\s*\<\| return 'EXTENSION'; +<*>\s*\|\> return 'EXTENSION'; +<*>\s*\> return 'DEPENDENCY'; +<*>\s*\< return 'DEPENDENCY'; +<*>\s*\* return 'COMPOSITION'; +<*>\s*o return 'AGGREGATION'; +<*>\s*\(\) return 'LOLLIPOP'; +<*>\-\- return 'LINE'; +<*>\.\. return 'DOTTED_LINE'; +<*>":"{1}[^:\n;]+ return 'LABEL'; +<*>":"{3} return 'STYLE_SEPARATOR'; +<*>\- return 'MINUS'; +<*>"." return 'DOT'; +<*>\+ return 'PLUS'; +<*>\% return 'PCT'; +<*>"=" return 'EQUALS'; +<*>\= return 'EQUALS'; +<*>\w+ return 'ALPHA'; +<*>"[" return 'SQS'; +<*>"]" return 'SQE'; +<*>[!"#$%&'*+,-.`?\\/] return 'PUNCTUATION'; +<*>[0-9]+ return 'NUM'; <*>[\u00AA\u00B5\u00BA\u00C0-\u00D6\u00D8-\u00F6]| [\u00F8-\u02C1\u02C6-\u02D1\u02E0-\u02E4\u02EC\u02EE\u0370-\u0374\u0376\u0377]| [\u037A-\u037D\u0386\u0388-\u038A\u038C\u038E-\u03A1\u03A3-\u03F5]| @@ -206,9 +204,9 @@ Function arguments are optional: 'call ()' simply executes 'callb [\uFD50-\uFD8F\uFD92-\uFDC7\uFDF0-\uFDFB\uFE70-\uFE74\uFE76-\uFEFC]| [\uFF21-\uFF3A\uFF41-\uFF5A\uFF66-\uFFBE\uFFC2-\uFFC7\uFFCA-\uFFCF]| [\uFFD2-\uFFD7\uFFDA-\uFFDC] - return 'UNICODE_TEXT'; -<*>\s return 'SPACE'; -<*><> return 'EOF'; + return 'UNICODE_TEXT'; +<*>\s return 'SPACE'; +<*><> return 'EOF'; /lex @@ -321,7 +319,7 @@ classStatements ; classStatement - : classIdentifier + : classIdentifier | classIdentifier STYLE_SEPARATOR alphaNumToken {yy.setCssClass($1, $3);} | classIdentifier STRUCT_START members STRUCT_STOP {yy.addMembers($1,$3);} | classIdentifier STYLE_SEPARATOR alphaNumToken STRUCT_START members STRUCT_STOP {yy.setCssClass($1, $3);yy.addMembers($1,$5);} @@ -391,10 +389,10 @@ clickStatement | CLICK className CALLBACK_NAME STR {$$ = $1;yy.setClickEvent($2, $3);yy.setTooltip($2, $4);} | CLICK className CALLBACK_NAME CALLBACK_ARGS {$$ = $1;yy.setClickEvent($2, $3, $4);} | CLICK className CALLBACK_NAME CALLBACK_ARGS STR {$$ = $1;yy.setClickEvent($2, $3, $4);yy.setTooltip($2, $5);} - | CLICK className HREF {$$ = $1;yy.setLink($2, $3);} - | CLICK className HREF LINK_TARGET {$$ = $1;yy.setLink($2, $3, $4);} - | CLICK className HREF STR {$$ = $1;yy.setLink($2, $3);yy.setTooltip($2, $4);} - | CLICK className HREF STR LINK_TARGET {$$ = $1;yy.setLink($2, $3, $5);yy.setTooltip($2, $4);} + | CLICK className HREF STR {$$ = $1;yy.setLink($2, $4);} + | CLICK className HREF STR LINK_TARGET {$$ = $1;yy.setLink($2, $4, $5);} + | CLICK className HREF STR STR {$$ = $1;yy.setLink($2, $4);yy.setTooltip($2, $5);} + | CLICK className HREF STR STR LINK_TARGET {$$ = $1;yy.setLink($2, $4, $6);yy.setTooltip($2, $5);} ; cssClassStatement diff --git a/packages/mermaid/src/diagrams/state/stateRenderer.js b/packages/mermaid/src/diagrams/state/stateRenderer.js index 689d7a0e5..1b3e0f27e 100644 --- a/packages/mermaid/src/diagrams/state/stateRenderer.js +++ b/packages/mermaid/src/diagrams/state/stateRenderer.js @@ -63,20 +63,6 @@ export const draw = function (text, id, _version, diagObj) { const diagram = root.select(`[id='${id}']`); insertMarkers(diagram); - // Layout graph, Create a new directed graph - const graph = new graphlib.Graph({ - multigraph: true, - compound: true, - // acyclicer: 'greedy', - rankdir: 'RL', - // ranksep: '20' - }); - - // Default to assigning a new object as a label for each new edge. - graph.setDefaultEdgeLabel(function () { - return {}; - }); - const rootDoc = diagObj.db.getRootDoc(); renderDoc(rootDoc, diagram, undefined, false, root, doc, diagObj);