search

PrismJS / prism

Lightweight, robust, elegant syntax highlighting.
https://prismjs.com
MIT License
12.11k stars 1.27k forks source link

Highlight & annotation alignement drift issue on Chrome #1298

Open svalat opened 6 years ago

svalat commented 6 years ago

Hi, I'm using the highlight plugin and a derivated plugin (annotator : https://github.com/memtt/malt/blob/11f2e71dedc024eb66d8d26da26e9e48097d6352/src/webview/client-files/app/js/prism.js#L889) to annotate the source code.

It works well on firefox but on chrome the annotation and highlight are missaligned as you can see on the picture. For showing the issue I printed the line number in the annotation instead of the real content and we clearly see they are miss-aligned. Any idea ? I tried to play with the isLineHeightRounded funciton without any success. There is a small drift because the annotation at the top of the file are well placed, I start to see a one line shift after ~250 lines.

capture du 2018-02-16 13-28-00

Cheers.

Golmote commented 6 years ago

Hi! Could you provide an online example reproducing the issue so that we can investigate?

svalat commented 6 years ago

Sure I will make one.

mAAdhaTTah commented 6 years ago

@svalat Any chance you could provide a repo case here?

svalat commented 6 years ago

Ok, I made a reproducer here : https://jsfiddle.net/kkaubxf1/

But, I searched a lot to understand how to reproduce it. It was not the case out of my app. I finally saw that my page was zoomed on my app (don't know why chrome remembered I zoomed on that page a long time ago).

By default it workds. The bug appear only if you zoom on the page. On firefox it is OK. On chrome not.