Making it possible to have style/% in class definitions as described …

…in issue #54
mermaid-js · Jan 8, 2015 · 9527237 · 9527237
1 parent 5a720b6
commit 9527237
Show file tree

Hide file tree

Showing 8 changed files with 37 additions and 17 deletions.
diff --git a/dist/mermaid.full.js b/dist/mermaid.full.js
diff --git a/dist/mermaid.full.min.js b/dist/mermaid.full.min.js
diff --git a/dist/mermaid.slim.js b/dist/mermaid.slim.js
diff --git a/dist/mermaid.slim.min.js b/dist/mermaid.slim.min.js
diff --git a/src/diagrams/flowchart/parser/flow.jison b/src/diagrams/flowchart/parser/flow.jison
@@ -341,7 +341,7 @@ style: styleComponent
     {$$ = $1 + $2;}
     ;
 
-styleComponent: ALPHA | COLON | MINUS | NUM | UNIT | SPACE | HEX | BRKT | DOT;
+styleComponent: ALPHA | COLON | MINUS | NUM | UNIT | SPACE | HEX | BRKT | DOT | STYLE | PCT ;
 
 /* Token lists */
 

diff --git a/src/diagrams/flowchart/parser/flow.js b/src/diagrams/flowchart/parser/flow.js
diff --git a/src/diagrams/flowchart/parser/flow.spec.js b/src/diagrams/flowchart/parser/flow.spec.js
@@ -288,6 +288,26 @@ describe('when parsing ',function(){
         expect(edges[0].type).toBe('arrow');
     });
 
+    it('should handle classDefs with style in classes',function(){
+        var res = flow.parser.parse('graph TD\nA-->B\nclassDef exClass font-style:bold;');
+
+        var vert = flow.parser.yy.getVertices();
+        var edges = flow.parser.yy.getEdges();
+
+
+        expect(edges[0].type).toBe('arrow');
+    });
+
+    it('should handle classDefs with % in classes',function(){
+        var res = flow.parser.parse('graph TD\nA-->B\nclassDef exClass fill:#f96,stroke:#333,stroke-width:4px,font-size:50%,font-style:bold;');
+
+        var vert = flow.parser.yy.getVertices();
+        var edges = flow.parser.yy.getEdges();
+
+
+        expect(edges[0].type).toBe('arrow');
+    });
+
     describe("it should handle text on edges",function(){
         it('it should handle text without space',function(){
             var res = flow.parser.parse('graph TD;A--x|textNoSpace|B;');

diff --git a/test/web.html b/test/web.html
@@ -56,7 +56,7 @@ <h1>Sub graphs</h1>
             cyr[Cyrillic]-->cyr2((Circle shape Начало))
         end
         classDef green fill:#9f6,stroke:#333,stroke-width:2px;
-        classDef orange fill:#f96,stroke:#333,stroke-width:4px;
+        classDef orange fill:#f96,stroke:#333,stroke-width:4px,font-size:50%,font-style:bold;
         class sq,e green
         class di orange
     </div>