Text disappear when text is split into lines only, and target
element does not contain any nested elements.
Splitting text with absolute position slightly changes the visual
appearance of the text. This was due to the fact that we used
offsetTop and offsetLeft, which do not have sub-pixel precision.
Now, we use getBoundingClientRect to determine the size and
position of split text nodes. This has a slight negative impact on
performance. But it prevents text from visibly shifting when it
is split/un-split.
Before
The characters shift around slightly when text is split/un-split
Fixes two issues with absolute position:
Text disappear when text is split into lines only, and target element does not contain any nested elements.
Splitting text with absolute position slightly changes the visual appearance of the text. This was due to the fact that we used
offsetTopandoffsetLeft, which do not have sub-pixel precision. Now, we usegetBoundingClientRectto determine the size and position of split text nodes. This has a slight negative impact on performance. But it prevents text from visibly shifting when it is split/un-split.Before
The characters shift around slightly when text is split/un-split
https://user-images.githubusercontent.com/8286271/172066517-d6a7fc1d-3046-425c-9f2d-edf02820134c.mov
After
No visible change when text is split/un-split
https://user-images.githubusercontent.com/8286271/172066524-d1afd0ca-056a-4ebc-ada3-8e7f7f9aa09b.mov