Issue with selection highlight overlapping

v6
1

There is a condition in firefox where the highlight selection overlaps

codemirror-highlight-overlap
codemirror-highlight-overlap1919×286 35 KB

which seems due to this code in @codemirror/view → src/layer.ts → lines 138,139

return new RectangleMarker(className, left - base.left, top - base.top - C.Epsilon,
                               right - left, bottom - top + C.Epsilon)

where C.Epsilon is 0.01

When I remove the C.Epsilon modifications e.g. change the above code to this

return new RectangleMarker(className, left - base.left, top - base.top,
                               right - left, bottom - top)

then the overlap disappears.

I didn’t see any information on the purpose of C.Epsilon here when digging through git history. Could you explain its intent ? I’d like to create a PR but want to know the approach you’d prefer before doing so.

The above screenshot should be reproducible via my git repo here

2

It avoids gaps between the selection rectangles due to rounding and/or numeric imprecision.

Is your selection color transparent? You shouldn’t be able to see the overlap unless it is.

3

yes it’s transparent and I’d prefer to keep it that way.

Can we update the logic to clamp to the boundaries in order to avoid overlaps ? Or does that not work in some instances ?

4

It looks like the current code already assigns precisely equal vertical positions to adjacent blocks, and at least Chrome and Firefox Linux are able to draw those without rounding-error gaps at various zoom levels, so maybe the margins aren’t needed anymore. Attached patch drops them. We’ll see if that produces any complaints.

5

Well thanks much. I tested locally and this works as expected. I’ll be interested if equal vertical positions produce visual gaps - to learn why.

Also sorry for missing the comment above C.Epsilon.

6

You can clone the repository, run a build (npm install), and then copy the content of dist into your project’s node_modules/@codemirror/view/dist directory to test this. But since all I did was remove the epsilon, and you described already trying that, I don’t think it’ll give much new insights.