bonafideduck/react-highlight-within-textarea

Offsets in long string

Closed this issue · 4 comments

I have a long string, multiple lines long, no spaces and the marked elements seem to drift to the right (I am highlighting 32c2).
Screenshot from 2021-03-27 22-18-23

Here is the string for testing:

Melody:o=3,b=900,d=4:32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.,32c2#.,32d5#.

Edit: Using a monospace font actually seems to help here...

How annoying. I'm sorry, but I probably won't be able to debug this any time soon.

Don't worry, at least it is documented.

Again, my workaround was a monospace font, that made it better for whatever reason, maybe I am now just lucky because the marked portions don't break over a line.

@stylesuxx , I have a preview of 2.0.0-alpha.8 available with sample code that should fix this. It is available on NPM.

Version 2.0.0 should fix this.