refactor: remove non-null assertion operator

Remove the non-null assertion operator when possible from PR
https://github.com/mermaid-js/mermaid/pull/5468

docs/config/setup/modules/mermaidAPI.md

@@ -98,7 +98,7 @@ mermaid.initialize(config);
 
 #### Defined in
 
-[mermaidAPI.ts:635](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L635)
+[mermaidAPI.ts:634](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L634)
 
 ## Functions
 
@@ -129,7 +129,7 @@ Return the last node appended
 
 #### Defined in
 
-[mermaidAPI.ts:277](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L277)
+[mermaidAPI.ts:276](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L276)
 
 ---
 
@@ -155,7 +155,7 @@ the cleaned up svgCode
 
 #### Defined in
 
-[mermaidAPI.ts:223](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L223)
+[mermaidAPI.ts:222](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L222)
 
 ---
 
@@ -203,7 +203,7 @@ the string with all the user styles
 
 #### Defined in
 
-[mermaidAPI.ts:200](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L200)
+[mermaidAPI.ts:199](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L199)
 
 ---
 
@@ -256,7 +256,7 @@ Put the svgCode into an iFrame. Return the iFrame code
 
 #### Defined in
 
-[mermaidAPI.ts:254](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L254)
+[mermaidAPI.ts:253](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L253)
 
 ---
 
@@ -281,4 +281,4 @@ Remove any existing elements from the given document
 
 #### Defined in
 
-[mermaidAPI.ts:327](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L327)
+[mermaidAPI.ts:326](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L326)

packages/mermaid/src/diagrams/block/blockDB.ts

@@ -26,10 +26,11 @@ let classes: Map<string, ClassDef> = new Map();
  */
 export const addStyleClass = function (id: string, styleAttributes = '') {
   // create a new style class object with this id
-  if (!classes.has(id)) {
+  let foundClass = classes.get(id);
-    classes.set(id, { id: id, styles: [], textStyles: [] }); // This is a classDef
+  if (!foundClass) {
+    foundClass = { id: id, styles: [], textStyles: [] };
+    classes.set(id, foundClass); // This is a classDef
   }
-  const foundClass = classes.get(id)!;
   if (styleAttributes !== undefined && styleAttributes !== null) {
     styleAttributes.split(STYLECLASS_SEP).forEach((attrib) => {
       // remove any trailing ;
@@ -73,13 +74,13 @@ export const setCssClass = function (itemIds: string, cssClassName: string) {
     let foundBlock = blockDatabase.get(id);
     if (foundBlock === undefined) {
       const trimmedId = id.trim();
-      blockDatabase.set(trimmedId, { id: trimmedId, type: 'na', children: [] } as Block);
+      foundBlock = { id: trimmedId, type: 'na', children: [] } as Block;
-      foundBlock = blockDatabase.get(trimmedId);
+      blockDatabase.set(trimmedId, foundBlock);
     }
-    if (!foundBlock!.classes) {
+    if (!foundBlock.classes) {
-      foundBlock!.classes = [];
+      foundBlock.classes = [];
     }
-    foundBlock!.classes.push(cssClassName);
+    foundBlock.classes.push(cssClassName);
   });
 };
 
@@ -104,12 +105,9 @@ const populateBlockDatabase = (_blockList: Block[] | Block[][], parent: Block):
     if (block.type === 'column-setting') {
       parent.columns = block.columns || -1;
     } else if (block.type === 'edge') {
-      if (edgeCount.has(block.id)) {
+      const count = (edgeCount.get(block.id) ?? 0) + 1;
-        edgeCount.set(block.id, edgeCount.get(block.id)! + 1);
+      edgeCount.set(block.id, count);
-      } else {
+      block.id = count + '-' + block.id;
-        edgeCount.set(block.id, 1);
-      }
-      block.id = edgeCount.get(block.id)! + '-' + block.id;
       edgeList.push(block);
     } else {
       if (!block.label) {
@@ -120,17 +118,17 @@ const populateBlockDatabase = (_blockList: Block[] | Block[][], parent: Block):
           block.label = block.id;
         }
       }
-      const isCreatingBlock = !blockDatabase.has(block.id);
+      const existingBlock = blockDatabase.get(block.id);
 
-      if (isCreatingBlock) {
+      if (existingBlock === undefined) {
         blockDatabase.set(block.id, block);
       } else {
         // Add newer relevant data to aggregated node
         if (block.type !== 'na') {
-          blockDatabase.get(block.id)!.type = block.type;
+          existingBlock.type = block.type;
         }
         if (block.label !== block.id) {
-          blockDatabase.get(block.id)!.label = block.label;
+          existingBlock.label = block.label;
         }
       }
 
@@ -146,7 +144,7 @@ const populateBlockDatabase = (_blockList: Block[] | Block[][], parent: Block):
           blockDatabase.set(newBlock.id, newBlock);
           children.push(newBlock);
         }
-      } else if (isCreatingBlock) {
+      } else if (existingBlock === undefined) {
         children.push(block);
       }
     }

packages/mermaid/src/diagrams/class/classDb.ts

@@ -226,8 +226,9 @@ export const setCssClass = function (ids: string, className: string) {
     if (_id[0].match(/\d/)) {
       id = MERMAID_DOM_ID_PREFIX + id;
     }
-    if (classes.has(id)) {
+    const classNode = classes.get(id);
-      classes.get(id)!.cssClasses.push(className);
+    if (classNode) {
+      classNode.cssClasses.push(className);
     }
   });
 };
@@ -268,8 +269,8 @@ export const setLink = function (ids: string, linkStr: string, target: string) {
     if (_id[0].match(/\d/)) {
       id = MERMAID_DOM_ID_PREFIX + id;
     }
-    if (classes.has(id)) {
+    const theClass = classes.get(id);
-      const theClass = classes.get(id)!;
+    if (theClass) {
       theClass.link = utils.formatUrl(linkStr, config);
       if (config.securityLevel === 'sandbox') {
         theClass.linkTarget = '_top';

packages/mermaid/src/diagrams/class/classRenderer-v2.ts

@@ -44,14 +44,11 @@ export const addNamespaces = function (
   _id: string,
   diagObj: any
 ) {
-  const keys = [...namespaces.keys()];
+  log.info('keys:', [...namespaces.keys()]);
-  log.info('keys:', keys);
   log.info(namespaces);
 
   // Iterate through each item in the vertex object (containing all the vertices found) in the graph definition
-  keys.forEach(function (id) {
+  namespaces.forEach(function (vertex) {
-    const vertex = namespaces.get(id)!;
-
     // parent node must be one of [rect, roundedWithTitle, noteGroup, divider]
     const shape = 'rect';
 
@@ -89,16 +86,13 @@ export const addClasses = function (
   diagObj: any,
   parent?: string
 ) {
-  const keys = [...classes.keys()];
+  log.info('keys:', [...classes.keys()]);
-  log.info('keys:', keys);
   log.info(classes);
 
   // Iterate through each item in the vertex object (containing all the vertices found) in the graph definition
-  keys
+  [...classes.values()]
-    .filter((id) => classes.get(id)!.parent == parent)
+    .filter((vertex) => vertex.parent === parent)
-    .forEach(function (id) {
+    .forEach(function (vertex) {
-      const vertex = classes.get(id)!;
-
       /**
        * Variable for storing the classes for the vertex
        */

packages/mermaid/src/diagrams/flowchart/flowDb.ts

@@ -40,10 +40,9 @@ const sanitizeText = (txt: string) => common.sanitizeText(txt, config);
  * @param id - id of the node
  */
 export const lookUpDomId = function (id: string) {
-  const vertexKeys = vertices.keys();
+  for (const vertex of vertices.values()) {
-  for (const vertexKey of vertexKeys) {
+    if (vertex.id === id) {
-    if (vertices.get(vertexKey)!.id === id) {
+      return vertex.domId;
-      return vertices.get(vertexKey)!.domId;
     }
   }
   return id;
@@ -67,17 +66,18 @@ export const addVertex = function (
   }
   let txt;
 
-  if (!vertices.has(id)) {
+  let vertex = vertices.get(id);
-    vertices.set(id, {
+  if (vertex === undefined) {
+    vertex = {
       id,
       labelType: 'text',
       domId: MERMAID_DOM_ID_PREFIX + id + '-' + vertexCounter,
       styles: [],
       classes: [],
-    });
+    };
+    vertices.set(id, vertex);
   }
   vertexCounter++;
-  const vertex = vertices.get(id)!;
 
   if (textObj !== undefined) {
     config = getConfig();
@@ -210,17 +210,19 @@ export const updateLink = function (positions: ('default' | number)[], style: st
 
 export const addClass = function (ids: string, style: string[]) {
   ids.split(',').forEach(function (id) {
-    if (!classes.has(id)) {
+    let classNode = classes.get(id);
-      classes.set(id, { id, styles: [], textStyles: [] });
+    if (classNode === undefined) {
+      classNode = { id, styles: [], textStyles: [] };
+      classes.set(id, classNode);
     }
 
     if (style !== undefined && style !== null) {
       style.forEach(function (s) {
         if (s.match('color')) {
           const newStyle = s.replace('fill', 'bgFill').replace('color', 'fill');
-          classes.get(id)!.textStyles.push(newStyle);
+          classNode.textStyles.push(newStyle);
         }
-        classes.get(id)!.styles.push(s);
+        classNode.styles.push(s);
       });
     }
   });
@@ -257,11 +259,13 @@ export const setDirection = function (dir: string) {
  */
 export const setClass = function (ids: string, className: string) {
   for (const id of ids.split(',')) {
-    if (vertices.has(id)) {
+    const vertex = vertices.get(id);
-      vertices.get(id)!.classes.push(className);
+    if (vertex) {
+      vertex.classes.push(className);
     }
-    if (subGraphLookup.has(id)) {
+    const subGraph = subGraphLookup.get(id);
-      subGraphLookup.get(id)!.classes.push(className);
+    if (subGraph) {
+      subGraph.classes.push(className);
     }
   }
 };
@@ -305,8 +309,9 @@ const setClickFun = function (id: string, functionName: string, functionArgs: st
     argList.push(id);
   }
 
-  if (vertices.has(id)) {
+  const vertex = vertices.get(id);
-    vertices.get(id)!.haveCallback = true;
+  if (vertex) {
+    vertex.haveCallback = true;
     funs.push(function () {
       const elem = document.querySelector(`[id="${domId}"]`);
       if (elem !== null) {
@@ -331,7 +336,7 @@ const setClickFun = function (id: string, functionName: string, functionArgs: st
  */
 export const setLink = function (ids: string, linkStr: string, target: string) {
   ids.split(',').forEach(function (id) {
-    const vertex = vertices.get(id)!;
+    const vertex = vertices.get(id);
     if (vertex !== undefined) {
       vertex.link = utils.formatUrl(linkStr, config);
       vertex.linkTarget = target;
@@ -341,10 +346,7 @@ export const setLink = function (ids: string, linkStr: string, target: string) {
 };
 
 export const getTooltip = function (id: string) {
-  if (tooltips.has(id)) {
+  return tooltips.get(id);
-    return tooltips.get(id)!;
-  }
-  return undefined;
 };
 
 /**

packages/mermaid/src/diagrams/git/gitGraphAst.js

@@ -479,9 +479,7 @@ export const getCommits = function () {
   return commits;
 };
 export const getCommitsArray = function () {
-  const commitArr = [...commits.keys()].map(function (key) {
+  const commitArr = [...commits.values()];
-    return commits.get(key);
-  });
   commitArr.forEach(function (o) {
     log.debug(o.id);
   });

packages/mermaid/src/diagrams/git/gitGraphParserV2.spec.js

@@ -339,9 +339,7 @@ describe('when parsing a gitGraph', function () {
     expect(parser.yy.getCurrentBranch()).toBe('main');
     expect(parser.yy.getDirection()).toBe('LR');
     expect(parser.yy.getBranches().size).toBe(2);
-    const commit1 = commits.keys().next().value;
+    const [commit1, commit2, commit3] = commits.keys();
-    const commit2 = [...commits.keys()][1];
-    const commit3 = [...commits.keys()][2];
     expect(commits.get(commit1).branch).toBe('main');
     expect(commits.get(commit2).branch).toBe('branch');
     expect(commits.get(commit3).branch).toBe('main');
@@ -477,8 +475,7 @@ describe('when parsing a gitGraph', function () {
     expect(parser.yy.getCurrentBranch()).toBe('testBranch');
     expect(parser.yy.getDirection()).toBe('LR');
     expect(parser.yy.getBranches().size).toBe(2);
-    const commit1 = commits.keys().next().value;
+    const [commit1, commit2] = commits.keys();
-    const commit2 = [...commits.keys()][1];
     expect(commits.get(commit1).branch).toBe('main');
     expect(commits.get(commit1).parents).toStrictEqual([]);
     expect(commits.get(commit2).branch).toBe('testBranch');
@@ -502,10 +499,7 @@ describe('when parsing a gitGraph', function () {
     expect(parser.yy.getCurrentBranch()).toBe('main');
     expect(parser.yy.getDirection()).toBe('LR');
     expect(parser.yy.getBranches().size).toBe(2);
-    const commit1 = commits.keys().next().value;
+    const [commit1, commit2, commit3, commit4] = commits.keys();
-    const commit2 = [...commits.keys()][1];
-    const commit3 = [...commits.keys()][2];
-    const commit4 = [...commits.keys()][3];
     expect(commits.get(commit1).branch).toBe('main');
     expect(commits.get(commit1).parents).toStrictEqual([]);
     expect(commits.get(commit2).branch).toBe('testBranch');
@@ -552,8 +546,7 @@ describe('when parsing a gitGraph', function () {
     expect(parser.yy.getCurrentBranch()).toBe('testBranch');
     expect(parser.yy.getDirection()).toBe('LR');
     expect(parser.yy.getBranches().size).toBe(2);
-    const commit1 = commits.keys().next().value;
+    const [commit1, commit2] = commits.keys();
-    const commit2 = [...commits.keys()][1];
     expect(commits.get(commit1).branch).toBe('main');
     expect(commits.get(commit1).parents).toStrictEqual([]);
     expect(commits.get(commit2).branch).toBe('testBranch');
@@ -577,10 +570,7 @@ describe('when parsing a gitGraph', function () {
     expect(parser.yy.getCurrentBranch()).toBe('main');
     expect(parser.yy.getDirection()).toBe('LR');
     expect(parser.yy.getBranches().size).toBe(2);
-    const commit1 = commits.keys().next().value;
+    const [commit1, commit2, commit3, commit4] = commits.keys();
-    const commit2 = [...commits.keys()][1];
-    const commit3 = [...commits.keys()][2];
-    const commit4 = [...commits.keys()][3];
     expect(commits.get(commit1).branch).toBe('main');
     expect(commits.get(commit1).parents).toStrictEqual([]);
     expect(commits.get(commit2).branch).toBe('testBranch');
@@ -614,10 +604,7 @@ describe('when parsing a gitGraph', function () {
     expect(parser.yy.getCurrentBranch()).toBe('main');
     expect(parser.yy.getDirection()).toBe('LR');
     expect(parser.yy.getBranches().size).toBe(2);
-    const commit1 = commits.keys().next().value;
+    const [commit1, commit2, commit3] = commits.keys();
-    const commit2 = [...commits.keys()][1];
-    const commit3 = [...commits.keys()][2];
-
     expect(commits.get(commit1).branch).toBe('main');
     expect(commits.get(commit1).parents).toStrictEqual([]);
 

packages/mermaid/src/diagrams/pie/pieRenderer.ts

@@ -105,8 +105,8 @@ export const draw: DrawDefinition = (text, id, _version, diagObj) => {
     .attr('class', 'pieCircle');
 
   let sum = 0;
-  [...sections.keys()].forEach((key: string): void => {
+  sections.forEach((section) => {
-    sum += sections.get(key)!;
+    sum += section;
   });
   // Now add the percentage.
   // Use the centroid method to get the best coordinates.

packages/mermaid/src/diagrams/requirement/requirementRenderer.js

@@ -191,9 +191,13 @@ const drawRelationshipFromLayout = function (svg, rel, g, insert, diagObj) {
   return;
 };
 
+/**
+ * @param {Map<string, any>} reqs
+ * @param graph
+ * @param svgNode
+ */
 export const drawReqs = (reqs, graph, svgNode) => {
-  [...reqs.keys()].forEach((reqName) => {
+  reqs.forEach((req, reqName) => {
-    let req = reqs.get(reqName);
     reqName = elementString(reqName);
     log.info('Added new requirement: ', reqName);
 
@@ -236,9 +240,13 @@ export const drawReqs = (reqs, graph, svgNode) => {
   });
 };
 
+/**
+ * @param {Map<string, any>} els
+ * @param graph
+ * @param svgNode
+ */
 export const drawElements = (els, graph, svgNode) => {
-  [...els.keys()].forEach((elName) => {
+  els.forEach((el, elName) => {
-    let el = els.get(elName);
     const id = elementString(elName);
 
     const groupNode = svgNode.append('g').attr('id', id);

packages/mermaid/src/diagrams/sankey/sankeyDB.ts

@@ -48,11 +48,13 @@ class SankeyNode {
 const findOrCreateNode = (ID: string): SankeyNode => {
   ID = common.sanitizeText(ID, getConfig());
 
-  if (!nodesMap.has(ID)) {
+  let node = nodesMap.get(ID);
-    nodesMap.set(ID, new SankeyNode(ID));
+  if (node === undefined) {
-    nodes.push(nodesMap.get(ID)!);
+    node = new SankeyNode(ID);
+    nodesMap.set(ID, node);
+    nodes.push(node);
   }
-  return nodesMap.get(ID)!;
+  return node;
 };
 
 const getNodes = () => nodes;

packages/mermaid/src/diagrams/sequence/sequenceDb.ts

@@ -99,8 +99,11 @@ export const addActor = function (
     rectData: null,
     type: type ?? 'participant',
   });
-  if (state.records.prevActor && state.records.actors.has(state.records.prevActor)) {
+  if (state.records.prevActor) {
-    state.records.actors.get(state.records.prevActor)!.nextActor = id;
+    const prevActorInRecords = state.records.actors.get(state.records.prevActor);
+    if (prevActorInRecords) {
+      prevActorInRecords.nextActor = id;
+    }
   }
 
   if (state.records.currentBox) {
@@ -207,6 +210,7 @@ export const getDestroyedActors = function () {
   return state.records.destroyedActors;
 };
 export const getActor = function (id: string) {
+  // TODO: do we ever use this function in a way that it might return undefined?
   return state.records.actors.get(id)!;
 };
 export const getActorKeys = function () {

packages/mermaid/src/diagrams/state/stateDb.js

@@ -239,8 +239,6 @@ export const addState = function (
     }
   }
 
-  const doc2 = currentDocument.states.get(trimmedId);
-
   if (descr) {
     log.info('Setting state description', trimmedId, descr);
     if (typeof descr === 'string') {
@@ -253,6 +251,7 @@ export const addState = function (
   }
 
   if (note) {
+    const doc2 = currentDocument.states.get(trimmedId);
     doc2.note = note;
     doc2.note.text = common.sanitizeText(doc2.note.text, getConfig());
   }

packages/mermaid/src/mermaidAPI.ts

@@ -171,7 +171,7 @@ export const createCssStyles = (
   }
 
   // classDefs defined in the diagram text
-  if (!isEmpty(classDefs) && classDefs instanceof Map) {
+  if (classDefs instanceof Map) {
     const htmlLabels = config.htmlLabels || config.flowchart?.htmlLabels; // TODO why specifically check the Flowchart diagram config?
 
     const cssHtmlElements = ['> *', 'span']; // TODO make a constant
@@ -180,8 +180,7 @@ export const createCssStyles = (
     const cssElements = htmlLabels ? cssHtmlElements : cssShapeElements;
 
     // create the CSS styles needed for each styleClass definition and css element
-    for (const classId of classDefs!.keys()) {
+    classDefs.forEach((styleClassDef) => {
-      const styleClassDef = classDefs.get(classId)!;
       // create the css styles for each cssElement and the styles (only if there are styles)
       if (!isEmpty(styleClassDef.styles)) {
         cssElements.forEach((cssElement) => {
@@ -192,7 +191,7 @@ export const createCssStyles = (
       if (!isEmpty(styleClassDef.textStyles)) {
         cssStyles += cssImportantStyles(styleClassDef.id, 'tspan', styleClassDef.textStyles);
       }
-    }
+    });
   }
   return cssStyles;
 };