tsConversion: DetectType

jest.config.js

@@ -2,6 +2,7 @@ const path = require('path');
 
 module.exports = {
   testEnvironment: 'jsdom',
+  preset: 'ts-jest',
   transform: {
     '^.+\\.jsx?$': ['babel-jest', { rootMode: 'upward' }],
     '^.+\\.jison$': [

package.json

@@ -76,6 +76,7 @@
     "@babel/register": "^7.14.5",
     "@commitlint/cli": "^17.0.0",
     "@commitlint/config-conventional": "^17.0.0",
+    "@types/jest": "^28.1.7",
     "babel-jest": "^28.0.3",
     "babel-loader": "^8.2.2",
     "concurrently": "^7.0.0",
@@ -106,6 +107,7 @@
     "prettier-plugin-jsdoc": "^0.3.30",
     "start-server-and-test": "^1.12.6",
     "terser-webpack-plugin": "^5.2.4",
+    "ts-jest": "^28.0.8",
     "ts-loader": "^9.3.1",
     "typescript": "^4.7.4",
     "webpack": "^5.53.0",

src/Diagram.ts

@@ -1,7 +1,7 @@
 import * as configApi from './config';
 import { log } from './logger';
 import { getDiagrams } from './diagram-api/diagramAPI';
-import detectType from './diagram-api/detectType';
+import { detectType } from './diagram-api/detectType';
 class Diagram {
   type = 'graph';
   parser;

src/diagram-api/detectType.js

@@ -1,100 +0,0 @@
-const directive =
-  /[%]{2}[{]\s*(?:(?:(\w+)\s*:|(\w+))\s*(?:(?:(\w+))|((?:(?![}][%]{2}).|\r?\n)*))?\s*)(?:[}][%]{2})?/gi;
-const anyComment = /\s*%%.*\n/gm;
-const detectors = {};
-/**
- * @function detectType Detects the type of the graph text. Takes into consideration the possible
- *   existence of an %%init directive
- *
- *   ```mermaid
- *   %%{initialize: {"startOnLoad": true, logLevel: "fatal" }}%%
- *   graph LR
- *    a-->b
- *    b-->c
- *    c-->d
- *    d-->e
- *    e-->f
- *    f-->g
- *    g-->h
- * ```
- * @param {string} text The text defining the graph
- * @param {{
- *   class: { defaultRenderer: string } | undefined;
- *   state: { defaultRenderer: string } | undefined;
- *   flowchart: { defaultRenderer: string } | undefined;
- * }} [cnf]
- * @returns {string} A graph definition key
- */
-const detectType = function (text, cnf) {
-  text = text.replace(directive, '').replace(anyComment, '\n');
-  if (text.match(/^\s*C4Context|C4Container|C4Component|C4Dynamic|C4Deployment/)) {
-    return 'c4';
-  }
-
-  if (text.match(/^\s*sequenceDiagram/)) {
-    return 'sequence';
-  }
-
-  if (text.match(/^\s*gantt/)) {
-    return 'gantt';
-  }
-  if (text.match(/^\s*classDiagram-v2/)) {
-    return 'classDiagram';
-  }
-  if (text.match(/^\s*classDiagram/)) {
-    if (cnf && cnf.class && cnf.class.defaultRenderer === 'dagre-wrapper') return 'classDiagram';
-    return 'class';
-  }
-
-  if (text.match(/^\s*stateDiagram-v2/)) {
-    return 'stateDiagram';
-  }
-
-  if (text.match(/^\s*stateDiagram/)) {
-    if (cnf && cnf.class && cnf.state.defaultRenderer === 'dagre-wrapper') return 'stateDiagram';
-    return 'state';
-  }
-
-  // if (text.match(/^\s*gitGraph/)) {
-  //   return 'gitGraph';
-  // }
-  if (text.match(/^\s*flowchart/)) {
-    return 'flowchart-v2';
-  }
-
-  if (text.match(/^\s*info/)) {
-    return 'info';
-  }
-  if (text.match(/^\s*pie/)) {
-    return 'pie';
-  }
-
-  if (text.match(/^\s*erDiagram/)) {
-    return 'er';
-  }
-
-  if (text.match(/^\s*journey/)) {
-    return 'journey';
-  }
-
-  if (text.match(/^\s*requirement/) || text.match(/^\s*requirementDiagram/)) {
-    return 'requirement';
-  }
-  if (cnf && cnf.flowchart && cnf.flowchart.defaultRenderer === 'dagre-wrapper')
-    return 'flowchart-v2';
-  const k = Object.keys(detectors);
-  for (let i = 0; i < k.length; i++) {
-    const key = k[i];
-    const dia = detectors[key];
-    if (dia && dia.detector(text)) {
-      return key;
-    }
-  }
-  return 'flowchart';
-};
-export const addDetector = (key, detector) => {
-  detectors[key] = {
-    detector,
-  };
-};
-export default detectType;

src/diagram-api/detectType.ts

@@ -0,0 +1,77 @@
+const directive =
+  /[%]{2}[{]\s*(?:(?:(\w+)\s*:|(\w+))\s*(?:(?:(\w+))|((?:(?![}][%]{2}).|\r?\n)*))?\s*)(?:[}][%]{2})?/gi;
+const anyComment = /\s*%%.*\n/gm;
+
+const detectors: Record<string, DiagramDetector> = {};
+const diagramMatchers: Record<string, RegExp> = {
+  c4: /^\s*C4Context|C4Container|C4Component|C4Dynamic|C4Deployment/,
+  sequence: /^\s*sequenceDiagram/,
+  gantt: /^\s*gantt/,
+  classDiagram: /^\s*classDiagram-v2/,
+  stateDiagram: /^\s*stateDiagram-v2/,
+  'flowchart-v2': /^\s*flowchart/,
+  info: /^\s*info/,
+  pie: /^\s*pie/,
+  er: /^\s*erDiagram/,
+  journey: /^\s*journey/,
+  // gitGraph: /^\s*gitGraph/,
+  requirement: /^\s*requirement(Diagram)?/,
+};
+
+/**
+ * @function detectType Detects the type of the graph text. Takes into consideration the possible
+ *   existence of an %%init directive
+ *
+ *   ```mermaid
+ *   %%{initialize: {"startOnLoad": true, logLevel: "fatal" }}%%
+ *   graph LR
+ *    a-->b
+ *    b-->c
+ *    c-->d
+ *    d-->e
+ *    e-->f
+ *    f-->g
+ *    g-->h
+ * ```
+ * @param {string} text The text defining the graph
+ * @param {{
+ *   class: { defaultRenderer: string } | undefined;
+ *   state: { defaultRenderer: string } | undefined;
+ *   flowchart: { defaultRenderer: string } | undefined;
+ * }} [cnf]
+ * @returns {string} A graph definition key
+ */
+export const detectType = function (text: string, cnf: ConfigType): string {
+  text = text.replace(directive, '').replace(anyComment, '\n');
+  for (const [diagram, matcher] of Object.entries(diagramMatchers)) {
+    if (text.match(matcher)) {
+      return diagram;
+    }
+  }
+
+  if (text.match(/^\s*classDiagram/)) {
+    if (cnf?.class?.defaultRenderer === 'dagre-wrapper') return 'classDiagram';
+    return 'class';
+  }
+
+  if (text.match(/^\s*stateDiagram/)) {
+    if (cnf?.state?.defaultRenderer === 'dagre-wrapper') return 'stateDiagram';
+    return 'state';
+  }
+
+  if (cnf?.flowchart?.defaultRenderer === 'dagre-wrapper') {
+    return 'flowchart-v2';
+  }
+
+  for (const [key, detector] of Object.entries(detectors)) {
+    if (detector(text)) {
+      return key;
+    }
+  }
+
+  return 'flowchart';
+};
+
+export const addDetector = (key: string, detector: DiagramDetector) => {
+  detectors[key] = detector;
+};

src/diagram-api/diagram-orchestration.ts

@@ -1,13 +1,14 @@
-import { registerDiagram } from './diagramAPI.js';
+import { registerDiagram } from './diagramAPI';
 // import mindmapDb from '../diagrams/mindmap/mindmapDb';
 // import mindmapRenderer from '../diagrams/mindmap/mindmapRenderer';
 // import mindmapParser from '../diagrams/mindmap/parser/mindmapDiagram';
-// import mindmapDetector from '../diagrams/mindmap/mindmapDetector';
+// import { mindmapDetector } from '../diagrams/mindmap/mindmapDetector';
 
 import gitGraphDb from '../diagrams/git/gitGraphAst';
 import gitGraphRenderer from '../diagrams/git/gitGraphRenderer';
+// @ts-ignore
 import gitGraphParser from '../diagrams/git/parser/gitGraph';
-import gitGraphDetector from '../diagrams/git/gitGraphDetector';
+import { gitGraphDetector } from '../diagrams/git/gitGraphDetector';
 
 // Register mindmap and other built-in diagrams
 // registerDiagram(
@@ -19,7 +20,7 @@ import gitGraphDetector from '../diagrams/git/gitGraphDetector';
 //   mindmapRenderer,
 //   mindmapDetector
 // );
-const addDiagrams = () => {
+export const addDiagrams = () => {
   registerDiagram(
     'gitGraph',
     gitGraphParser,
@@ -29,4 +30,3 @@ const addDiagrams = () => {
     gitGraphDetector
   );
 };
-export default addDiagrams;

src/diagram-api/diagramAPI.js

@@ -35,6 +35,7 @@ import journeyDb from '../diagrams/user-journey/journeyDb';
 import journeyRenderer from '../diagrams/user-journey/journeyRenderer';
 import journeyParser from '../diagrams/user-journey/parser/journey';
 import { addDetector } from './detectType';
+import { log } from '../logger';
 
 const diagrams = {
   c4: {
@@ -165,6 +166,9 @@ const diagrams = {
 };
 // console.log(sequenceDb);
 export const registerDiagram = (id, parser, db, renderer, init, detector) => {
+  if (diagrams[id]) {
+    log.warn(`Diagram ${id} already registered.`);
+  }
   diagrams[id] = { parser, db, renderer, init };
   addDetector(id, detector);
 };

src/diagrams/git/gitGraphDetector.js

@@ -1,8 +0,0 @@
-const detector = (txt) => {
-  if (txt.match(/^\s*gitGraph/)) {
-    return 'gitGraph';
-  }
-  return null;
-};
-
-export default detector;

src/diagrams/git/gitGraphDetector.ts

@@ -0,0 +1,3 @@
+export const gitGraphDetector: DiagramDetector = (txt) => {
+  return txt.match(/^\s*gitGraph/) != null;
+};

src/diagrams/git/gitGraphParserV2.spec.js

@@ -4,7 +4,6 @@ import gitGraphAst from './gitGraphAst';
 import { parser } from './parser/gitGraph';
 //import randomString from 'crypto-random-string';
 //import cryptoRandomString from 'crypto-random-string';
-import { logger } from '../../logger';
 
 //jest.mock('crypto-random-string');
 

src/diagrams/mindmap/mindamapDetector.js

@@ -1,8 +0,0 @@
-const detector = (txt) => {
-  if (txt.match(/^\s*mindmap/)) {
-    return 'mindmap';
-  }
-  return null;
-};
-
-export default detector;

src/diagrams/mindmap/mindamapDetector.ts

@@ -0,0 +1,3 @@
+export const mindmapDetector: DiagramDetector = (txt) => {
+  return txt.match(/^\s*mindmap/) != null;
+};

src/mermaidAPI.js

@@ -19,7 +19,7 @@ import { select } from 'd3';
 import { compile, serialize, stringify } from 'stylis';
 import pkg from '../package.json';
 import * as configApi from './config';
-import addDiagrams from './diagram-api/diagram-orchestration';
+import { addDiagrams } from './diagram-api/diagram-orchestration';
 import classDb from './diagrams/class/classDb';
 import flowDb from './diagrams/flowchart/flowDb';
 import flowRenderer from './diagrams/flowchart/flowRenderer';

src/types.d.ts

@@ -0,0 +1,7 @@
+interface ConfigType {
+  class?: { defaultRenderer: string };
+  state?: { defaultRenderer: string };
+  flowchart?: { defaultRenderer: string };
+}
+
+type DiagramDetector = (text: string) => boolean;

src/utils.js

@@ -16,7 +16,7 @@ import {
 import common from './diagrams/common/common';
 import { configKeys } from './defaultConfig';
 import { log } from './logger';
-import detectType from './diagram-api/detectType';
+import { detectType } from './diagram-api/detectType';
 import assignWithDepth from './assignWithDepth';
 
 // Effectively an enum of the supported curve types, accessible by name

src/utils.spec.js

@@ -1,7 +1,7 @@
 import utils from './utils';
 import assignWithDepth from './assignWithDepth';
-import detectType from './diagram-api/detectType';
+import { detectType } from './diagram-api/detectType';
-import addDiagrams from './diagram-api/diagram-orchestration';
+import { addDiagrams } from './diagram-api/diagram-orchestration';
 
 addDiagrams();
 

yarn.lock

@@ -2305,6 +2305,14 @@
   dependencies:
     "@types/istanbul-lib-report" "*"
 
+"@types/jest@^28.1.7":
+  version "28.1.7"
+  resolved "https://registry.yarnpkg.com/@types/jest/-/jest-28.1.7.tgz#a680c5d05b69634c2d54a63cb106d7fb1adaba16"
+  integrity sha512-acDN4VHD40V24tgu0iC44jchXavRNVFXQ/E6Z5XNsswgoSO/4NgsXoEYmPUGookKldlZQyIpmrEXsHI9cA3ZTA==
+  dependencies:
+    expect "^28.0.0"
+    pretty-format "^28.0.0"
+
 "@types/jsdom@^16.2.4":
   version "16.2.14"
   resolved "https://registry.yarnpkg.com/@types/jsdom/-/jsdom-16.2.14.tgz#26fe9da6a8870715b154bb84cd3b2e53433d8720"
@@ -3380,6 +3388,13 @@ browserslist@^4.14.5, browserslist@^4.20.2, browserslist@^4.21.0:
     node-releases "^2.0.5"
     update-browserslist-db "^1.0.4"
 
+bs-logger@0.x:
+  version "0.2.6"
+  resolved "https://registry.yarnpkg.com/bs-logger/-/bs-logger-0.2.6.tgz#eb7d365307a72cf974cc6cda76b68354ad336bd8"
+  integrity sha512-pd8DCoxmbgc7hyPKOvxtqNcjYoOsABPQdcCUjGp3d42VR2CX1ORhk2A87oqqu5R1kk+76nsxZupkmyd+MVtCog==
+  dependencies:
+    fast-json-stable-stringify "2.x"
+
 bser@2.1.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/bser/-/bser-2.1.1.tgz#e6787da20ece9d07998533cfd9de6f5c38f4bc05"
@@ -5520,7 +5535,7 @@ expand-brackets@^2.1.4:
     snapdragon "^0.8.1"
     to-regex "^3.0.1"
 
-expect@^28.1.3:
+expect@^28.0.0, expect@^28.1.3:
   version "28.1.3"
   resolved "https://registry.yarnpkg.com/expect/-/expect-28.1.3.tgz#90a7c1a124f1824133dd4533cce2d2bdcb6603ec"
   integrity sha512-eEh0xn8HlsuOBxFgIss+2mX85VAS4Qy3OSkjV7rlBWljtA4oWH37glVGyOZSZvErDT/yBywZdPGwCXuTvSG85g==
@@ -5643,7 +5658,7 @@ fast-glob@^3.2.9:
     merge2 "^1.3.0"
     micromatch "^4.0.4"
 
-fast-json-stable-stringify@^2.0.0:
+fast-json-stable-stringify@2.x, fast-json-stable-stringify@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz#874bf69c6f404c2b5d99c481341399fd55892633"
   integrity sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==
@@ -7434,7 +7449,7 @@ jest-snapshot@^28.1.3:
     pretty-format "^28.1.3"
     semver "^7.3.5"
 
-jest-util@^28.1.3:
+jest-util@^28.0.0, jest-util@^28.1.3:
   version "28.1.3"
   resolved "https://registry.yarnpkg.com/jest-util/-/jest-util-28.1.3.tgz#f4f932aa0074f0679943220ff9cbba7e497028b0"
   integrity sha512-XdqfpHwpcSRko/C35uLYFM2emRAltIIKZiJ9eAmhjsj0CqZMa0p1ib0R5fWIqGhn1a103DebTbpqIaP1qCQ6tQ==
@@ -7966,6 +7981,11 @@ lodash.ismatch@^4.4.0:
   resolved "https://registry.yarnpkg.com/lodash.ismatch/-/lodash.ismatch-4.4.0.tgz#756cb5150ca3ba6f11085a78849645f188f85f37"
   integrity sha1-dWy1FQyjum8RCFp4hJZF8Yj4Xzc=
 
+lodash.memoize@4.x:
+  version "4.1.2"
+  resolved "https://registry.yarnpkg.com/lodash.memoize/-/lodash.memoize-4.1.2.tgz#bcc6c49a42a2840ed997f323eada5ecd182e0bfe"
+  integrity sha512-t7j+NzmgnQzTAYXcsHYLgimltOV1MXHtlOWf6GjL9Kj8GK5FInw5JotxvbOs+IvV1/Dzo04/fCGfLVs7aXb4Ag==
+
 lodash.merge@^4.6.1, lodash.merge@^4.6.2:
   version "4.6.2"
   resolved "https://registry.yarnpkg.com/lodash.merge/-/lodash.merge-4.6.2.tgz#558aa53b43b661e1925a0afdfa36a9a1085fe57a"
@@ -8053,7 +8073,7 @@ make-dir@^3.0.0, make-dir@^3.0.2, make-dir@^3.1.0:
   dependencies:
     semver "^6.0.0"
 
-make-error@^1.1.1:
+make-error@1.x, make-error@^1.1.1:
   version "1.3.6"
   resolved "https://registry.yarnpkg.com/make-error/-/make-error-1.3.6.tgz#2eb2e37ea9b67c4891f684a1394799af484cf7a2"
   integrity sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==
@@ -9359,7 +9379,7 @@ pretty-bytes@^5.6.0:
   resolved "https://registry.yarnpkg.com/pretty-bytes/-/pretty-bytes-5.6.0.tgz#356256f643804773c82f64723fe78c92c62beaeb"
   integrity sha512-FFw039TmrBqFK8ma/7OL3sDz/VytdtJr044/QUJtH0wK9lb9jLq9tJyIxUwtQJHwar2BqtiA4iCWSwo9JLkzFg==
 
-pretty-format@^28.1.3:
+pretty-format@^28.0.0, pretty-format@^28.1.3:
   version "28.1.3"
   resolved "https://registry.yarnpkg.com/pretty-format/-/pretty-format-28.1.3.tgz#c9fba8cedf99ce50963a11b27d982a9ae90970d5"
   integrity sha512-8gFb/To0OmxHR9+ZTb14Df2vNxdGCX8g1xWGUTqUw5TiZvcQf5sHKObd5UcPyLLyowNwDAMTF3XWOG1B6mxl1Q==
@@ -10163,7 +10183,7 @@ semver@7.0.0:
   resolved "https://registry.yarnpkg.com/semver/-/semver-7.0.0.tgz#5f3ca35761e47e05b206c6daff2cf814f0316b8e"
   integrity sha512-+GB6zVA9LWh6zovYQLALHwv5rb2PHGlJi3lfiqIHxR0uuwCgefcOJc59v9fv1w8GbStwxuuqqAjI9NMAOOgq1A==
 
-semver@7.3.7, semver@^7.1.1, semver@^7.3.2, semver@^7.3.4, semver@^7.3.5, semver@^7.3.7:
+semver@7.3.7, semver@7.x, semver@^7.1.1, semver@^7.3.2, semver@^7.3.4, semver@^7.3.5, semver@^7.3.7:
   version "7.3.7"
   resolved "https://registry.yarnpkg.com/semver/-/semver-7.3.7.tgz#12c5b649afdbf9049707796e22a4028814ce523f"
   integrity sha512-QlYTucUYOews+WeEujDoEGziz4K6c47V/Bd+LjSSYcA94p+DmINdf7ncaUinThfvZyu13lN9OY1XDxt8C0Tw0g==
@@ -11098,6 +11118,20 @@ trough@^1.0.0:
   resolved "https://registry.yarnpkg.com/trough/-/trough-1.0.5.tgz#b8b639cefad7d0bb2abd37d433ff8293efa5f406"
   integrity sha512-rvuRbTarPXmMb79SmzEp8aqXNKcK+y0XaB298IXueQ8I2PsrATcPBCSPyK/dDNa2iWOhKlfNnOjdAOTBU/nkFA==
 
+ts-jest@^28.0.8:
+  version "28.0.8"
+  resolved "https://registry.yarnpkg.com/ts-jest/-/ts-jest-28.0.8.tgz#cd204b8e7a2f78da32cf6c95c9a6165c5b99cc73"
+  integrity sha512-5FaG0lXmRPzApix8oFG8RKjAz4ehtm8yMKOTy5HX3fY6W8kmvOrmcY0hKDElW52FJov+clhUbrKAqofnj4mXTg==
+  dependencies:
+    bs-logger "0.x"
+    fast-json-stable-stringify "2.x"
+    jest-util "^28.0.0"
+    json5 "^2.2.1"
+    lodash.memoize "4.x"
+    make-error "1.x"
+    semver "7.x"
+    yargs-parser "^21.0.1"
+
 ts-loader@^9.3.1:
   version "9.3.1"
   resolved "https://registry.yarnpkg.com/ts-loader/-/ts-loader-9.3.1.tgz#fe25cca56e3e71c1087fe48dc67f4df8c59b22d4"
@@ -12059,6 +12093,11 @@ yargs-parser@^21.0.0:
   resolved "https://registry.yarnpkg.com/yargs-parser/-/yargs-parser-21.0.0.tgz#a485d3966be4317426dd56bdb6a30131b281dc55"
   integrity sha512-z9kApYUOCwoeZ78rfRYYWdiU/iNL6mwwYlkkZfJoyMR1xps+NEBX5X7XmRpxkZHhXJ6+Ey00IwKxBBSW9FIjyA==
 
+yargs-parser@^21.0.1:
+  version "21.1.1"
+  resolved "https://registry.yarnpkg.com/yargs-parser/-/yargs-parser-21.1.1.tgz#9096bceebf990d21bb31fa9516e0ede294a77d35"
+  integrity sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==
+
 yargs@17.4.1, yargs@^17.0.0, yargs@^17.3.1:
   version "17.4.1"
   resolved "https://registry.yarnpkg.com/yargs/-/yargs-17.4.1.tgz#ebe23284207bb75cee7c408c33e722bfb27b5284"