Add different id generators

src/defaultConfig.js

@@ -119,6 +119,21 @@ const config = {
    */
   secure: ['secure', 'securityLevel', 'startOnLoad', 'maxTextSize'],
 
+  /**
+   * This option controls if the generated ids of nodes in the SVG are generated randomly or based on a seed.
+   * If set to false, the IDs are generated based on the current date and thus are not deterministic. This is the default behaviour.
+   *
+   *## Notes**: This matters if your files are checked into sourcecontrol e.g. git and should not change unless content is changed.
+   ***Default value: false**
+   */
+  deterministicIds: false,
+
+  /**
+   * This option is the optional seed for deterministic ids. if set to undefined but deterministicIds is true, a simple number iterator is used.
+   * You can set this attribute to base the seed on a static string.
+   */
+  deterministicIDSeed: undefined,
+
   /**
    * The object containing configurations specific for flowcharts
    */

src/mermaid.js

@@ -4,8 +4,8 @@
  */
 // import { decode } from 'he';
 import decode from 'entity-decode/browser';
-import mermaidAPI from './mermaidAPI';
 import { logger } from './logger';
+import mermaidAPI from './mermaidAPI';
 import utils from './utils';
 
 /**
@@ -78,6 +78,8 @@ const init = function() {
     mermaidAPI.updateSiteConfig({ gantt: mermaid.ganttConfig });
   }
 
+  const nextId = utils.initIdGeneratior(conf.deterministicIds, conf.deterministicIDSeed);
+
   let txt;
 
   for (let i = 0; i < nodes.length; i++) {
@@ -90,7 +92,7 @@ const init = function() {
       continue;
     }
 
-    const id = `mermaid-${Date.now()}`;
+    const id = `mermaid-${nextId()}`;
 
     // Fetch the graph definition including tags
     txt = element.innerHTML;

src/utils.js

@@ -1,3 +1,4 @@
+import { sanitizeUrl } from '@braintree/sanitize-url';
 import {
   curveBasis,
   curveBasisClosed,
@@ -12,9 +13,8 @@ import {
   curveStepBefore,
   select
 } from 'd3';
-import { logger } from './logger';
-import { sanitizeUrl } from '@braintree/sanitize-url';
 import common from './diagrams/common/common';
+import { logger } from './logger';
 // import cryptoRandomString from 'crypto-random-string';
 
 // Effectively an enum of the supported curve types, accessible by name
@@ -790,6 +790,15 @@ export const configureSvgSize = function(svgElem, height, width, useMaxWidth) {
   d3Attrs(svgElem, attrs);
 };
 
+export const initIdGeneratior = function(deterministic, seed) {
+  if (!deterministic) return () => Date.now();
+  const iterator = function() {
+    return this.count++;
+  };
+  iterator.seed = seed ? seed.length : 0;
+  return iterator;
+};
+
 export default {
   assignWithDepth,
   wrapLabel,