Docker+Cypress, better run, removed unused syntax

Added cypress container (from their official image),
may be reconsidered later to choose our own
The only minor problem is node JS version mistmatch
package.json 18.16.0
docker-compose mermaid 18.16.1
docker-compose cypress 18.16.0

Host option in cypress docker container must be removed
in favor of possible configuration option.
http://localhost:9000 are currently hard-coded, that is bad

Updated ./run script with better documentation
and added some styles too it as well

Started sankey.spec.js as an example

cypress/integration/rendering/sankey.spec.js

@@ -11,4 +11,16 @@ describe('Sankey Diagram', () => {
       {}
     );
   });
+
+  describe('Changes link color', function () {
+    beforeAll(() => {
+      let conf = {
+        sankey: {
+          linkColor: 'source',
+        }
+      };
+  
+      mermaidAPI.initialize(conf);
+    });
+  });
 });

docker-compose.yml

@@ -16,6 +16,21 @@ services:
     ports:
       - 9000:9000
       - 3333:3333
+  cypress:
+    image: cypress/base:18.16.0
+    stdin_open: true
+    tty: true
+    working_dir: /mermaid
+    mem_limit: '2G'
+    environment:
+      - NODE_OPTIONS=--max_old_space_size=2048
+    volumes:
+      - ./:/mermaid
+      - root_cache:/root/.cache
+      - root_local:/root/.local
+      - root_npm:/root/.npm
+    network_mode: host
+
 volumes:
   root_cache:
   root_local:

packages/mermaid/src/diagrams/sankey/parser/sankey-arrow.jison

@@ -1,105 +0,0 @@
-/** mermaid */
-%lex
-TOKEN \w+
-NUM \d+(.\d+)?
-
-%options case-insensitive
-%options easy_keword_rules
-
-%s link_value
-
-%x attributes
-%x attr_value
-%x string
-
-%%
-//--------------------------------------------------------------
-// skip all whitespace EXCEPT newlines, but not within a string
-//--------------------------------------------------------------
-
-<INITIAL,link_value,attributes,attr_value>[^\S\r\n]+   {}
-
-//--------------
-// basic tokens
-//--------------
-
-(<<EOF>>|[\n;])+                            { return 'EOS'; } // end of statement is semicolon ; new line \n or end of file
-"sankey-beta"                               { return 'SANKEY'; }
-<INITIAL>{TOKEN}                            { return 'NODE_ID'; }
-<link_value>{NUM}                           { return 'AMOUNT'; }
-"->"                                        {
-                                              if(this.topState()!=='link_value') this.pushState('link_value');
-                                              else this.popState();
-                                              return 'ARROW';
-                                            }
-//------------
-// attributes
-//------------
-
-"["                                         { this.pushState('attributes'); return 'OPEN_ATTRIBUTES'; }
-<attributes>"]"                             { this.popState(); return 'CLOSE_ATTRIBUTES'; }
-<attributes>{TOKEN}                         { return 'ATTRIBUTE'; }
-<attributes>\=                              { this.pushState('attr_value'); return 'EQUAL'; }
-<attr_value>{TOKEN}                         { this.popState(); return 'VALUE'; }
-
-//------------
-// strings
-//------------
-
-<INITIAL,attributes,attr_value>\"           { this.pushState('string'); return 'OPEN_STRING'; }
-<string>(?!\\)\"                            {
-                                              if(this.topState()==='string') this.popState();
-                                              if(this.topState()==='attr_value') this.popState();
-                                              return 'CLOSE_STRING';
-                                            }
-<string>([^"\\]|\\\"|\\\\)+                 { return 'STRING'; }
-
-/lex
-
-%start start
-%left ARROW
-
-%% // language grammar
-
-start
-  : EOS SANKEY document
-  | SANKEY document
-  ;
-
-document
-  : line document
-  |
-  ;
-
-line
-  : node optional_attributes EOS
-  | stream optional_attributes EOS
-  | EOS
-  ;
-
-optional_attributes: OPEN_ATTRIBUTES attributes CLOSE_ATTRIBUTES | ;
-
-attributes: attribute attributes | ;
-attribute: ATTRIBUTE EQUAL value | ATTRIBUTE;
-
-value: VALUE | OPEN_STRING STRING CLOSE_STRING;
-
-stream
-  : node\[source] ARROW amount ARROW tail\[target] {
-      $$=$source;
-      yy.addLink($source, $target, $amount);
-    }
-  ;
-
-tail
-  : stream { $$ = $stream }
-  | node { $$ = $node; }
-    ;
-
-amount: AMOUNT { $$=parseFloat($AMOUNT); };
-
-node
-  : NODE_ID { $$ = yy.findOrCreateNode($NODE_ID); }
-  | OPEN_STRING STRING\[node_label] CLOSE_STRING { $$ = yy.findOrCreateNode($node_label); }
-  ;
-

packages/mermaid/src/diagrams/sankey/parser/sankey-arrow.spec.js

@@ -1,101 +0,0 @@
-// @ts-ignore: jison doesn't export types
-import sankey from './sankey-arrow.jison';
-import db from '../sankeyDB.js';
-
-describe('sankey-beta diagram', function () {
-  describe('when parsing an info graph it', function () {
-    beforeEach(function () {
-      sankey.parser.yy = db;
-      sankey.parser.yy.clear();
-    });
-
-    it('recognizes its type', () => {
-      const str = `sankey-beta`;
-
-      sankey.parser.parse(str);
-    });
-
-    it('recognizes one flow', () => {
-      const str = `
-      sankey-beta
-      node_a -> 30 -> node_b -> 20 -> node_c
-      `;
-
-      sankey.parser.parse(str);
-    });
-
-    it('recognizes multiple flows', () => {
-      const str = `
-      sankey-beta
-      node_a -> 30 -> node_b -> 12 -> node_e
-      node_c -> 30 -> node_d -> 12 -> node_e
-      node_c -> 40 -> node_e -> 12 -> node_q
-      `;
-
-      sankey.parser.parse(str);
-    });
-
-    it('parses node as a string', () => {
-      const str = `
-      sankey-beta
-      "node a" -> 30 -> "node b" -> 12 -> "node e"
-      "node c" -> 30 -> "node d" -> 12 -> "node e"
-      "node c" -> 40 -> "node e" -> 12 -> "node q"
-      `;
-
-      sankey.parser.parse(str);
-    });
-
-    describe('while attributes parsing', () => {
-      it('recognized node and attribute ids starting with numbers', () => {
-        const str = `
-        sankey-beta
-        1st -> 200 -> 2nd -> 180 -> 3rd;
-        `;
-
-        sankey.parser.parse(str);
-      });
-
-      it('parses different quotless variations', () => {
-        const str = `
-        sankey-beta
-        node[]
-        
-        node[attr=1]
-        node_a -> 30 -> node_b
-        node[attrWithoutValue]
-        node[attr = 3]
-        node[attr1 = 23413 attr2=1234]
-        node[x1dfqowie attr1 = 23413 attr2]
-        `;
-
-        sankey.parser.parse(str);
-      });
-
-      it('parses strings as values', () => {
-        const str = `
-        sankey-beta
-        node[title="hello, how are you?"]
-        node[title="hello, mister \\"sankey-beta\\", backslash for you \\\\"]
-        `;
-
-        sankey.parser.parse(str);
-      });
-
-      it('parses real example', () => {
-        const str = `
-        sankey-beta
-
-        "Agricultural 'waste'"      ->      124.729  -> "Bio-conversion"
-        "Bio-conversion"            ->      0.597    -> "Liquid"
-        "Bio-conversion"            ->      26.862   -> "Losses"
-        "Bio-conversion"            ->      280.322  -> "Solid"
-        "Bio-conversion"            ->      81.144   -> "Gas"
-        "Biofuel imports"           ->      35       -> "Liquid"
-        `;
-
-        sankey.parser.parse(str);
-      });
-    });
-  });
-});

run

@@ -1,6 +1,13 @@
 #!/bin/bash
 RUN="docker-compose run --rm"
 
+ansi()          { echo -e "\e[${1}m${*:2}\e[0m"; }
+bold()          { ansi 1 "$@"; }
+# italic()        { ansi 3 "$@"; }
+underline()     { ansi 4 "$@"; }
+# strikethrough() { ansi 9 "$@"; }
+# red()           { ansi 31 "$@"; }
+
 name=$(basename $0)
 command=$1
 args=${@:2}
@@ -12,7 +19,7 @@ $RUN mermaid sh -c "npx $args"
 ;;
 
 pnpm)
-$RUN mermaid sh -c "npx $command $args"
+$RUN mermaid sh -c "npx pnpm $args"
 ;;
 
 dev)
@@ -23,43 +30,53 @@ docs:dev)
 $RUN --service-ports mermaid sh -c "cd packages/mermaid/src/docs && npx pnpm prefetch && npx vitepress --port 3333 --host"
 ;;
 
+cypress)
+$RUN cypress npm run cypress $args
+;;
+
 help)
 
 # Alignment of help message must be as it is, it will be nice looking when printed
 usage=$(
 cat <<EOF
 
-Welcome to Mermaid Local Docker Development
+$(bold MERMAID LOCAL DOCKER DEVELOPMENT)
-Script for runnign commands within docker containers.
+
+Welcome! Thank you for joining development.
+This is a script for running commands within docker containers at ease.
 __________________________________________________________________________________________
 
-\033[1mDevelopment quick start guide\033[0m:
+Development quick start guide:
 
-\033[1m$name pnpm install\033[0m            # Install packages
+$(bold ./$name pnpm install)                 # Install packages
-\033[1m$name dev\033[0m                     # Run dev server with examples, open http://localhost:9000
+$(bold ./$name dev)                          # Run dev server with examples, open http://localhost:9000
-\033[1m$name pnpm build\033[0m              # Prepare it for production
+$(bold ./$name pnpm vitest)                  # Run watcher for unit tests
-\033[1m$name docs:dev\033[0m                # Then add documentation, open http://localhost:3333
+$(bold ./$name cypress)                      # Run integration tests (after starting dev server)
+$(bold ./$name pnpm build)                   # Prepare it for production
+$(bold ./$name docs:dev)                     # Then add documentation, open http://localhost:3333
 __________________________________________________________________________________________
 
 Commands:
 
-$name pnpm                    # Run any 'pnpm' command
+$(bold ./$name pnpm)                         # Run any 'pnpm' command
-$name dev                     # Run dev server with examples, open http://localhost:9000
+$(bold ./$name dev)                          # Run dev server with examples, open http://localhost:9000
-$name docs:dev                # For docs contributions, open http://localhost:3333
+$(bold ./$name docs:dev)                     # For docs contributions, open http://localhost:3333
-
+$(bold ./$name cypress)                      # Run integration tests
-$name sh                      # Open 'sh' inside docker container for development
+$(bold ./$name sh)                           # Open 'sh' inside docker container for development
-
+$(bold ./$name help)                         # Show this help
-$name help                    # Show this help
 __________________________________________________________________________________________
 
 Examples of frequiently used commands:
 
-$name pnpm add                # Add package, 'run add d3-sankey'
+$(bold ./$name pnpm add --filter mermaid) $(underline package)
-$name pnpm prettier --write   # Prettify a file 'run prettier <path-to-file>', e.g.:
+        Add package to mermaid
-                            #   'git diff --name-only develop | xargs run pnpm prettier --write'
+
-$name pnpm test               # Run unit tests
+$(bold git diff --name-only develop \| xargs ./$name pnpm prettier --write)
-$name pnpm vitest             # Run watcher for unit tests
+        Prettify everything you added so far
-$name pnpm e2e                # Run integration tests
+
+$(bold ./$name cypress run -- --spec cypress/integration/rendering/)$(underline test.ts)
+        Run specific test in cypress\n
+
 EOF
 )