search

sandflow / imscJS

JavaScript library for rendering IMSC Text and Image Profile documents to HTML5
BSD 2-Clause "Simplified" License
83 stars 31 forks source link

Firefox bug with negative margins #247

Closed nigelmegitt closed 10 months ago

nigelmegitt commented 11 months ago

We use negative margins for correct positioning, but Firefox has a rendering bug when there's a negative margin at the end of an inline area. See https://github.com/bbc/imscJS/pull/21 (pull request) for details of the issue and the workaround.

https://bugzilla.mozilla.org/show_bug.cgi?id=1502610 is the Firefox bug ticket.

We can apply the same workaround as in the BBC fork here, at the risk that there may be small positioning errors.

nigelmegitt commented 11 months ago

Noting for posterity: the Firefox bug was raised almost exactly 5 years ago in October 2018; it only appears in imscJS when the per-character adjacent spans are merged together, which has other rendering benefits in some engines. The span merging was introduced in #216, in 2021.

An alternative potential fix is to avoid merging the span of the last character in the line, if using Firefox.

One way to implement that could be to setting a variable to 0 if not Firefox and 1 if Firefox, and subtracting that value from line.elements.length at https://github.com/sandflow/imscJS/blob/32d0767ba0830dbac984ff9584c45934b0b8cd45/src/main/js/html.js#L593 for example. (I have not tested that this specific change results in the behaviour I'm expecting)