mermaid - npm Package Compare versions

Comparing version 8.0.0-alpha.1 to 8.0.0-alpha.2

package.json

 {
   "name": "mermaid",
-  "version": "8.0.0-alpha.1",
+  "version": "8.0.0-alpha.2",
   "description": "Markdownish syntax for generating flowcharts, sequence diagrams, class diagrams, gantt charts and git graphs.",
@@ -19,6 +19,5 @@ "main": "dist/mermaid.core.js",
     "release": "yarn build -p --config webpack.config.prod.babel.js",
-    "upgrade": "yarn-upgrade-all && yarn remove less jasmine && yarn add --dev less@2.7.3 jasmine@2.99.0",
+    "upgrade": "yarn-upgrade-all",
     "lint": "standard",
-    "karma": "node -r babel-register node_modules/.bin/karma start karma.conf.js",
-    "test": "yarn lint && yarn karma",
+    "test": "yarn lint && jest",
     "jison": "node -r babel-register node_modules/.bin/gulp jison",
@@ -47,3 +46,4 @@ "prepublishOnly": "yarn build && yarn release && yarn test",
     "lodash": "^4.17.5",
-    "moment": "^2.21.0"
+    "moment": "^2.21.0",
+    "scope-css": "^1.0.5"
   },
@@ -53,8 +53,6 @@ "devDependencies": {
     "babel-loader": "^7.1.4",
-    "babel-plugin-lodash": "^3.3.2",
     "babel-preset-env": "^1.6.1",
-    "codeclimate-test-reporter": "^0.5.0",
+    "coveralls": "^3.0.0",
     "css-loader": "^0.28.10",
     "css-to-string-loader": "^0.1.3",
-    "extract-text-webpack-plugin": "^3.0.2",
     "gulp": "^3.9.1",
@@ -64,16 +62,8 @@ "gulp-filelog": "^0.4.1",
     "husky": "^0.14.3",
-    "inject-loader": "^3.0.1",
-    "jasmine": "2.99.0",
-    "jasmine-es6": "^0.4.3",
+    "identity-obj-proxy": "^3.0.0",
+    "jest": "^22.4.2",
     "jison": "^0.4.18",
-    "karma": "^2.0.0",
-    "karma-chrome-launcher": "^2.2.0",
-    "karma-jasmine": "^1.1.1",
-    "karma-sourcemap-loader": "^0.3.7",
-    "karma-webpack": "^2.0.13",
-    "less": "2.7.3",
-    "less-loader": "^4.0.6",
-    "puppeteer": "^1.1.1",
+    "node-sass": "^4.7.2",
+    "sass-loader": "^6.0.7",
     "standard": "^11.0.0",
-    "style-loader": "^0.20.2",
     "webpack": "^4.1.1",
@@ -87,3 +77,8 @@ "webpack-cli": "^2.0.10",
     "src"
-  ]
+  ],
+  "jest": {
+    "moduleNameMapper": {
+      "\\.(css|scss)$": "identity-obj-proxy"
+    }
+  }
 }

README.md

 # mermaid
 
 [![Build Status](https://travis-ci.org/knsv/mermaid.svg?branch=master)](https://travis-ci.org/knsv/mermaid)
-[![Code Climate](https://codeclimate.com/github/knsv/mermaid/badges/gpa.svg)](https://codeclimate.com/github/knsv/mermaid)
+[![Coverage Status](https://coveralls.io/repos/github/knsv/mermaid/badge.svg?branch=master)](https://coveralls.io/github/knsv/mermaid?branch=master)
 [![Join the chat at https://gitter.im/knsv/mermaid](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/knsv/mermaid?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
@@ -6,0 +6,0 @@

src/diagrams/classDiagram/parser/classDiagram.js

@@ -1,2 +0,2 @@
-/* parser generated by jison 0.4.17 */
+/* parser generated by jison 0.4.18 */
 /*
@@ -169,9 +169,5 @@ Returns a Parser object of the following structure:
     } else {
-        function _parseError (msg, hash) {
-            this.message = msg;
-            this.hash = hash;
-        }
-        _parseError.prototype = Error;
-
-        throw new _parseError(str, hash);
+        var error = new Error(str);
+        error.hash = hash;
+        throw error;
     }
@@ -178,0 +174,0 @@ },

src/diagrams/example/exampleRenderer.js

@@ -6,2 +6,3 @@ import * as d3 from 'd3'
 import { logger } from '../../logger'
+import { version } from '../../../package.json'
 
@@ -13,3 +14,3 @@ /**
  */
-export const draw = function (txt, id, ver) {
+export const draw = function (txt, id) {
   const parser = exampleParser.parser
@@ -32,3 +33,3 @@ parser.yy = db
     .style('text-anchor', 'middle')
-    .text('mermaid ' + ver)
+    .text('mermaid ' + version)
 
@@ -35,0 +36,0 @@ svg.attr('height', 100)

src/diagrams/example/parser/example.js

@@ -1,2 +0,2 @@
-/* parser generated by jison 0.4.17 */
+/* parser generated by jison 0.4.18 */
 /*
@@ -109,9 +109,5 @@ Returns a Parser object of the following structure:
     } else {
-        function _parseError (msg, hash) {
-            this.message = msg;
-            this.hash = hash;
-        }
-        _parseError.prototype = Error;
-
-        throw new _parseError(str, hash);
+        var error = new Error(str);
+        error.hash = hash;
+        throw error;
     }
@@ -118,0 +114,0 @@ },

src/diagrams/flowchart/flowRenderer.js

@@ -179,6 +179,4 @@ import graphlib from 'graphlibrary'
       edgeData.lineInterpolate = edge.interpolate
-    } else {
-      if (typeof edges.defaultInterpolate !== 'undefined') {
-        edgeData.lineInterpolate = edges.defaultInterpolate
-      }
+    } else if (typeof edges.defaultInterpolate !== 'undefined') {
+      edgeData.lineInterpolate = edges.defaultInterpolate
     }
@@ -185,0 +183,0 @@

src/diagrams/flowchart/parser/dot.js

@@ -1,2 +0,2 @@
-/* parser generated by jison 0.4.17 */
+/* parser generated by jison 0.4.18 */
 /*
@@ -149,9 +149,5 @@ Returns a Parser object of the following structure:
     } else {
-        function _parseError (msg, hash) {
-            this.message = msg;
-            this.hash = hash;
-        }
-        _parseError.prototype = Error;
-
-        throw new _parseError(str, hash);
+        var error = new Error(str);
+        error.hash = hash;
+        throw error;
     }
@@ -158,0 +154,0 @@ },

src/diagrams/flowchart/parser/flow.js

@@ -1,2 +0,2 @@
-/* parser generated by jison 0.4.17 */
+/* parser generated by jison 0.4.18 */
 /*
@@ -314,9 +314,5 @@ Returns a Parser object of the following structure:
     } else {
-        function _parseError (msg, hash) {
-            this.message = msg;
-            this.hash = hash;
-        }
-        _parseError.prototype = Error;
-
-        throw new _parseError(str, hash);
+        var error = new Error(str);
+        error.hash = hash;
+        throw error;
     }
@@ -323,0 +319,0 @@ },

src/diagrams/gantt/parser/gantt.js

@@ -1,2 +0,2 @@
-/* parser generated by jison 0.4.17 */
+/* parser generated by jison 0.4.18 */
 /*
@@ -121,9 +121,5 @@ Returns a Parser object of the following structure:
     } else {
-        function _parseError (msg, hash) {
-            this.message = msg;
-            this.hash = hash;
-        }
-        _parseError.prototype = Error;
-
-        throw new _parseError(str, hash);
+        var error = new Error(str);
+        error.hash = hash;
+        throw error;
     }
@@ -130,0 +126,0 @@ },

src/diagrams/gitGraph/gitGraphRenderer.js

@@ -7,2 +7,3 @@ import _ from 'lodash'
 import { logger } from '../../logger'
+import { interpolateToCurve } from '../../utils'
 
@@ -51,3 +52,3 @@ let allCommitsDict = {}
     .attr('requiredFeatures', 'http://www.w3.org/TR/SVG11/feature#Extensibility')
-    .append('xhtml:p')
+    .append('p')
     .html('')
@@ -57,6 +58,3 @@ }
 function svgDrawLine (svg, points, colorIdx, interpolate) {
-  let curve = d3.curveBasis
-  if (interpolate === 'linear') {
-    curve = d3.curveLinear
-  }
+  const curve = interpolateToCurve(interpolate, d3.curveBasis)
   const color = config.branchColors[colorIdx % config.branchColors.length]
@@ -79,2 +77,3 @@ const lineGen = d3.line()
 }
+
 // Pass in the element and its pre-transform coords
@@ -81,0 +80,0 @@ function getElementCoords (element, coords) {

src/diagrams/gitGraph/parser/gitGraph.js

@@ -1,2 +0,2 @@
-/* parser generated by jison 0.4.17 */
+/* parser generated by jison 0.4.18 */
 /*
@@ -148,9 +148,5 @@ Returns a Parser object of the following structure:
     } else {
-        function _parseError (msg, hash) {
-            this.message = msg;
-            this.hash = hash;
-        }
-        _parseError.prototype = Error;
-
-        throw new _parseError(str, hash);
+        var error = new Error(str);
+        error.hash = hash;
+        throw error;
     }
@@ -157,0 +153,0 @@ },

src/diagrams/sequenceDiagram/parser/sequenceDiagram.js

@@ -1,2 +0,2 @@
-/* parser generated by jison 0.4.17 */
+/* parser generated by jison 0.4.18 */
 /*
@@ -223,9 +223,5 @@ Returns a Parser object of the following structure:
     } else {
-        function _parseError (msg, hash) {
-            this.message = msg;
-            this.hash = hash;
-        }
-        _parseError.prototype = Error;
-
-        throw new _parseError(str, hash);
+        var error = new Error(str);
+        error.hash = hash;
+        throw error;
     }
@@ -232,0 +228,0 @@ },

src/diagrams/sequenceDiagram/sequenceDiagram.spec.js

 /* eslint-env jasmine */
 import { parser } from './parser/sequenceDiagram'
 import sequenceDb from './sequenceDb'
-import MyModuleInjector from 'inject-loader!./sequenceRenderer' // eslint-disable-line import/no-webpack-loader-syntax
+import renderer from './sequenceRenderer'
 
-let NewD3
-
-const d3 = {
-  select: function () {
-    return new NewD3()
-  },
-  selectAll: function () {
-    return new NewD3()
-  }
-}
-
-const renderer = MyModuleInjector({
-  'd3': d3
-})
-
 function addConf (conf, key, value) {
@@ -733,34 +718,2 @@ if (value !== undefined) {
 
-    delete global.mermaid_config
-
-    NewD3 = function () {
-      const o = {
-        append: function () {
-          return NewD3()
-        },
-        attr: function () {
-          return this
-        },
-        style: function () {
-          return this
-        },
-        text: function () {
-          return this
-        },
-        0: {
-          0: {
-            getBBox: function () {
-              return {
-                height: 10,
-                width: 20
-              }
-            }
-          }
-
-        }
-      }
-
-      return o
-    }
-
     conf = {
@@ -951,32 +904,2 @@ diagramMarginX: 50,
 
-    NewD3 = function () {
-      const o = {
-        append: function () {
-          return NewD3()
-        },
-        attr: function () {
-          return this
-        },
-        style: function () {
-          return this
-        },
-        text: function () {
-          return this
-        },
-        0: {
-          0: {
-            getBBox: function () {
-              return {
-                height: 10,
-                width: 20
-              }
-            }
-          }
-
-        }
-      }
-
-      return o
-    }
-
     conf = {
@@ -983,0 +906,0 @@ diagramMarginX: 50,

src/mermaid.js

@@ -9,6 +9,3 @@ /**
 import { logger } from './logger'
-import pkg from '../package.json'
 
-let nextId = 0
-
 /**
@@ -70,5 +67,2 @@ * ## init
 
-  if (typeof global.mermaid_config !== 'undefined') {
-    mermaidAPI.initialize(global.mermaid_config)
-  }
   logger.debug('Start On Load before: ' + mermaid.startOnLoad)
@@ -96,3 +90,3 @@ if (typeof mermaid.startOnLoad !== 'undefined') {
 
-    const id = 'mermaidChart' + nextId++
+    const id = `mermaid-${Date.now()}`
 
@@ -115,6 +109,2 @@ // Fetch the graph definition including tags
 
-const version = function () {
-  return 'v' + pkg.version
-}
-
 const initialize = function (config) {
@@ -140,22 +130,8 @@ logger.debug('Initializing mermaid')
   let config
-  // Check state of start config mermaid namespace
-  if (typeof global.mermaid_config !== 'undefined') {
-    if (global.mermaid_config.htmlLabels === false) {
-      mermaid.htmlLabels = false
-    }
-  }
 
   if (mermaid.startOnLoad) {
-    // For backwards compatability reasons also check mermaid_config variable
-    if (typeof global.mermaid_config !== 'undefined') {
-      // Check if property startOnLoad is set
-      if (global.mermaid_config.startOnLoad === true) {
-        mermaid.init()
-      }
-    } else {
-      // No config found, do check API config
-      config = mermaidAPI.getConfig()
-      if (config.startOnLoad) {
-        mermaid.init()
-      }
+    // No config found, do check API config
+    config = mermaidAPI.getConfig()
+    if (config.startOnLoad) {
+      mermaid.init()
     }
@@ -192,3 +168,2 @@ } else {
   initialize,
-  version,
 
@@ -195,0 +170,0 @@ contentLoaded

src/mermaid.spec.js

@@ -9,15 +9,4 @@ /* eslint-env jasmine */
   describe('when detecting chart type ', function () {
-    it('should not start rendering with mermaid_config.startOnLoad set to false', function () {
-      global.mermaid_config = { startOnLoad: false }
-
-      document.body.innerHTML = '<div class="mermaid">graph TD;\na;</div>'
-      spyOn(mermaid, 'init')
-      mermaid.contentLoaded()
-      expect(mermaid.init).not.toHaveBeenCalled()
-    })
-
     it('should not start rendering with mermaid.startOnLoad set to false', function () {
       mermaid.startOnLoad = false
-      global.mermaid_config = { startOnLoad: true }
-
       document.body.innerHTML = '<div class="mermaid">graph TD;\na;</div>'
@@ -31,3 +20,2 @@ spyOn(mermaid, 'init')
       mermaid.startOnLoad = true
-      global.mermaid_config = { startOnLoad: true }
       document.body.innerHTML = '<div class="mermaid">graph TD;\na;</div>'
@@ -39,3 +27,3 @@ spyOn(mermaid, 'init')
 
-    it('should start rendering with mermaid.startOnLoad set and no mermaid_config defined', function () {
+    it('should start rendering with mermaid.startOnLoad', function () {
       mermaid.startOnLoad = true
@@ -58,3 +46,2 @@ document.body.innerHTML = '<div class="mermaid">graph TD;\na;</div>'
     beforeEach(function () {
-      global.mermaid_config = { startOnLoad: false }
       flowParser.parser.yy = graphDb
@@ -61,0 +48,0 @@ graphDb.clear()

src/mermaidAPI.js

@@ -15,2 +15,3 @@ /**
 import * as d3 from 'd3'
+import scope from 'scope-css'
 
@@ -38,8 +39,7 @@ import { logger, setLogLevel } from './logger'
 import gitGraphAst from './diagrams/gitGraph/gitGraphAst'
-import pkg from '../package.json'
 
-import darkTheme from './less/dark/mermaid.less'
-import defaultTheme from './less/default/mermaid.less'
-import forestTheme from './less/forest/mermaid.less'
-import neutralTheme from './less/neutral/mermaid.less'
+import darkTheme from './themes/dark/index.scss'
+import defaultTheme from './themes/default/index.scss'
+import forestTheme from './themes/forest/index.scss'
+import neutralTheme from './themes/neutral/index.scss'
 
@@ -299,11 +299,2 @@ const themes = {
 
-/**
- * ## version
- * Function returning version information
- * @returns {string} A string containing the version info
- */
-export const version = function () {
-  return pkg.version
-}
-
 export const encodeEntities = function (text) {
@@ -437,3 +428,3 @@ let txt = text
       config.info.arrowMarkerAbsolute = config.arrowMarkerAbsolute
-      info.draw(txt, id, version())
+      info.draw(txt, id)
       break
@@ -445,13 +436,6 @@ }
   const s = document.createElement('style')
-  const cs = window.getComputedStyle(svg)
-  s.innerHTML = `
-  ${themes[config.theme] || defaultTheme}
-svg {
-  color: ${cs.color};
-  font: ${cs.font};
-}
-  `
+  s.innerHTML = scope(themes[config.theme] || defaultTheme, `#${id}`)
   svg.insertBefore(s, svg.firstChild)
 
-  d3.select('#d' + id).selectAll('foreignobject div').attr('xmlns', 'http://www.w3.org/1999/xhtml')
+  d3.select('#' + id).selectAll('foreignobject > *').attr('xmlns', 'http://www.w3.org/1999/xhtml')
 
@@ -484,20 +468,2 @@ let url = ''
 
-function render2 (id, text, cb, containerElement) {
-  try {
-    if (arguments.length === 1) {
-      text = id
-      id = 'mermaidId0'
-    }
-
-    if (typeof document === 'undefined') {
-      // Todo handle rendering serverside using phantomjs
-    } else {
-      // In browser
-      return render(id, text, cb, containerElement)
-    }
-  } catch (e) {
-    logger.error(e)
-  }
-}
-
 const setConf = function (cnf) {
@@ -538,3 +504,3 @@ // Top level initially mermaid, gflow, sequenceDiagram and gantt
 const mermaidAPI = {
-  render: render2,
+  render,
   parse,
@@ -541,0 +507,0 @@ initialize,

src/mermaidAPI.spec.js

@@ -7,3 +7,2 @@ /* eslint-env jasmine */
     beforeEach(function () {
-      delete global.mermaid_config
       document.body.innerHTML = ''
@@ -10,0 +9,0 @@ })

src/utils.js

@@ -1,2 +0,2 @@
-import { logger } from './logger'
+import * as d3 from 'd3'
 
@@ -39,3 +39,2 @@ /**
   if (text.match(/^\s*classDiagram/)) {
-    logger.debug('Detected classDiagram syntax')
     return 'classDiagram'
@@ -45,3 +44,2 @@ }
   if (text.match(/^\s*gitGraph/)) {
-    logger.debug('Detected gitGraph syntax')
     return 'gitGraph'
@@ -66,5 +64,15 @@ }
 
+const interpolates = {
+  basis: d3.curveBasis,
+  linear: d3.curveLinear,
+  cardinal: d3.curveCardinal
+}
+export const interpolateToCurve = (interpolate, defaultCurve) => {
+  return interpolates[interpolate] || defaultCurve
+}
+
 export default {
   detectType,
-  isSubstringInArray
+  isSubstringInArray,
+  interpolateToCurve
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Uses eval

Supply chain risk

Package uses eval() which is a dangerous function. This prevents the code from running in certain environments and increases the risk that the code may contain exploits or malicious behavior.

Found 2 instances in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Dev dependency count

20

decreased by-33.33%

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Total package byte prevSize

11726869

decreased by-4.88%

Dependency count

8

increased by14.29%

Number of package files

64

decreased by-20%

Lines of code

89438

decreased by-6.02%

Dependency changes

• + Addedscope-css@^1.0.5

• + Addedescaper@2.5.3(transitive)

• + Addedis-regexp@1.0.0(transitive)

• + Addedscope-css@1.2.1(transitive)

• + Addedslugify@1.6.6(transitive)

• + Addedstrip-css-comments@3.0.0(transitive)