diff --git a/cypress/platform/knsv.html b/cypress/platform/knsv.html index 90b0553a8a..053a4142e2 100644 --- a/cypress/platform/knsv.html +++ b/cypress/platform/knsv.html @@ -30,7 +30,54 @@ -
+
+ journey + title Adding journey diagram functionality to mermaid + accTitle: Adding acc journey diagram functionality to mermaid + accDescr { + My multi-line description + of the diagram + } + section Order from website +
+
+ pie + accTitle: My Pie Chart Accessibility Title + accDescr: My Pie Chart Accessibility Description + + title Key elements in Product X + "Calcium" : 42.96 + "Potassium" : 50.05 + "Magnesium" : 10.01 + "Iron" : 5 +
+
+ gitGraph + accTitle: My Gitgraph Accessibility Title + accDescr: My Gitgraph Accessibility Description + + commit + commit + branch develop + checkout develop + commit + commit + checkout main + merge develop + commit + commit +
+
+ sequenceDiagram + title: My Sequence Diagram Title + accTitle: My Acc Sequence Diagram + accDescr: My Sequence Diagram Description + + Alice->>John: Hello John, how are you? + John-->>Alice: Great! + Alice-)John: See you later! +
+
graph TD A -->|000| B B -->|111| C @@ -38,18 +85,23 @@ linkStyle 1 stroke:#ff3,stroke-width:4px,color:red;
-journey - title My working day - section Go to work - Make tea: 5: Me - Go upstairs: 3: Me - Do work: 1: Me, Cat - section Go home - Go downstairs: 5: Me - Sit down: 5: Me + journey + accTitle: My User Journey Diagram + accDescr: My User Journey Diagram Description + + title My working day + section Go to work + Make tea: 5: Me + Go upstairs: 3: Me + Do work: 1: Me, Cat + section Go home + Go downstairs: 5: Me + Sit down: 5: Me
requirementDiagram + accTitle: My req Diagram + accDescr: My req Diagram Description requirement test_req { id: 1 @@ -89,6 +141,8 @@
erDiagram + accTitle: My er Diagram + accDescr: My er Diagram Description CUSTOMER }|..|{ DELIVERY-ADDRESS : has CUSTOMER ||--o{ ORDER : places CUSTOMER ||--o{ INVOICE : "liable for" @@ -100,12 +154,16 @@
graph TB + accTitle: My flowchart + accDescr: My flowchart Description subgraph One a1-->a2-->a3 end
gantt + accTitle: My gantt chart + accDescr: My my gantt chart Description dateFormat YYYY-MM-DD axisFormat %d/%m title Adding GANTT diagram to mermaid @@ -146,6 +204,8 @@
classDiagram +accTitle: My class diagram +accDescr: My class diagram Description Class01 <|-- AveryLongClass : Cool Class09 --> C2 : Where am i? Class09 --* C3 @@ -162,6 +222,8 @@
stateDiagram + accTitle: Apa + accDescr: One that can climb better then any man [*] --> S1 state "Some long name" as S1
diff --git a/docs/Setup.md b/docs/Setup.md index e1fcc1dd94..f6c84610aa 100644 --- a/docs/Setup.md +++ b/docs/Setup.md @@ -9,9 +9,9 @@ This is the API to be used when optionally handling the integration with the web using the default integration provided by mermaid.js. The core of this api is the [**render**][2] function which, given a graph -definition as text, renders the graph/diagram and returns an SVG element for the graph. +definition as text, renders the graph/diagram and returns an svg element for the graph. -It is is then up to the user of the API to make use of the SVG, either insert it somewhere in the +It is is then up to the user of the API to make use of the svg, either insert it somewhere in the page or do something completely different. In addition to the render function, a number of behavioral configuration options are available. @@ -1012,7 +1012,7 @@ Pushes in a directive to the configuration ## render -Function that renders an SVG with a graph from a chart definition. Usage example below. +Function that renders an svg with a graph from a chart definition. Usage example below. ```javascript mermaidAPI.initialize({ @@ -1031,7 +1031,7 @@ $(function () { - `id` **any** The id of the element to be rendered - `_txt` **any** The graph definition -- `cb` **any** Callback which is called after rendering is finished with the SVG code as inparam. +- `cb` **any** Callback which is called after rendering is finished with the svg code as inparam. - `container` **any** Selector to element in which a div with the graph temporarily will be inserted. In one is provided a hidden div will be inserted in the body of the page instead. The element will be removed when rendering is completed. diff --git a/src/accessibility.js b/src/accessibility.js index 0b9025abed..c59ba270c4 100644 --- a/src/accessibility.js +++ b/src/accessibility.js @@ -1,6 +1,6 @@ /** * This method will add a basic title and description element to a chart. The yy parser will need to - * respond to getTitle and getAccDescription, where the title is the title element on the chart, + * respond to getAccTitle and getAccDescription, where the title is the title element on the chart, * which is generally not displayed and the accDescription is the description element on the chart, * which is never displayed. * @@ -15,7 +15,7 @@ export default function addSVGAccessibilityFields(yy_parser, svg, id) { return; } - let title_string = yy_parser.getTitle(); + let title_string = yy_parser.getAccTitle(); let description = yy_parser.getAccDescription(); svg.attr('role', 'img').attr('aria-labelledby', 'chart-title-' + id + ' chart-desc-' + id); svg diff --git a/src/commonDb.js b/src/commonDb.js index 8a08a63109..90e99facae 100644 --- a/src/commonDb.js +++ b/src/commonDb.js @@ -1,20 +1,22 @@ import { sanitizeText as _sanitizeText } from './diagrams/common/common'; import { getConfig } from './config'; let title = ''; +let diagramTitle = ''; let description = ''; const sanitizeText = (txt) => _sanitizeText(txt, getConfig()); export const clear = function () { title = ''; description = ''; + diagramTitle = ''; }; export const setAccTitle = function (txt) { title = sanitizeText(txt).replace(/^\s+/g, ''); }; -export const getTitle = function () { - return title; +export const getAccTitle = function () { + return title || diagramTitle; }; export const setAccDescription = function (txt) { @@ -25,9 +27,19 @@ export const getAccDescription = function () { return description; }; +export const setDiagramTitle = function (txt) { + diagramTitle = sanitizeText(txt); +}; + +export const getDiagramTitle = function () { + return diagramTitle; +}; + export default { setAccTitle, - getTitle, + getAccTitle, + setDiagramTitle, + getDiagramTitle: getDiagramTitle, getAccDescription, setAccDescription, clear, diff --git a/src/diagrams/class/classDb.js b/src/diagrams/class/classDb.js index c0ee75747f..9f6ccde63a 100644 --- a/src/diagrams/class/classDb.js +++ b/src/diagrams/class/classDb.js @@ -6,7 +6,7 @@ import utils from '../../utils'; import mermaidAPI from '../../mermaidAPI'; import { setAccTitle, - getTitle, + getAccTitle, getAccDescription, setAccDescription, clear as commonClear, @@ -356,7 +356,7 @@ const setDirection = (dir) => { export default { parseDirective, setAccTitle, - getTitle, + getAccTitle, getAccDescription, setAccDescription, getConfig: () => configApi.getConfig().class, diff --git a/src/diagrams/class/classDiagram.spec.js b/src/diagrams/class/classDiagram.spec.js index a884395c2f..5c09f6ff88 100644 --- a/src/diagrams/class/classDiagram.spec.js +++ b/src/diagrams/class/classDiagram.spec.js @@ -550,7 +550,7 @@ foo() `; parser.parse(str); - expect(parser.yy.getTitle()).toBe('My Title'); + expect(parser.yy.getAccTitle()).toBe('My Title'); expect(parser.yy.getAccDescription()).toBe('My Description'); }); it('should handle accTitle and multiline accDescr', function () { @@ -565,7 +565,7 @@ foo() `; parser.parse(str); - expect(parser.yy.getTitle()).toBe('My Title'); + expect(parser.yy.getAccTitle()).toBe('My Title'); expect(parser.yy.getAccDescription()).toBe('This is mu multi\nline description'); }); diff --git a/src/diagrams/er/erDb.js b/src/diagrams/er/erDb.js index 50757c420f..856d54979d 100644 --- a/src/diagrams/er/erDb.js +++ b/src/diagrams/er/erDb.js @@ -4,7 +4,7 @@ import * as configApi from '../../config'; import common from '../common/common'; import { setAccTitle, - getTitle, + getAccTitle, getAccDescription, setAccDescription, clear as commonClear, @@ -94,7 +94,7 @@ export default { getRelationships, clear, setAccTitle, - getTitle, + getAccTitle, setAccDescription, getAccDescription, }; diff --git a/src/diagrams/er/parser/erDiagram.spec.js b/src/diagrams/er/parser/erDiagram.spec.js index b6cc8aebfe..20be2fbe1c 100644 --- a/src/diagrams/er/parser/erDiagram.spec.js +++ b/src/diagrams/er/parser/erDiagram.spec.js @@ -191,7 +191,7 @@ describe('when parsing ER diagram it...', function () { accDescr: this graph is about stuff ${line1}` ); - expect(erDb.getTitle()).toBe('graph title'); + expect(erDb.getAccTitle()).toBe('graph title'); expect(erDb.getAccDescription()).toBe('this graph is about stuff'); }); @@ -207,7 +207,7 @@ describe('when parsing ER diagram it...', function () { }\n ${line1}` ); - expect(erDb.getTitle()).toBe('graph title'); + expect(erDb.getAccTitle()).toBe('graph title'); expect(erDb.getAccDescription()).toBe('this graph is about stuff'); }); diff --git a/src/diagrams/flowchart/flowDb.js b/src/diagrams/flowchart/flowDb.js index 4d163c5d40..00dc61913d 100644 --- a/src/diagrams/flowchart/flowDb.js +++ b/src/diagrams/flowchart/flowDb.js @@ -6,7 +6,7 @@ import mermaidAPI from '../../mermaidAPI'; import { log } from '../../logger'; import { setAccTitle, - getTitle, + getAccTitle, getAccDescription, setAccDescription, clear as commonClear, @@ -747,7 +747,7 @@ export default { parseDirective, defaultConfig: () => configApi.defaultConfig.flowchart, setAccTitle, - getTitle, + getAccTitle, getAccDescription, setAccDescription, addVertex, diff --git a/src/diagrams/flowchart/parser/flow.spec.js b/src/diagrams/flowchart/parser/flow.spec.js index af7628226d..b2b01f84f4 100644 --- a/src/diagrams/flowchart/parser/flow.spec.js +++ b/src/diagrams/flowchart/parser/flow.spec.js @@ -168,7 +168,7 @@ describe('parsing a flow chart', function () { `; flow.parser.parse(flowChart); - expect(flow.parser.yy.getTitle()).toBe('Big decisions'); + expect(flow.parser.yy.getAccTitle()).toBe('Big decisions'); expect(flow.parser.yy.getAccDescription()).toBe('Flow chart of the decision making process'); }); it('should add accTitle and a multi line accDescr to flow chart', function () { @@ -187,7 +187,7 @@ describe('parsing a flow chart', function () { `; flow.parser.parse(flowChart); - expect(flow.parser.yy.getTitle()).toBe('Big decisions'); + expect(flow.parser.yy.getAccTitle()).toBe('Big decisions'); expect(flow.parser.yy.getAccDescription()).toBe( `Flow chart of the decision making process with a second line` diff --git a/src/diagrams/gantt/ganttDb.js b/src/diagrams/gantt/ganttDb.js index e31c19782b..6014cd9bb2 100644 --- a/src/diagrams/gantt/ganttDb.js +++ b/src/diagrams/gantt/ganttDb.js @@ -7,10 +7,12 @@ import mermaidAPI from '../../mermaidAPI'; import common from '../common/common'; import { setAccTitle, - getTitle, + getAccTitle, getAccDescription, setAccDescription, clear as commonClear, + setDiagramTitle, + getDiagramTitle, } from '../../commonDb'; let dateFormat = ''; @@ -642,7 +644,9 @@ export default { setTodayMarker, getTodayMarker, setAccTitle, - getTitle, + getAccTitle, + setDiagramTitle, + getDiagramTitle, setAccDescription, getAccDescription, addSection, diff --git a/src/diagrams/gantt/ganttDb.spec.js b/src/diagrams/gantt/ganttDb.spec.js index 20b09f5158..406a4d070d 100644 --- a/src/diagrams/gantt/ganttDb.spec.js +++ b/src/diagrams/gantt/ganttDb.spec.js @@ -31,7 +31,7 @@ describe('when using the ganttDb', function () { it.each` fn | expected ${'getTasks'} | ${[]} - ${'getTitle'} | ${''} + ${'getAccTitle'} | ${''} ${'getAccDescription'} | ${''} ${'getDateFormat'} | ${''} ${'getAxisFormat'} | ${''} diff --git a/src/diagrams/gantt/ganttRenderer.js b/src/diagrams/gantt/ganttRenderer.js index bba7e69dc1..4883684ec1 100644 --- a/src/diagrams/gantt/ganttRenderer.js +++ b/src/diagrams/gantt/ganttRenderer.js @@ -1,4 +1,5 @@ import moment from 'moment-mini'; +import { log } from '../../logger'; import { select, scaleTime, @@ -19,11 +20,9 @@ import addSVGAccessibilityFields from '../../accessibility'; parser.yy = ganttDb; export const setConf = function () { - // const keys = Object.keys(cnf); - // keys.forEach(function(key) { - // conf[key] = cnf[key]; - // }); + log.debug('Something is calling, setConf, remove the call'); }; + let w; export const draw = function (text, id) { const conf = getConfig().gantt; @@ -110,7 +109,7 @@ export const draw = function (text, id) { svg .append('text') - .text(parser.yy.getTitle()) + .text(parser.yy.getAccTitle()) .attr('x', w / 2) .attr('y', conf.titleTopMargin) .attr('class', 'titleText'); diff --git a/src/diagrams/gantt/parser/gantt.jison b/src/diagrams/gantt/parser/gantt.jison index d78a6a29d2..f256564531 100644 --- a/src/diagrams/gantt/parser/gantt.jison +++ b/src/diagrams/gantt/parser/gantt.jison @@ -128,7 +128,7 @@ statement | excludes {yy.setExcludes($1.substr(9));$$=$1.substr(9);} | includes {yy.setIncludes($1.substr(9));$$=$1.substr(9);} | todayMarker {yy.setTodayMarker($1.substr(12));$$=$1.substr(12);} - | title {yy.setAccTitle($1.substr(6));$$=$1.substr(6);} + | title {yy.setDiagramTitle($1.substr(6));$$=$1.substr(6);} | acc_title acc_title_value { $$=$2.trim();yy.setAccTitle($$); } | acc_descr acc_descr_value { $$=$2.trim();yy.setAccDescription($$); } | acc_descr_multiline_value { $$=$1.trim();yy.setAccDescription($$); } | section {yy.addSection($1.substr(8));$$=$1.substr(8);} diff --git a/src/diagrams/gantt/parser/gantt.spec.js b/src/diagrams/gantt/parser/gantt.spec.js index 39da0f6902..42b30dbf2c 100644 --- a/src/diagrams/gantt/parser/gantt.spec.js +++ b/src/diagrams/gantt/parser/gantt.spec.js @@ -169,7 +169,7 @@ describe('when parsing a gantt diagram it', function () { parser.parse(ganttString); - expect(ganttDb.getTitle()).toBe(expectedTitle); + expect(ganttDb.getAccTitle()).toBe(expectedTitle); expect(ganttDb.getAccDescription()).toBe(expectedAccDescription); }); it('should allow for a accessibility title and multiline description (accDescr)', function () { @@ -187,7 +187,7 @@ row2`; parser.parse(ganttString); - expect(ganttDb.getTitle()).toBe(expectedTitle); + expect(ganttDb.getAccTitle()).toBe(expectedTitle); expect(ganttDb.getAccDescription()).toBe(expectedAccDescription); }); }); diff --git a/src/diagrams/git/gitGraphAst.js b/src/diagrams/git/gitGraphAst.js index 9563c097d6..bf0d1c2ab9 100644 --- a/src/diagrams/git/gitGraphAst.js +++ b/src/diagrams/git/gitGraphAst.js @@ -6,7 +6,7 @@ import { getConfig } from '../../config'; import common from '../common/common'; import { setAccTitle, - getTitle, + getAccTitle, getAccDescription, setAccDescription, clear as commonClear, @@ -413,7 +413,7 @@ export default { getDirection, getHead, setAccTitle, - getTitle, + getAccTitle, getAccDescription, setAccDescription, commitType, diff --git a/src/diagrams/git/gitGraphParserV2.spec.js b/src/diagrams/git/gitGraphParserV2.spec.js index 94dbf778f7..b57ce1af00 100644 --- a/src/diagrams/git/gitGraphParserV2.spec.js +++ b/src/diagrams/git/gitGraphParserV2.spec.js @@ -660,7 +660,7 @@ describe('when parsing a gitGraph', function () { commit `; parser.parse(str); - expect(parser.yy.getTitle()).toBe('This is a title'); + expect(parser.yy.getAccTitle()).toBe('This is a title'); expect(parser.yy.getAccDescription()).toBe('This is a description'); }); it('should handle a title and a multiline description (accDescr)', () => { @@ -673,7 +673,7 @@ describe('when parsing a gitGraph', function () { commit `; parser.parse(str); - expect(parser.yy.getTitle()).toBe('This is a title'); + expect(parser.yy.getAccTitle()).toBe('This is a title'); expect(parser.yy.getAccDescription()).toBe('This is a description\nusing multiple lines'); }); }); diff --git a/src/diagrams/pie/parser/pie.jison b/src/diagrams/pie/parser/pie.jison index 3fa0d246e0..e98638aa8b 100644 --- a/src/diagrams/pie/parser/pie.jison +++ b/src/diagrams/pie/parser/pie.jison @@ -69,7 +69,7 @@ line statement : | txt value { yy.addSection($1,yy.cleanupValue($2)); } - | title title_value { $$=$2.trim();yy.setPieTitle($$); } + | title title_value { $$=$2.trim();yy.setDiagramTitle($$); } | acc_title acc_title_value { $$=$2.trim();yy.setAccTitle($$); } | acc_descr acc_descr_value { $$=$2.trim();yy.setAccDescription($$); } | acc_descr_multiline_value { $$=$1.trim();yy.setAccDescription($$); } | section {yy.addSection($1.substr(8));$$=$1.substr(8);} diff --git a/src/diagrams/pie/parser/pie.spec.js b/src/diagrams/pie/parser/pie.spec.js index 90bffae3e8..21523dde49 100644 --- a/src/diagrams/pie/parser/pie.spec.js +++ b/src/diagrams/pie/parser/pie.spec.js @@ -56,7 +56,7 @@ pie "bat" : 40 `); const sections = pieDb.getSections(); - const title = pieDb.getPieTitle(); + const title = pieDb.getDiagramTitle(); const section1 = sections['ash']; expect(section1).toBe(60); expect(title).toBe('a 60/40 pie'); @@ -69,7 +69,7 @@ pie `); const sections = pieDb.getSections(); - const title = pieDb.getPieTitle(); + const title = pieDb.getDiagramTitle(); const description = pieDb.getAccDescription(); const section1 = sections['ash']; expect(section1).toBe(60); @@ -85,7 +85,7 @@ pie `); const sections = pieDb.getSections(); - const title = pieDb.getPieTitle(); + const title = pieDb.getDiagramTitle(); const description = pieDb.getAccDescription(); const section1 = sections['ash']; expect(section1).toBe(60); @@ -103,7 +103,7 @@ pie `); const sections = pieDb.getSections(); - const title = pieDb.getPieTitle(); + const title = pieDb.getDiagramTitle(); const description = pieDb.getAccDescription(); const section1 = sections['ash']; expect(section1).toBe(60); diff --git a/src/diagrams/pie/pieDb.js b/src/diagrams/pie/pieDb.js index e02d87d4f1..def0242a36 100644 --- a/src/diagrams/pie/pieDb.js +++ b/src/diagrams/pie/pieDb.js @@ -4,7 +4,9 @@ import * as configApi from '../../config'; import common from '../common/common'; import { setAccTitle, - getTitle, + getAccTitle, + setDiagramTitle, + getDiagramTitle, getAccDescription, setAccDescription, clear as commonClear, @@ -52,15 +54,6 @@ const clear = function () { commonClear(); }; -export const setPieTitle = function (txt) { - let sanitizedText = common.sanitizeText(txt, configApi.getConfig()); - title = sanitizedText; -}; - -export const getPieTitle = function () { - return title; -}; - export default { parseDirective, getConfig: () => configApi.getConfig().pie, @@ -69,9 +62,9 @@ export default { cleanupValue, clear, setAccTitle, - getTitle, - setPieTitle, - getPieTitle, + getAccTitle, + setDiagramTitle, + getDiagramTitle, setShowData, getShowData, getAccDescription, diff --git a/src/diagrams/pie/pieRenderer.js b/src/diagrams/pie/pieRenderer.js index f2d8c2916d..0c3df72202 100644 --- a/src/diagrams/pie/pieRenderer.js +++ b/src/diagrams/pie/pieRenderer.js @@ -136,7 +136,7 @@ export const draw = (txt, id) => { svg .append('text') - .text(parser.yy.getPieTitle()) + .text(parser.yy.getDiagramTitle()) .attr('x', 0) .attr('y', -(height - 50) / 2) .attr('class', 'pieTitleText'); diff --git a/src/diagrams/requirement/parser/requirementDiagram.spec.js b/src/diagrams/requirement/parser/requirementDiagram.spec.js index 850d76b586..4857a37ef7 100644 --- a/src/diagrams/requirement/parser/requirementDiagram.spec.js +++ b/src/diagrams/requirement/parser/requirementDiagram.spec.js @@ -86,7 +86,7 @@ describe('when parsing requirement diagram it...', function () { reqDiagram.parser.parse(doc); - expect(requirementDb.getTitle()).toBe(expectedTitle); + expect(requirementDb.getAccTitle()).toBe(expectedTitle); expect(requirementDb.getAccDescription()).toBe(expectedAccDescription); }); @@ -107,7 +107,7 @@ line 2`; reqDiagram.parser.parse(doc); - expect(requirementDb.getTitle()).toBe(expectedTitle); + expect(requirementDb.getAccTitle()).toBe(expectedTitle); expect(requirementDb.getAccDescription()).toBe(expectedAccDescription); }); diff --git a/src/diagrams/requirement/requirementDb.js b/src/diagrams/requirement/requirementDb.js index d8878d8b4d..f78bd5509d 100644 --- a/src/diagrams/requirement/requirementDb.js +++ b/src/diagrams/requirement/requirementDb.js @@ -4,7 +4,7 @@ import mermaidAPI from '../../mermaidAPI'; import common from '../common/common'; import { setAccTitle, - getTitle, + getAccTitle, getAccDescription, setAccDescription, clear as commonClear, @@ -163,7 +163,7 @@ export default { setNewReqRisk, setNewReqVerifyMethod, setAccTitle, - getTitle, + getAccTitle, setAccDescription, getAccDescription, diff --git a/src/diagrams/sequence/sequenceDb.js b/src/diagrams/sequence/sequenceDb.js index e2898b5bad..f39c599142 100644 --- a/src/diagrams/sequence/sequenceDb.js +++ b/src/diagrams/sequence/sequenceDb.js @@ -4,7 +4,9 @@ import { log } from '../../logger'; import { sanitizeText } from '../common/common'; import { setAccTitle, - getTitle, + getAccTitle, + setDiagramTitle, + getDiagramTitle, getAccDescription, setAccDescription, clear as commonClear, @@ -331,15 +333,6 @@ export const getActorProperty = function (actor, key) { return undefined; }; -export const setDiagramTitle = function (txt) { - let sanitizedText = sanitizeText(txt, configApi.getConfig()); - diagramTitle = sanitizedText; -}; - -export const getDiagramTitle = function () { - return diagramTitle; -}; - export const apply = function (param) { if (param instanceof Array) { param.forEach(function (item) { @@ -450,8 +443,9 @@ export default { getActor, getActorKeys, getActorProperty, - getTitle, + getAccTitle, getDiagramTitle, + setDiagramTitle, parseDirective, getConfig: () => configApi.getConfig().sequence, clear, @@ -461,7 +455,6 @@ export default { PLACEMENT, addNote, setAccTitle, - setDiagramTitle, apply, setAccDescription, getAccDescription, diff --git a/src/diagrams/sequence/sequenceDiagram.spec.js b/src/diagrams/sequence/sequenceDiagram.spec.js index 9b9b9cfe6f..c083abf9ac 100644 --- a/src/diagrams/sequence/sequenceDiagram.spec.js +++ b/src/diagrams/sequence/sequenceDiagram.spec.js @@ -119,7 +119,7 @@ Alice->Bob:Hello Bob, how are you? mermaidAPI.parse(str); expect(parser.yy.getDiagramTitle()).toBe('Diagram Title'); - expect(parser.yy.getTitle()).toBe('This is the title'); + expect(parser.yy.getAccTitle()).toBe('This is the title'); expect(parser.yy.getAccDescription()).toBe('Accessibility Description'); const messages = parser.yy.getMessages(); }); @@ -135,7 +135,7 @@ Alice->Bob:Hello Bob, how are you? `; mermaidAPI.parse(str); - expect(parser.yy.getTitle()).toBe('This is the title'); + expect(parser.yy.getAccTitle()).toBe('This is the title'); expect(parser.yy.getAccDescription()).toBe('Accessibility\nDescription'); const messages = parser.yy.getMessages(); }); diff --git a/src/diagrams/state/stateDb.js b/src/diagrams/state/stateDb.js index 3f18c5de87..a9766e4f8b 100644 --- a/src/diagrams/state/stateDb.js +++ b/src/diagrams/state/stateDb.js @@ -5,7 +5,7 @@ import common from '../common/common'; import * as configApi from '../../config'; import { setAccTitle, - getTitle, + getAccTitle, getAccDescription, setAccDescription, clear as commonClear, @@ -92,7 +92,7 @@ const extract = (_doc) => { // doc = root; // } log.info(doc); - clear(); + clear(true); log.info('Extract', doc); @@ -171,7 +171,7 @@ export const addState = function (id, type, doc, descr, note) { } }; -export const clear = function () { +export const clear = function (saveCommon) { documents = { root: newDoc(), }; @@ -182,7 +182,9 @@ export const clear = function () { startCnt = 0; endCnt = 0; // eslint-disable-line classes = []; - commonClear(); + if (!saveCommon) { + commonClear(); + } }; export const getState = function (id) { @@ -283,7 +285,6 @@ export default { addRelation, getDividerId, setDirection, - // addDescription, cleanupLabel, lineType, relationType, @@ -293,7 +294,7 @@ export default { getRootDocV2, extract, trimColon, - getTitle, + getAccTitle, setAccTitle, getAccDescription, setAccDescription, diff --git a/src/diagrams/state/stateDiagram-v2.spec.js b/src/diagrams/state/stateDiagram-v2.spec.js index a5aaf83727..701fec62bb 100644 --- a/src/diagrams/state/stateDiagram-v2.spec.js +++ b/src/diagrams/state/stateDiagram-v2.spec.js @@ -48,7 +48,7 @@ describe('state diagram, ', function () { `; parser.parse(str); - const title = stateDb.getTitle(); + const title = stateDb.getAccTitle(); expect(title).toBe('a simple title of the diagram'); }); it('simple with directive', function () { diff --git a/src/diagrams/state/stateDiagram.spec.js b/src/diagrams/state/stateDiagram.spec.js index 762a694ca1..0b2b30a1e1 100644 --- a/src/diagrams/state/stateDiagram.spec.js +++ b/src/diagrams/state/stateDiagram.spec.js @@ -63,7 +63,7 @@ describe('state diagram, ', function () { `; parser.parse(str); - const title = stateDb.getTitle(); + const title = stateDb.getAccTitle(); expect(title).toBe('a simple title of the diagram'); }); it('simple with directive', function () { diff --git a/src/diagrams/user-journey/journeyDb.js b/src/diagrams/user-journey/journeyDb.js index b486ce8237..d8f27b93cf 100644 --- a/src/diagrams/user-journey/journeyDb.js +++ b/src/diagrams/user-journey/journeyDb.js @@ -3,7 +3,9 @@ import * as configApi from '../../config'; import common from '../common/common'; import { setAccTitle, - getTitle, + getAccTitle, + setDiagramTitle, + getDiagramTitle, getAccDescription, setAccDescription, clear as commonClear, @@ -126,8 +128,10 @@ export default { parseDirective, getConfig: () => configApi.getConfig().journey, clear, + setDiagramTitle, + getDiagramTitle, setAccTitle, - getTitle, + getAccTitle, setAccDescription, getAccDescription, addSection, diff --git a/src/diagrams/user-journey/journeyDb.spec.js b/src/diagrams/user-journey/journeyDb.spec.js index c0149813fc..3a17ca2029 100644 --- a/src/diagrams/user-journey/journeyDb.spec.js +++ b/src/diagrams/user-journey/journeyDb.spec.js @@ -16,7 +16,7 @@ describe('when using the journeyDb', function () { it.each` fn | expected ${'getTasks'} | ${[]} - ${'getTitle'} | ${''} + ${'getAccTitle'} | ${''} ${'getSections'} | ${[]} ${'getActors'} | ${[]} `('should clear $fn', ({ fn, expected }) => { @@ -34,7 +34,7 @@ describe('when using the journeyDb', function () { it.each` fn | expected ${'getTasks'} | ${[]} - ${'getTitle'} | ${''} + ${'getAccTitle'} | ${''} ${'getAccDescription'} | ${''} ${'getSections'} | ${[]} `('should clear $fn', ({ fn, expected }) => { @@ -52,7 +52,7 @@ describe('when using the journeyDb', function () { journeyDb.addSection('Do shopping'); journeyDb.addTask('Go shopping', ':5:Mum'); - expect(journeyDb.getTitle()).toEqual('Shopping'); + expect(journeyDb.getAccTitle()).toEqual('Shopping'); expect(journeyDb.getAccDescription()).toEqual('A user journey for family shopping'); expect(journeyDb.getTasks()).toEqual([ { diff --git a/src/diagrams/user-journey/journeyRenderer.js b/src/diagrams/user-journey/journeyRenderer.js index 612a891236..24ab8cb8a4 100644 --- a/src/diagrams/user-journey/journeyRenderer.js +++ b/src/diagrams/user-journey/journeyRenderer.js @@ -74,7 +74,7 @@ export const draw = function (text, id) { svgDraw.initGraphics(diagram); const tasks = parser.yy.getTasks(); - const title = parser.yy.getTitle(); + const title = parser.yy.getDiagramTitle(); const actorNames = parser.yy.getActors(); for (let member in actors) delete actors[member]; diff --git a/src/diagrams/user-journey/parser/journey.jison b/src/diagrams/user-journey/parser/journey.jison index 62a81240eb..4c51efc9bb 100644 --- a/src/diagrams/user-journey/parser/journey.jison +++ b/src/diagrams/user-journey/parser/journey.jison @@ -73,7 +73,7 @@ directive ; statement - : title {yy.setAccTitle($1.substr(6));$$=$1.substr(6);} + : title {yy.setDiagramTitle($1.substr(6));$$=$1.substr(6);} | acc_title acc_title_value { $$=$2.trim();yy.setAccTitle($$); } | acc_descr acc_descr_value { $$=$2.trim();yy.setAccDescription($$); } | acc_descr_multiline_value { $$=$1.trim();yy.setAccDescription($$); } diff --git a/src/diagrams/user-journey/parser/journey.spec.js b/src/diagrams/user-journey/parser/journey.spec.js index 3cd68acc7b..2454c1d165 100644 --- a/src/diagrams/user-journey/parser/journey.spec.js +++ b/src/diagrams/user-journey/parser/journey.spec.js @@ -36,11 +36,13 @@ describe('when parsing a journey diagram it', function () { family shopping }` + 'title Adding journey diagram functionality to mermaid\n' + + 'accTitle: Adding acc journey diagram functionality to mermaid\n' + 'section Order from website'; expect(parserFnConstructor(str)).not.toThrow(); expect(journeyDb.getAccDescription()).toBe('A user journey for\nfamily shopping'); - expect(journeyDb.getTitle()).toBe('Adding journey diagram functionality to mermaid'); + expect(journeyDb.getDiagramTitle()).toBe('Adding journey diagram functionality to mermaid'); + expect(journeyDb.getAccTitle()).toBe('Adding acc journey diagram functionality to mermaid'); }); it('it should handle an accessibility title (accDescr)', function () { const str = `journey @@ -49,7 +51,7 @@ describe('when parsing a journey diagram it', function () { expect(parserFnConstructor(str)).not.toThrow(); expect(journeyDb.getAccDescription()).toBe(''); - expect(journeyDb.getTitle()).toBe('The title'); + expect(journeyDb.getAccTitle()).toBe('The title'); }); it('should handle a section definition', function () {