Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Flag emoji are broken on Chrome 131 on Windows 11... and ED (2025012301) on MacOS #28500

Closed
ara4n opened this issue Nov 20, 2024 · 6 comments · Fixed by #29100
Closed

Flag emoji are broken on Chrome 131 on Windows 11... and ED (2025012301) on MacOS #28500

ara4n opened this issue Nov 20, 2024 · 6 comments · Fixed by #29100
Labels
A-Emoji O-Frequent Affects or can be seen by most users regularly or impacts most users' first experience S-Minor Impairs non-critical functionality or suitable workarounds exist T-Defect

Comments

@ara4n
Copy link
Member

ara4n commented Nov 20, 2024 •
edited
Loading

Steps to reproduce

🏳️‍🌈🏳️‍⚧️🏴‍☠️ is rendered as:
image

rather than:

image

(as seen on macOS 15.1.1 and Chrome 131.0.6778.70)

see https://matrix.to/#/!IemiTbwVankHTFiEoh:matrix.org/$MKDDKlox-0HdM2XsqoFYD-M3CyWGpjItUKTDjW0jkaM?via=matrix.org&via=mozilla.org&via=envs.net

Circumstantially, this may have broken at the same time that Chrome fixed #20043 (https://bugs.chromium.org/p/chromium/issues/detail?id=964527).

Outcome

What did you expect?

Flags emoji to not get split apart into components.

What happened instead?

Whichever dialect of the twemoji font Windows uses seems to render wrong on Chrome 131 + Windows 11

Operating system

Windows 11, version 23H2

Browser information

chrome: Version 131.0.6778.86 (Official Build) (64-bit)

URL for webapp

app.element.io

Application version

v1.11.86

Homeserver

matrix.org

Will you send logs?

No
@ara4n ara4n added the T-Defect label Nov 20, 2024
@dosubot dosubot bot added A-Emoji O-Uncommon Most users are unlikely to come across this or unexpected workflow S-Minor Impairs non-critical functionality or suitable workarounds exist labels Nov 20, 2024
@ara4n ara4n mentioned this issue Nov 20, 2024
Closed
@ara4n
Copy link
Member Author

ara4n commented Nov 20, 2024

Keycap emoji are also broken in the same way as #28421

@florianduros florianduros added O-Occasional Affects or can be seen by some users regularly or most users rarely and removed O-Uncommon Most users are unlikely to come across this or unexpected workflow labels Nov 28, 2024
@kilimnik
Copy link

Same Issue on Ubuntu 24.04 using Chrome Version 131.0.6778.108 (Official Build) (64-bit)

@ara4n ara4n changed the title Flag emoji are broken on Chrome 131 on Windows 11 Flag emoji are broken on Chrome 131 on Windows 11... and ED (2025012301) on MacOS Jan 27, 2025
@ara4n ara4n added O-Frequent Affects or can be seen by most users regularly or impacts most users' first experience and removed O-Occasional Affects or can be seen by some users regularly or most users rarely labels Jan 27, 2025
@ara4n
Copy link
Member Author

ara4n commented Jan 27, 2025

This looks likely to be https://issues.chromium.org/issues/383824583. See also googlefonts/nanoemoji#449

@ara4n
Copy link
Member Author

ara4n commented Jan 27, 2025

Right, this can be worked around by defining additional ligatures in the COLR font without VARIATION SELECTOR-16 (U+FE0F) codepoints present. For instance, to get the trans flag to work, you need to add:

<Ligature components="u200d,u26a7" glyph="u1f3f3_fe0f_200d_26a7_fe0f"/>

alongside the existing:

<Ligature components="ufe0f,u200d,u26a7,ufe0f" glyph="u1f3f3_fe0f_200d_26a7_fe0f"/>

ara4n added a commit to matrix-org/twemoji-colr that referenced this issue Jan 27, 2025
@ara4n
workaround chrome breaking VS16 in ligatures
94c6848 
see element-hq/element-web#28500
and https://issues.chromium.org/issues/383824583
@ara4n
Copy link
Member Author

ara4n commented Jan 27, 2025

fixed by matrix-org/twemoji-colr@94c6848 hopefully

ara4n added a commit that referenced this issue Jan 27, 2025
@ara4n
support non-VS16 emoji ligatures in TwemojiMozilla
b60f16b 
to workaround broken ligature support for VS16 ligature colour emoji in Chrome 131+
See #28500
This was referenced Jan 27, 2025
Closed
Merged
github-merge-queue bot pushed a commit that referenced this issue Jan 27, 2025
@ara4n
support non-VS16 emoji ligatures in TwemojiMozilla (#29100)
c0567fc 
to workaround broken ligature support for VS16 ligature colour emoji in Chrome 131+
See #28500
@ara4n
Copy link
Member Author

ara4n commented Jan 27, 2025

yay! as seen on develop Element version: 95da383-js-fd9a44e70153 with Chrome 131.0.6778.265 on macOS 15.2 (24C101):

Image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
A-Emoji O-Frequent Affects or can be seen by most users regularly or impacts most users' first experience S-Minor Impairs non-critical functionality or suitable workarounds exist T-Defect
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

support non-VS16 emoji ligatures in TwemojiMozilla element-hq/element-web
3 participants
@ara4n @florianduros @kilimnik