Mermaid rendering problem / SVG foreignObject

[papylhomme]

Hello,

I was playing with the chrome inspector to style mermaid diagrams and I’ve found a bug, likely in your current Electron version : SVG node foreignObject does not render its content when using attribute position="fixed"

Steps to reproduce

Try to render a user journey diagram from the mermaid docs

journey
    title My working day
    section Go to work
      Make tea: 5: Me
      Go upstairs: 3: Me
      Do work: 1: Me, Cat
    section Go home
      Go downstairs: 5: Me
      Sit down: 5: Me

Expected result

The rendered diagram with text nodes. Colors problems are fine, I can deal with them using CSS.

Actual result

The diagram is rendered but without text nodes. This isn’t a color problem but likely a bug with the SVG rendering engine (see screenshots)

Chromium 88.0.4324.96 display this correctly.

Environment

• Operating system: Linux

• Obsidian version: 0.11.0

---

Additional information

• Current behavior, foreignObject has position="fixed", no text is rendered, and using the inspector we can see when hovering the children that there is no rendered box
  

  

• Fixed by manually removing the attribute
  

  

• The SVG is rendered by chromium correctly even with the attribute
  

  

[WhiteNoise]

Not sure which installer build do you have it installed. We are using electron 11.2. in 0.11. Anyway, if this fixed has been fixed in chrome 88, we will get it once electron 12 is rolled out.

[papylhomme]

I’m running ArchLinux and Obsidian is installed via AUR, relevant package came from

pkgname="${_pkgname}"-appimage
pkgver=0.11.0
_appimage="${pkgname}-${pkgver}.AppImage"
source_x86_64=("${_appimage}::https://github.com/obsidianmd/obsidian-releases/releases/download/v${pkgver}/Obsidian-${pkgver}.AppImage")

Understood for the Electron update, any ETA for this to happen ?

[WhiteNoise]

when electron 12 will be officially released, we will update within 3 weeks.

[papylhomme]

Ok, wait & see In the meantime I played a bit with VSCode and a mermaid extension, everything is working as intended. Is there a way to check the Electron version from the inspector ?
The rendering seems to be handled differently though, I can’t navigate to the SVG nodes in the inspector.

[WhiteNoise]

Will be fixed in 0.12.5