Links in mermaid diagrams result in broken images.

[gstamp]

If I add links in a kroki mermaid diagram using the click directive it fails to render the image.

graph TD
    user([User]) --> |Edits| owner_definition[Owner definition]
    click owner_definition "https://github.com/SEEK-Jobs/owners" "owners"

If I take that last line out it renders fine but obviously I don't get a clickable link.

I tried the same diagram in Try Kroki and it worked fine so I suspect the issue is somewhere in mkdocs-kroki-plugin.

[jgrigg]

Here's an example

[oniboni]

This plugin puts the images in markdown image notation (![Kroki](image-url)).

MkDocs then represents these images in img-tags, that do not support any dynamic actions or contents.

To support this, we would need to rework the current approach.

[b-bittner]

Could you please verify, if merged #46 fixed your problem too.

[wac2007]

I can't get it to work. Still building images with kroki but results in HTTP 400.

Using:

• mkdocs-kroki-plugin==0.7.0
• mkdocs-techdocs-core==1.3.2

Example generated url: https://kroki.io/mermaid/svg/eNorTi0sTc1LTnXJTEwvSszlcs8s8UlM0rWz8y7Kz860UggCyReXKBSl5qWkFmXmpXOBJYAKfFOLchMzU7ApgUrpIozxzE1MT4VqBYpCbIEJAwBJXC3f?

My repo: https://github.com/wac2007/awesome-docs

Update: Using local Kroki server works

#File: app-config.local.yaml
# Backstage override configuration for your local development environment
proxy:
  ### Example for how to add a proxy endpoint for the frontend.
  ### A typical reason to do this is to handle HTTPS and CORS for internal services.
  endpoints:
    '/kroki':
      target: 'http://kroki-core'
      changeOrigin: true

# File: docker-compose.yml
version: '3'
services:
  core:
    image: yuzutech/kroki
    environment:
      - KROKI_MERMAID_HOST=mermaid
      # - KROKI_BPMN_HOST=bpmn
      # - KROKI_EXCALIDRAW_HOST=excalidraw
      # - KROKI_WIREVIZ_HOST=wireviz
    ports:
      - '8000:8000'
  mermaid:
    image: yuzutech/kroki-mermaid
    ports:
      - '8002:8002'
  # bpmn:
  #   image: yuzutech/kroki-bpmn
  #   ports:
  #     - "8003:8003"
  # excalidraw:
  #   image: yuzutech/kroki-excalidraw
  #   ports:
  #     - "8004:8004"
  # wireviz:
  #   image: yuzutech/kroki-wireviz
  #   ports:
  #     - "8006:8006"

[b-bittner]

@wac2007 , I believe that the official/public kroki-render-server (kroki.io) is broken, because even their own examples won't work at the moment (and using a local one works fine).

Hint: this issue is for a specific kind of broken images (when rendered with embedded links), so please open a new issue for not related problems. (Don't be offended, it is just to keep the issues clean and separated in their own thread)

[oniboni]

Images with links now get XML errors because the namespace is not set by kroki-mermaid (xmlns:xlink="http://www.w3.org/1999/xlink" missing in svg tag).

Possible solutions:

• fix this, like the mermaid-live-editor does this + set target="_parent" in all links, so that they are not only opened in the image frame.
• remove all link tags

Both can be done easily with beautifylsoup4, but I do not know, If more dependencies are the right way to go.. :thinking: