baerrach / gatsby-remark-plantuml Goto Github PK

View Code? Open in Web Editor NEW

3.0 3.0 4.0 15.98 MB

Gatsby Remark parser for PlantUML code blocks

License: Other

Emacs Lisp 0.09% JavaScript 99.91%

gatsby-remark-plantuml's People

Contributors

Stargazers

Watchers

Forkers

tetsuyainfra kornysietsma andrewthauer bharatrajagopalan

gatsby-remark-plantuml's Issues

Japanese characters are garbled

@startuml
entity "オペレーター\noperators" as operators {
        * **operator_code**: char(10), AUTOINCREMENT
        --
        * **user_id**: bigserial [FK]
        * employee_number: integer, 共通社員番号
        * role: char, オペレーターの役職
        * type: char, L2L3振り分け
        is_leaving: boolean, default: false, 離席中かどうか
        notification_available_delay: boolean, default: true, 対応遅延時通知の ON/OFF
        notification_available_new: boolean, default: true, 新規入信通知の ON/OFF
        notification_available_response: boolean, default: true, 返信時通知の ON/OFF
        delay_notification_time: time, 遅延時通知時間
        max_acceptable_items: smallserial, default: 20, 受可上限値
        created_at: timestamp, default: CURRENT_TIMESTAMP
        updated_at: timestamp, default: CURRENT_TIMESTAMP
        deleted_at: timestamp, default: null
}
@enduml

Use DomUtils to find the svg element

The code hacks finding the svg element by assuming its the first element in the dom array.

        const svgElement = dom[0]

See #5 as this will generate a different dom structure and so must locate it correctly.

Really need to use DomUtils.findOne with a correct predicate.

Custom plantuml jar is relative to the installed plugin not the project

In versions before 0.6.0 you could specify a relative path for the jar file:plantumljar: "plantuml/plantuml.1.2020.17.jar"

In version 0.7.0 the path is resolved relative to the plugin's path, e.g. node_modules/gatsby-remark-plantuml so if you want a relative jar file you need to specify it as:

  plantumljar: "../../plantuml/plantuml.1.2020.17.jar"

It would be good if this were either documented, or changed to make it relative to the project itself - gatsby only gives a very unhelpful error message, so it's quite hard to work out why this isn't working.

The issue seems to be in the path.resolve call, which now is relative to __dirname

maxWidth option

Hello there,

it would be great to be able to specify a maxWidth option like in the gatsby-remark-images plugin. Large SVGs currently stretch beyond the size of the box I output my remark html to.

The plugin not working in Docker container

Hello everyone!
I can't run build of my project in the docker container.
I am seeing a floating bug during the build. Some diagrams are rendered and some fall with an error. This happens completely randomly.

error log

error [object Object] Cannot read property 'replace' of undefined


  TypeError: Cannot read property 'replace' of undefined
  
  - index.js:159 runplantuml
    [app]/[gatsby-remark-plantuml]/index.js:159:33
  
  - task_queues:94 processTicksAndRejections
    node:internal/process/task_queues:94:5
  
  - index.js:201 generateUmlAndUpdateNode
    [app]/[gatsby-remark-plantuml]/index.js:201:28

I used

docker base image

alpine3.10
alpine3.13
debian:buster
ubuntu:18.4

java

openjdk8
openjdk11
openjdk14

node.js

node:12
node:15

What am I doing wrong?

Configuring plantumljar doesn't work, and needs documentation

There is a syntax error in index.js at line 42:
this.planumljar = path.resolve(pluginOptions.plantumljar)
Should be plantumljar not planumljar

Also documentation for this would be good, I had to read the source to find it, and then have fun finding out why it doesn't work.

Links in plantuml don't seem to be rendered anymore

I am not sure when this happened, but I believe it is related to the upgrade of Gatsby to the latest version 2.31.1

Previously links in plantuml would appear with in the <svg/> tag as <a href=<link> xlink:href=link> when inspected on the browser page.

Now it just appears as <a xLinkHref= > which is the react specification - but this appears when I inspect the link on the browser dev console, which suggests that this is not being processed into the html spec by Gatsby

When I use the plantuml jar directly I get the original svg as before.

So my thoughts are

the plugin hasn't changed, (0.7.0)
the plugin is doing the right thing by converting the svg generated to React requirements, but for some reason Gatsby isn't processing this anymore and rendering the static html with the svg input provided.

I just wonder if this means that Gatsby bypasses the output returned by the plugin now and just takes it directly? Have others seen this issue?

an example of a plantuml diagram with a link: http://www.plantuml.com/plantuml/uml/SoWkIImgAStDuNBAJrBGjLDmpCbCJbMmKeYEJi_FJyz9rKlEprN8ICt9oO-DvN98pKi1gWK0

the link looks like this in regular plantuml rendered html

<a xmlns="http://www.w3.org/2000/svg" href="google.com" target="_top" title="google.com" xlink:actuate="onRequest" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="google.com" xlink:show="new" xlink:title="google.com" xlink:type="simple"><text fill="#0000FF" font-family="sans-serif" font-size="13" lengthAdjust="spacing" text-decoration="underline" textLength="30" x="35.5" y="66.3638">hello</text></a>

however on gatsby when inspect the link it shows up as below - and the link just behaves like text

<a class="bx--link Link-module--link--PAAZ2" xLinkHref="#manage_organization-on_success_manage_org_hierarchy-event-xml" target="_self" xLinkTitle="#manage_organization-on_success_manage_org_hierarchy-event-xml" xLinkActuate="onRequest" xLinkShow="new" xLinkType="simple"><text fill="#0000FF" font-family="IBM Plex Sans" font-size="13" lengthAdjust="spacing" text-decoration="underline" textLength="253" x="542.5" y="571.125">ON_SUCCESS_MANAGE_ORG_HIERARCHY</text></a>

I vaguely remember that links inside svg had href as an attribute in the a tag previously in the Gatsby rendered page when inspected them - so I am guessing something must have changed in Gatsby. Is the fixable in this plugin or should I raise an issue in the Gatsby GitHub repo?

handle raw dot format

Dot code like:

digraph G {
node [shape="box"]
A [label="hello",shape="circle"]
A->B->C
A->C
label="Title"
}

should be rendered.

maxWidth does not work because style attribute overrides it

See #1

You can see from the generated svg for max-width-option-overrides-svg-width-and-svg-height-but-viewbox-is-unaltered-1.html that it has a style attribute

 style="width:1196px;height:526px;"

Plugin needs to remove any width or height from the style attribute

Support plantuml server local installation

Running gatsby in a docker container makes the plantuml configuration not very easy.

Since there's this nice docker container (https://github.com/plantuml/plantuml-server) to run a local installation of plantuml server, would it be possible to add an extra configuration to convert the plantuml code using the URL http://localhost:8080/uml/SyfFKj2rKt3CoKnELR1Io4ZDoSa70000

Or maybe even better a configuration to specify a plantuml server base URL so it can be used either a local installation or the public URL (http://www.plantuml.com/plantuml/uml/SyfFKj2rKt3CoKnELR1Io4ZDoSa70000)

Build gets stuck when an image generation finishes early

To reproduce:

Input

Have this on one of the Markdown page for Gatsby:

@startuml
Bob -> Alice
@enduml

Steps

Clean up public and .cache folders
Run npm run develop or npm run build

Actual result

Build hangs with output:

$ npm run develop

> [email protected] develop /Users/...
> gatsby develop

success open and validate gatsby-configs - 0.038 s
success load plugins - 0.350 s
success onPreInit - 0.015 s
success initialize cache - 0.020 s
success copy gatsby files - 0.068 s
success onPreBootstrap - 0.025 s
success source and transform nodes - 0.121 s
success Add explicit types - 0.021 s
success Add inferred types - 0.129 s
success Processing types - 0.071 s
success building schema - 0.337 s
success createPages - 0.038 s
success createPagesStatefully - 0.038 s
success onPreExtractQueries - 0.014 s
success update schema - 0.033 s
success extract queries from components - 0.128 s
success write out requires - 0.039 s
success write out redirect data - 0.014 s
warn The icon(src/images/favicon.png) you provided to 'gatsby-plugin-manifest' is not square.
The icons we generate will be square and for the best results we recommend you provide a square icon.

success Build manifest and related icons - 0.198 s
success onPostBootstrap - 0.222 s
⠀
info bootstrap finished - 4.996 s
⠀
success run static queries - 0.024 s — 2/2 230.48 queries/second
warn code block or inline code language not specified in markdown. applying generic code block
⠇ run page queries — 7/8 47.83 queries/second

Tested with

version: "0.1.2"

Details

$ node -v
v10.16.3

$ npm -v
6.9.0

$ java -version
java version "1.8.0_221"
Java(TM) SE Runtime Environment (build 1.8.0_221-b11)
Java HotSpot(TM) 64-Bit Server VM (build 25.221-b11, mixed mode)

$ dot -V
dot - graphviz version 2.40.1 (20161225.0304)

$ grep -A10 gatsby-remark-plantuml package-lock.json 
    "gatsby-remark-plantuml": {
      "version": "0.1.2",
      "resolved": "https://registry.npmjs.org/gatsby-remark-plantuml/-/gatsby-remark-plantuml-0.1.2.tgz",
      "integrity": "sha512-cDvtF6luPnF+jnlgw4WvNnI4CdhODWu8WLr9QRyjauKpyF4rV04FXcv9R3dOMCpermJs1F2RVwCqDaTpmq79bw==",
      "requires": {
        "@babel/runtime": "^7.6.0",
        "@rauschma/stringio": "^1.4.0",
        "bluebird": "^3.5.1",
        "hasbin": "^1.2.3",
        "unist-util-visit": "^1.4.1"
      }

 $ grep -A190 \"gatsby\" package-lock.json 
    "gatsby": {
      "version": "2.15.28",
      "resolved": "https://registry.npmjs.org/gatsby/-/gatsby-2.15.28.tgz",
      "integrity": "sha512-D2TlJaPL9daCKJ7yU1T/BoebZM5uaEQo+2ojZwANgY72l/WIrqTCSXH+lGbaAZJFPdZEIUQfUBlnIWrvNapTzw==",
      "requires": {
        "@babel/code-frame": "^7.5.5",
        "@babel/core": "^7.6.2",
        "@babel/parser": "^7.6.2",
        "@babel/polyfill": "^7.6.0",
        "@babel/runtime": "^7.6.2",
        "@babel/traverse": "^7.6.2",
        "@gatsbyjs/relay-compiler": "2.0.0-printer-fix.4",
        "@hapi/joi": "^15.1.1",
        "@mikaelkristiansson/domready": "^1.0.9",
        "@pieh/friendly-errors-webpack-plugin": "1.7.0-chalk-2",
        "@reach/router": "^1.2.1",
        "@typescript-eslint/eslint-plugin": "^1.13.0",
        "@typescript-eslint/parser": "^1.13.0",
        "address": "1.1.2",
        "autoprefixer": "^9.6.1",
        "axios": "^0.19.0",
        "babel-core": "7.0.0-bridge.0",
        "babel-eslint": "^10.0.3",
        "babel-loader": "^8.0.6",
        "babel-plugin-add-module-exports": "^0.3.3",
        "babel-plugin-dynamic-import-node": "^1.2.0",
        "babel-plugin-remove-graphql-queries": "^2.7.10",
        "babel-preset-gatsby": "^0.2.17",
        "better-opn": "1.0.0",
        "better-queue": "^3.8.10",
        "bluebird": "^3.5.5",
        "browserslist": "3.2.8",
        "cache-manager": "^2.10.0",
        "cache-manager-fs-hash": "^0.0.7",
        "chalk": "^2.4.2",
        "chokidar": "3.1.1",
        "common-tags": "^1.8.0",
        "compression": "^1.7.4",
        "convert-hrtime": "^2.0.0",
        "copyfiles": "^1.2.0",
        "core-js": "^2.6.9",
        "cors": "^2.8.5",
        "css-loader": "^1.0.1",
        "debug": "^3.2.6",
        "del": "^5.1.0",
        "detect-port": "^1.3.0",
        "devcert-san": "^0.3.3",
        "dotenv": "^8.1.0",
        "eslint": "^5.16.0",
        "eslint-config-react-app": "^4.0.1",
        "eslint-loader": "^2.2.1",
        "eslint-plugin-flowtype": "^3.13.0",
        "eslint-plugin-graphql": "^3.1.0",
        "eslint-plugin-import": "^2.18.2",
        "eslint-plugin-jsx-a11y": "^6.2.3",
        "eslint-plugin-react": "^7.14.3",
        "eslint-plugin-react-hooks": "^1.7.0",
        "event-source-polyfill": "^1.0.8",
        "express": "^4.17.1",
        "express-graphql": "^0.9.0",
        "fast-levenshtein": "^2.0.6",
        "file-loader": "^1.1.11",
        "flat": "^4.1.0",
        "fs-exists-cached": "1.0.0",
        "fs-extra": "^8.1.0",
        "gatsby-cli": "^2.7.53",
        "gatsby-core-utils": "^1.0.12",
        "gatsby-graphiql-explorer": "^0.2.21",
        "gatsby-link": "^2.2.17",
        "gatsby-plugin-page-creator": "^2.1.23",
        "gatsby-react-router-scroll": "^2.1.11",
        "gatsby-telemetry": "^1.1.28",
        "glob": "^7.1.4",
        "got": "8.3.2",
        "graphql": "^14.5.8",
        "graphql-compose": "^6.3.5",
        "graphql-playground-middleware-express": "^1.7.12",
        "invariant": "^2.2.4",
        "is-relative": "^1.0.0",
        "is-relative-url": "^3.0.0",
        "is-wsl": "^2.1.1",
        "jest-worker": "^24.9.0",
        "json-loader": "^0.5.7",
        "json-stringify-safe": "^5.0.1",
        "lodash": "^4.17.15",
        "lokijs": "^1.5.7",
        "md5": "^2.2.1",
        "md5-file": "^3.2.3",
        "micromatch": "^3.1.10",
        "mime": "^2.4.4",
        "mini-css-extract-plugin": "^0.8.0",
        "mitt": "^1.1.3",
        "mkdirp": "^0.5.1",
        "moment": "^2.24.0",
        "name-all-modules-plugin": "^1.0.1",
        "normalize-path": "^2.1.1",
        "null-loader": "^0.1.1",
        "opentracing": "^0.14.4",
        "optimize-css-assets-webpack-plugin": "^5.0.3",
        "parseurl": "^1.3.3",
        "physical-cpu-count": "^2.0.0",
        "pnp-webpack-plugin": "^1.5.0",
        "postcss-flexbugs-fixes": "^3.3.1",
        "postcss-loader": "^2.1.6",
        "prompts": "^2.2.1",
        "prop-types": "^15.7.2",
        "raw-loader": "^0.5.1",
        "react-dev-utils": "^4.2.3",
        "react-error-overlay": "^3.0.0",
        "react-hot-loader": "^4.12.14",
        "redux": "^4.0.4",
        "redux-thunk": "^2.3.0",
        "semver": "^5.7.1",
        "shallow-compare": "^1.2.2",
        "sift": "^5.1.0",
        "signal-exit": "^3.0.2",
        "slash": "^3.0.0",
        "socket.io": "^2.3.0",
        "stack-trace": "^0.0.10",
        "string-similarity": "^1.2.2",
        "style-loader": "^0.23.1",
        "terser-webpack-plugin": "1.4.1",
        "true-case-path": "^2.2.1",
        "type-of": "^2.0.1",
        "url-loader": "^1.1.2",
        "util.promisify": "^1.0.0",
        "uuid": "^3.3.3",
        "v8-compile-cache": "^1.1.2",
        "webpack": "~4.41.0",
        "webpack-dev-middleware": "^3.7.1",
        "webpack-dev-server": "^3.8.1",
        "webpack-hot-middleware": "^2.25.0",
        "webpack-merge": "^4.2.2",
        "webpack-stats-plugin": "^0.3.0",
        "xstate": "^4.6.7",
        "yaml-loader": "^0.5.0"
      },

MacBook Pro (15-inch, 2019) 2,3 GHz Intel Core i9 16 GB 2400 MHz DDR4 Radeon Pro 560X 4 GB Intel UHD Graphics 630 1536 MB

MacOS X 10.14.6 (18G95)

Allow adding additional params for plantuml

It would be good to have two params for adding custom params for java plantuml so that one can pass in all the plantuml arguments are passed in either before or after the -jar plantuml.jar argument
e.g. plantuml-java-opts, plantuml-opts

I am currently working around this issue by using the JAVA_TOOLS environment option which will pass it by default to every java command but it is nicer to configure this as part of the project config
e.g.

export JAVA_TOOL_OPTIONS="-Dapple.laf.useScreenMenuBar=true -Dplantuml.include.path=${OMNICRON_WIKI_WORKSPACE}/src/plantuml/include:${OMNICRON_WIKI_WORKSPACE}/src/plantuml/:$HOME/git -DPLANTUML_LIMIT_SIZE=24384 -Xmx1024M"