HomePhabricator

ve.ce.FocusableNode: Ignore children of elements using CSS column-count in…

Authored by matmarex.

Description

ve.ce.FocusableNode: Ignore children of elements using CSS column-count in Chrome

Chrome incorrectly measures children of nodes with columns [1], let's
just ignore them rather than render a possibly bizarre highlight. They
will usually not be positioned, because Chrome also doesn't position
them correctly [2] and so people avoid doing it.

Of course there are other ways to render a node outside the bounding
box of its parent, like negative margin. We do not handle these cases,
and the highlight may not correctly cover the entire node if that
happens. This can't be worked around without implementing CSS
layouting logic ourselves, which is not worth it.

We limit the change to Chrome and its likes by checking for support
for -webkit-column-count property first (with browser prefix). I ran
some crude performance measurements [3] on Firefox, IE 11 and Opera
12, and there's no noticeable change in any of them (testing on [4]).

Chrome runs much faster on nodes with columns inside (understandable,
as we entirely skip a lot of calculations in this case) and, which is
less understandable, also slightly faster on other nodes. (Trying to
unconditionally run the code in Firefox resulted in 2x performance
regression, so I didn't check further.)

[1] http://code.google.com/p/chromium/issues/detail?id=391271
[2] https://code.google.com/p/chromium/issues/detail?id=291616
[3] https://phabricator.wikimedia.org/P322
[4] https://en.wikipedia.org/wiki/The_Fighting_Temeraire

Bug: T52036
Change-Id: I4d0fae57ccb4017b080d4769660ed6b5e176287b

Details