search

aidam38 / roamsr

Spaced Repetition in Roam Research
https://roamresearch.com/#/app/roam-depot-developers/page/uQSCwVKx0
98 stars 18 forks source link

Code is not properly displayed after clicking "Show Answer" because CodeMirror doesnt work with "display:none" #13

Closed LuccaHellriegel closed 3 years ago

LuccaHellriegel commented 3 years ago

TL;DR: if possible switch the hiding method from "display:none" to "visibility: hidden", because otherwise code-blocks are rendered wrong

Hi!

First of all, thanks for your plugin. I really want to use it, but I stumbled upon a bug with displaying an answer that includes code.

image

I did a little digging in your code-base and I found the problem. In "roamsr.showAnswerAndCloze" you use "display:none" to hide the answer-block. This is not possible with a code-block because CodeMirror (the editor that Roam uses) does need the elements width, height etc. to properly display the editor.

See: https://github.com/codemirror/CodeMirror/issues/61

There is two solutions to this problem:

  1. Roam extends their API so you can refresh the CodeMirror instance (unlikely and 2. is easier)
  2. Switch hiding-method from "display:none" to "visibility:hidden" (works if I switch the css live with code-blocks and with text-blocks)

All the best, Lucca