When highlights are positioned outside the line box, they could get
hidden by a subsequent tile (because of its opaque background). As a
result, subpixel anti-aliasing gets disabled by Chrome.
Using `border-box` as the default `boxSizing` allows highlights to
always fit within the line (except if a styling like `margin` is
applied).
This allows us to use the presenter for all stages of the component
lifecycle rather than needing to wait until it is created.
Signed-off-by: Max Brunsfeld <maxbrunsfeld@gmail.com>
Previously, these measurements were always performed when the editor
component was mounted. This didn't work in situations where the
component was mounted in a non-visible state. This commit includes a
visibility check in the resize polling we were already doing, kicking
off the measurement process as soon as the editor is visible.
Previously, when the last highlight div was removed from the lines
layer, chunks of the lines would sometimes disappear. Since we've
discovered that giving the lines an opaque background doesn't help with
subpixel anti-aliasing anyway, I've found that rendering highlights on
their own layer behind the lines and making the lines layer transparent
avoids the arficacts.
Using the marker's id plus the decoration class can cause an error in
the event we apply a decoration with the same class twice to the same
marker. This is admittedly unlikely, but I think it's cleaner to just
allocate unique id's for decoration objects.
