V4 mermaid makes screen go completely blank

bug

(mike qin) #1

Bug report

console-breadcrumbs.js:33 Error: Parse error on line 5:
...china/index.xml <br>(S3:something-downloads/c
-----------------------^
Expecting 'SEMI', 'NEWLINE', 'SPACE', 'EOF', 'GRAPH', 'DIR', 'TAGEND', 'TAGSTART', 'UP', 'DOWN', 'subgraph', 'end', 'SQE', 'PE', '-)', 'DIAMOND_STOP', 'MINUS', '--', 'ARROW_POINT', 'ARROW_CIRCLE', 'ARROW_CROSS', 'ARROW_OPEN', 'DOTTED_ARROW_POINT', 'DOTTED_ARROW_CIRCLE', 'DOTTED_ARROW_CROSS', 'DOTTED_ARROW_OPEN', '==', 'THICK_ARROW_POINT', 'THICK_ARROW_CIRCLE', 'THICK_ARROW_CROSS', 'THICK_ARROW_OPEN', 'PIPE', 'STYLE', 'LINKSTYLE', 'CLASSDEF', 'CLASS', 'CLICK', 'DEFAULT', 'NUM', 'PCT', 'COMMA', 'ALPHA', 'COLON', 'BRKT', 'DOT', 'PUNCTUATION', 'UNICODE_TEXT', 'PLUS', 'EQUALS', 'MULT', got 'PS'
    at Parser.parseError (/Users/mike/Library/Application Support/inkdrop/packages/mermaid/node_modules/mermaid/dist/webpack:/mermaid/src/diagrams/flowchart/parser/flow.js:314)
    at Parser.parseError [as parse] (/Users/mike/Library/Application Support/inkdrop/packages/mermaid/node_modules/mermaid/dist/webpack:/mermaid/src/diagrams/flowchart/parser/flow.js:384)
    at Object.parse [as getClasses] (/Users/mike/Library/Application Support/inkdrop/packages/mermaid/node_modules/mermaid/dist/webpack:/mermaid/src/diagrams/flowchart/flowRenderer.js:228)
    at Object.getClasses [as render] (/Users/mike/Library/Application Support/inkdrop/packages/mermaid/node_modules/mermaid/dist/webpack:/mermaid/src/mermaidAPI.js:383)
    at Mermaid.renderDiagram (/Users/mike/Library/Application Support/inkdrop/packages/mermaid/lib/index.js:56)
    at Mermaid.componentDidMount (/Users/mike/Library/Application Support/inkdrop/packages/mermaid/lib/index.js:27)
    at Vh (/Applications/Inkdrop.app/Contents/Resources/app.asar/node_modules/react-dom/cjs/react-dom.production.min.js:216)
    at Zh (/Applications/Inkdrop.app/Contents/Resources/app.asar/node_modules/react-dom/cjs/react-dom.production.min.js:220)
    at /Applications/Inkdrop.app/Contents/Resources/app.asar/node_modules/react-dom/cjs/react-dom.production.min.js:250
    at Object.exports.unstable_runWithPriority (/Applications/Inkdrop.app/Contents/Resources/app.asar/node_modules/scheduler/cjs/scheduler.production.min.js:18)
    at Fi (/Applications/Inkdrop.app/Contents/Resources/app.asar/node_modules/react-dom/cjs/react-dom.production.min.js:250)
    at Di (/Applications/Inkdrop.app/Contents/Resources/app.asar/node_modules/react-dom/cjs/react-dom.production.min.js:249)
    at Yh (/Applications/Inkdrop.app/Contents/Resources/app.asar/node_modules/react-dom/cjs/react-dom.production.min.js:248)
    at Xh (/Applications/Inkdrop.app/Contents/Resources/app.asar/node_modules/react-dom/cjs/react-dom.production.min.js:245)
    at qf (/Applications/Inkdrop.app/Contents/Resources/app.asar/node_modules/react-dom/cjs/react-dom.production.min.js:243)
    at Object.enqueueSetState (/Applications/Inkdrop.app/Contents/Resources/app.asar/node_modules/react-dom/cjs/react-dom.production.min.js:130)
    at Provider.E.setState (/Applications/Inkdrop.app/Contents/Resources/app.asar/node_modules/react/cjs/react.production.min.js:13)
    at /Applications/Inkdrop.app/Contents/Resources/app.asar/node_modules/react-redux/lib/components/Provider.js:65
    at dispatch (/Applications/Inkdrop.app/Contents/Resources/app.asar/node_modules/redux/lib/redux.js:220)
    at /Applications/Inkdrop.app/Contents/Resources/app.asar/node_modules/redux-thunk/lib/index.js:14
    at i (browser-main.js:4)
    at dispatch (/Applications/Inkdrop.app/Contents/Resources/app.asar/node_modules/redux/lib/redux.js:617)
    at browser-commons.js:1
console.(anonymous function) @ console-breadcrumbs.js:33

If you report an issue about a plugin, please check the author of the plugin:

  • If it’s a third-party plugin, report it on the GitHub Issue
  • If it’s an official plugin, report here
  • Make sure you are using the latest version of the plugin. You can update it with ipm update.

Info

  • Platform: (macOS/)
  • Platform version: (Mojave/10/16.04)
  • App Version: 4

Reproduce

Ran ipm update.

I think writing a parantheses in the mermaid node puts mermaid in an error state, which in v3 it would show up with error in the content. Now, the error state makes the screen go grey (in dark theme). Yes it’s 3rd party, but this didnt happen in v3. This has to do with how the client is handling mermaid errors.

with the inspector, I can see that ALL the content in html nodes in #app-container are completely deleted.

<body class="platform-darwin theme-default-dark-syntax theme-default-dark-ui theme-github-preview dimmable undetached">
    <div id="app-container"></div>
    <script>
      var qs = require('qs');
      var params = qs.parse(window.location.search.substring(1));
      var entry = params.entry || 'main';
      setTimeout(function () {
        var s = document.createElement('script');
        s.setAttribute('src', 'browser-' + entry + '.js');
        document.head.appendChild(s);

        var t = document.createElement('link');
        t.setAttribute('rel', 'stylesheet');
        t.setAttribute('type', 'text/css');
        t.setAttribute('href', entry + '.css');
        document.head.appendChild(t);
      }, 10);
    </script>
    <script src="./browser-commons.js"></script>
  

<div class="ui dimmer modals page"></div><div id="dvenfj"></div></body></html>

(Takuya Matsuyama) #2

Hi mike,

Thank you for reporting it.
Sorry for the late reply!

I could reproduce the problem. I guess you are right, it should handle mermaid’s errors. Will fix it.


(Takuya Matsuyama) #3

It should work with mermaid@2.0.2!
Try ipm update.


(James Seigel) #4

Fix worked for me as well.


(Takuya Matsuyama) #5

Hi @James_Seigel,

Thanks for letting me know!