From 1601140511b6ba40b7a74d4a554d5244780f80da Mon Sep 17 00:00:00 2001
From: Ashish Jain <ashishjain0512@gmail.com>
Date: Thu, 20 Jun 2024 15:39:57 +0200
Subject: [PATCH] #5237 Fix for broken cssCompiledStyles not iterable issue

---
 .../mermaid/src/diagrams/state/dataFetcher.js | 55 ++-----------------
 1 file changed, 4 insertions(+), 51 deletions(-)

diff --git a/packages/mermaid/src/diagrams/state/dataFetcher.js b/packages/mermaid/src/diagrams/state/dataFetcher.js
index cab2ff64d..e1bdb7d1f 100644
--- a/packages/mermaid/src/diagrams/state/dataFetcher.js
+++ b/packages/mermaid/src/diagrams/state/dataFetcher.js
@@ -161,63 +161,16 @@ function insertOrUpdateNode(nodes, nodeData, classes) {
 
   //Populate node style attributes if nodeData has classes defined
   if (nodeData.cssClasses) {
+    if (!Array.isArray(nodeData.cssCompiledStyles)) {
+      nodeData.cssCompiledStyles = [];
+    }
+
     nodeData.cssClasses.split(' ').forEach((cssClass) => {
       if (classes.get(cssClass)) {
         const classDef = classes.get(cssClass);
-        // classDef.styles.forEach((style) => {
-        //   nodeData.cssCompiledStyles += style + ',';
-        //   // Populate nodeData with style attributes specifically to be used by rough.js
-        //   if (style && style.startsWith('fill:')) {
-        //     nodeData.backgroundColor = style.replace('fill:', '');
-        //   }
-        //   if (style && style.startsWith('stroke:')) {
-        //     nodeData.borderColor = style.replace('stroke:', '');
-        //   }
-        //   if (style && style.startsWith('stroke-width:')) {
-        //     nodeData.borderWidth = style.replace('stroke-width:', '');
-        //   }
-
-        //   nodeData.cssStyles += style + ';';
-        // });
-
-        // classDef.textStyles.forEach((style) => {
-        //   nodeData.labelStyle += style + ';';
-        //   if (style && style.startsWith('fill:')) {
-        //     nodeData.labelTextColor = style.replace('fill:', '');
-        //   }
-        // });
         nodeData.cssCompiledStyles = [...nodeData.cssCompiledStyles, ...classDef.styles];
       }
     });
-    //Populate node style attributes if nodeData has classes defined
-    if (nodeData.cssStyles) {
-      // nodeData.cssStyles.split(' ').forEach((csStyle) => {
-      //   if (classes[cssClass]) {
-      //     classes[cssClass].styles.forEach((style) => {
-      //       // Populate nodeData with style attributes specifically to be used by rough.js
-      //       if (style && style.startsWith('fill:')) {
-      //         nodeData.backgroundColor = style.replace('fill:', '');
-      //       }
-      //       if (style && style.startsWith('stroke:')) {
-      //         nodeData.borderColor = style.replace('stroke:', '');
-      //       }
-      //       if (style && style.startsWith('stroke-width:')) {
-      //         nodeData.borderWidth = style.replace('stroke-width:', '');
-      //       }
-      //       nodeData.cssStyles += style + ';';
-      //     });
-      //     classes[cssClass].textStyles.forEach((style) => {
-      //       nodeData.labelStyle += style + ';';
-      //       if (style && style.startsWith('fill:')) {
-      //         nodeData.labelTextColor = style.replace('fill:', '');
-      //       }
-      //     });
-      //   }
-      // });
-    }
-    // nodeData.labelTextColor = '#ffffff';
-    // nodeData.labelStyle = 'color:#ffffff';
-    // nodeData.cssStyles = 'fill:#f77';
   }
   const existingNodeData = nodes.find((node) => node.id === nodeData.id);
   if (existingNodeData) {