Hi,
I had some troubles with an editor inside a transformed div. The cursor position was wrong, not aligned with characters nor lines.
The transform uses translation and scaling.
Then I saw https://github.com/codemirror/CodeMirror/issues/2443
But I couldn’t find a workaround. I tried creating the editor in another div then moving it to the correct (transformed) one. I tried calling refresh after doing so. But nothing works.
I can’t think of anything else right now. Does anyone have an idea ?
There is no workaround. The kind of position measuring that CodeMirror does to determine where things are on the screen unfortunately doesn’t really work in transformed elements.
I… found something, even though I’m not especially proud of it I’ll share
it:
I got the parent’s composed transformation matrix (the parent doesn’t have
on itself, its ancestors have), got the inverse, applied it to the parent
and used zoom with the same value on the parent.
This sort of works on the limited tests I’ve done until now (10 minutes…)
I’ll see if it holds.
Argh! Didn’t know that zoom was non-standard and may even be removed from
all browsers…