1730344 - TwitterColorEmoji-SVGinOT.ttf v13.1 causes text clippings

Status: RESOLVED DUPLICATE of bug 1729937

(Core :: Web Painting, defect)

Description

[Fanolian]

Attachment: Twitter emoji text clip.png

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:94.0) Gecko/20100101 Firefox/94.0
Build ID: 20210911095121

Requirements

1. Twitter Color Emoji SVGinOT Font
2. Reddit Enhancement Suite (RES)
3. A Reddit account. A brand-new throwaway account is sufficient.
4. Browser content window width larger than ~1400px.

OS info

VGA: Nvidia GTX 760 driver v471.96 (last available official driver outside of critical security updates)
Windows 10 Pro 21H1 latest update
Resolution: 1920×1080 100% scale (2 monitors; reproducible on both)
Text size: 112% (Windows Settings > Ease of Access > Display > Make text bigger)

Steps to reproduce

1. Install TwitterColorEmoji-SVGinOT.ttf v13.1 on a Win10 machine. The font is in TwitterColorEmoji-SVGinOT-Win-13.1.0.zip.
2. In a new Nightly profile, make Twitter Color Emoji as the default emoji font, i.e. go to about:config -> edit font.name-list.emoji to Twitter Color Emoji, Segoe UI Emoji, Twemoji Mozilla.
3. Widen Nightly's window width to >1400px.
4. Install RES in Nightly.
5. Go to this Reddit link. It opens a Reddit page and RES settings.
6. In RES settings, enable Appearance > Style Tweaks > Highlight Top Level. Also change Highlight Top Level Size to 5.
7. Save RES options by clicking the save button on the top right corner of the settings panel. Close the panel.
8. After returning to the Reddit page, log in to Reddit.
9. In that Reddit page, scroll down to the bottom and observe the very last comment with an emoji.

Actual result

The comment text is clipped. Highlighting the text make it re-appear.
If I scroll up far enough and go back to the comment, text is clipped again.
If window width is small enough (~1350px according to devtool's ruler), the text does not clip.

Expected result

No clippings.

Additional notes

I cannot further simplify the STR. I don't know why I must be logged in to Reddit in order to reproduce the bug. Perhaps RES adds something more when it's logged in.
I cannot reproduce the bug with Nightly's Twemoji Mozilla v0.6.0 which also supports Twemoji 13.1.
As for RES's Highlight Top Level Size, I can reproduce the bug with width 3/4/5 but not the default 2. I also tried 6/10 but they don't cause clippings.

Regression

Last good Nightly: 2021-09-09
First bad Nightly: 2021-09-10
pushlog: https://hg.mozilla.org/mozilla-central/pushloghtml?fromchange=5cc4755ad6d80428ca73070190ab9f51583a7360&tochange=ede86e9e0fdb5162502ddf301e992800d6a84ea1

Bisecting autoland builds:
https://hg.mozilla.org/integration/autoland/pushloghtml?fromchange=b85a93f770e3d692b2fcf85f26ff38966f79338e&tochange=c5b71e6ce0e5a9711f5cb682022e6d549a063257

Comment 1

[Fanolian]

Attachment: about_support.txt

My about:support for that profile.

Comment 2

[Fanolian]

Attachment: Screencast of text clipping.mp4

Video showcasing the bug on my machine.

Comment 3

[Fanolian]

Regression
Bisecting autoland builds:
https://hg.mozilla.org/integration/autoland/pushloghtml?fromchange=b85a93f770e3d692b2fcf85f26ff38966f79338e&tochange=c5b71e6ce0e5a9711f5cb682022e6d549a063257

All bugs in the range are temporarily backed out by this changeset. This bug is currently not reproducible in 2021-09-12 build onwards.

I am keeping the NI and this bug opened so :mattwoodrow may keep an eye on it when those bugs are relanded.

Comment 4

[Fanolian]

(In reply to Fanolian from comment #3)

All bugs in the range are temporarily backed out by this changeset. This bug is currently not reproducible in 2021-09-12 build onwards.

I am keeping the NI and this bug opened so :mattwoodrow may keep an eye on it when those bugs are relanded.

This bug is back now that those 5 out of 7 of the bugs have been re-landed on 2021-09-13 build.
New regression range: https://hg.mozilla.org/integration/autoland/pushloghtml?fromchange=eb592f79b7982217a439f7d32da52df9a40c334a&tochange=e8a29c8f1e095884077d52166404a854fba86280

Suspect: bug 1542929, bug 1728050, bug 1728232, bug 1728251, bug 1729236.

Comment 5

[Fanolian]

Attachment: testcase.html

As it turns out, this bug is easy to reproduce with a simple file (at least on my machine).
It has nothing to do with Reddit or RES.

UPDATED Steps to reproduce

1. Install TwitterColorEmoji-SVGinOT.ttf v13.1 on a Win10 machine. The font can be found at TwitterColorEmoji-SVGinOT-Win-13.1.0.zip.
2. Open the attached testcase. (It has already specified Twitter Color Emoji as the font. No need to chanage font.name-list.emoji.)
3. Scroll the document up and down.

Actual result

At some lines the emoji is clipped.

Comment 6

[Fanolian]

Attachment: Screenshot from testcase

Browser window width is no longer a factor.

Comment 7

[Matt Woodrow (:mattwoodrow)]

This was regressed by https://hg.mozilla.org/integration/autoland/rev/973c5761459d19eeead81b07246ff87ceaccd411 (bug 1729236).

Comment 8

[Matt Woodrow (:mattwoodrow)]

This is the same issue as bug 1729937.