diff --git a/cypress/platform/current.html b/cypress/platform/current.html
index 9e5267768..518fd5854 100644
--- a/cypress/platform/current.html
+++ b/cypress/platform/current.html
@@ -5,7 +5,7 @@
       rel="stylesheet"
     />
     <style>
-      body {background: white}
+      body {background: black}
       h1 { color: white;}
       .arrowheadPath {fill: red;}
 
@@ -17,17 +17,12 @@
   <body>
     <h1>info below</h1>
     <div style="display: flex;width: 100%; height: 100%">
-      <div class="mermaid" style="width: 100%; height: 100%">gantt
-        dateFormat  YYYY-MM-DD
-        axisFormat  %d/%m
-        title Adding GANTT diagram to mermaid
-        excludes weekdays 2014-01-10
-
-        apple :a, 2017-07-20, 1w
-        banana :crit, b, 2017-07-23, 1d
-        cherry :active, c, after b a, 1d
-
-
+      <div class="mermaid" style="width: 100%; height: 100%">
+        graph LR
+          a[gorillan vaggar]|b[apan hoppar]--> c --> d
+          subgraph "One Two"
+            a1-->a2-->a3
+          end
       </div>
 </div>
   <script src="./mermaid.js"></script>
diff --git a/src/diagrams/flowchart/flowDb.js b/src/diagrams/flowchart/flowDb.js
index a0162b3c9..ccd2fbbb3 100644
--- a/src/diagrams/flowchart/flowDb.js
+++ b/src/diagrams/flowchart/flowDb.js
@@ -102,7 +102,7 @@ export const addVertex = function(_id, text, type, style, classes) {
  * @param type
  * @param linktext
  */
-export const addLink = function(_start, _end, type, linktext) {
+export const addSingleLink = function(_start, _end, type, linktext) {
   let start = _start;
   let end = _end;
   if (start[0].match(/\d/)) start = MERMAID_DOM_ID_PREFIX + start;
@@ -127,6 +127,14 @@ export const addLink = function(_start, _end, type, linktext) {
   }
   edges.push(edge);
 };
+export const addLink = function(_start, _end, type, linktext) {
+  let i, j;
+  for (i = 0; i < _start.length; i++) {
+    for (j = 0; j < _end.length; j++) {
+      addSingleLink(_start[i], _end[j], type, linktext);
+    }
+  }
+};
 
 /**
  * Updates a link's line interpolation algorithm
@@ -490,6 +498,7 @@ export const indexNodes = function() {
 };
 
 export const getSubGraphs = function() {
+  console.warn(subGraphs);
   return subGraphs;
 };
 
diff --git a/src/diagrams/flowchart/parser/flow.jison b/src/diagrams/flowchart/parser/flow.jison
index ec67972cf..e3fd550ed 100644
--- a/src/diagrams/flowchart/parser/flow.jison
+++ b/src/diagrams/flowchart/parser/flow.jison
@@ -8,6 +8,7 @@
 %lex
 %x string
 %x dir
+%x vertex
 %%
 \%\%[^\n]*\n*           /* do nothing */
 ["]                     this.begin("string");
@@ -19,6 +20,7 @@
 "interpolate"         return 'INTERPOLATE';
 "classDef"            return 'CLASSDEF';
 "class"               return 'CLASS';
+"EPA"               return 'EPA';
 "click"               return 'CLICK';
 "graph"      {if(yy.lex.firstGraph()){this.begin("dir");}  return 'GRAPH';}
 "subgraph"            return 'subgraph';
@@ -94,6 +96,7 @@
 "<"                   return 'TAGSTART';
 ">"                   return 'TAGEND';
 "^"                   return 'UP';
+"\|"                   return 'SEP';
 "v"                   return 'DOWN';
 [A-Za-z]+             return 'ALPHA';
 "\\]"                 return 'TRAPEND';
@@ -247,7 +250,7 @@ spaceList
 
 statement
     : verticeStatement separator
-    { $$=$1}
+    { console.warn('finat vs', $1.nodes); $$=$1.nodes}
     | styleStatement separator
     {$$=[];}
     | linkStyleStatement separator
@@ -285,12 +288,15 @@ separator: NEWLINE | SEMI | EOF ;
 //         {$$ = [$1];yy.setClass($1,$3)}
 //    ;
 
-verticeStatement: verticeStatement link node { yy.addLink($1[0],$3[0],$2); $$ = $3.concat($1) }
-    |node { $$ = $1 }
+
+verticeStatement: verticeStatement link node { console.warn('vs',$1.stmt,$3); yy.addLink($1.stmt,$3,$2); $$ = { stmt: $3, nodes: $3.concat($1.nodes) } }
+    |node {console.warn('noda', $1); $$ = {stmt: $1, nodes:$1 }}
     ;
 
 node: vertex
-        { $$ = [$1];}
+        { console.warn('nod', $1);$$ = [$1];}
+    | node PIPE vertex
+        { $$ = [$1[0], $3]; console.warn('pip', $1, $3, $$); }
     | vertex STYLE_SEPARATOR idString
         {$$ = [$1];yy.setClass($1,$3)}
     ;
@@ -348,7 +354,7 @@ vertex:  idString SQS text SQE
     | idString SQS text TAGSTART spaceList
         {$$ = $1;yy.addVertex($1,$3,'odd_right');} */
     | idString
-        {$$ = $1;yy.addVertex($1);}
+        {console.warn('h: ', $1);$$ = $1;yy.addVertex($1);}
     | idString spaceList
         {$$ = $1;yy.addVertex($1);}
     ;
diff --git a/src/diagrams/flowchart/parser/subgraph.spec.js b/src/diagrams/flowchart/parser/subgraph.spec.js
index f08c6459e..bd97f154c 100644
--- a/src/diagrams/flowchart/parser/subgraph.spec.js
+++ b/src/diagrams/flowchart/parser/subgraph.spec.js
@@ -16,6 +16,7 @@ describe('when parsing subgraphs', function() {
     const subgraphs = flow.parser.yy.getSubGraphs();
     expect(subgraphs.length).toBe(1);
     const subgraph = subgraphs[0];
+
     expect(subgraph.nodes.length).toBe(2);
     expect(subgraph.nodes[0]).toBe('a2');
     expect(subgraph.nodes[1]).toBe('a1');
