Page MenuHomePhabricator

Focusable node highlight for references in groups with custom labels is too large (it renders as if they didn't have custom labels)
Open, Needs TriagePublic

Description

Originally reported here: https://pl.wikipedia.org/wiki/Wikipedia:Kawiarenka/Kwestie_techniczne#c-MarMi_wiki-20230301170000-Uwaga_w_VE

For example, this reference, rendered as [f]: https://pl.wikipedia.org/w/index.php?title=Nowa_Gwinea&oldid=69752489#cite_ref-73

image.png (2×3 px, 678 KB)

(which is achieved with local customizations: https://pl.wikipedia.org/w/index.php?title=MediaWiki:Common.css&oldid=69734983#L-1067 and https://pl.wikipedia.org/wiki/MediaWiki:Cite_link_label_group-uwaga)

When editing in visual editor, it has a focusable highlight that is bigger than the reference itself:

image.png (2×3 px, 570 KB)

Because internally we render the text [uwaga 6] in the reference node, to improve behavior around text selection (CSS generated content is not selectable in browsers, if we don't render real content, the browser's selected text background will have gaps where references are):

image.png (2×3 px, 669 KB)