[Webkit-unassigned] [Bug 249943] New: Emoji character is horizontally misaligned when using COLR font

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=249943

            Bug ID: 249943
           Summary: Emoji character is horizontally misaligned when using
                    COLR font
           Product: WebKit
           Version: Safari Technology Preview
          Hardware: Unspecified
                OS: Unspecified
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: Layout and Rendering
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: nolan at nolanlawson.com
                CC: bfulgham at webkit.org, simon.fraser at apple.com,
                    zalan at apple.com

Created attachment 464247

  --> https://bugs.webkit.org/attachment.cgi?id=464247&action=review

Screenshot of Chrome, Firefox, and Safari TP

When using the Twemoji Mozilla COLR font [1], Safari Technology Preview Release 160 (Safari 16.4, WebKit 18615.1.14.3) renders certain emoji characters with the wrong alignment inside of a flexbox container with `align-items: center; justify-content: center;`.

Minimal repro: https://nolanlawson.github.io/webkit-emoji-font-repro/

Note that the fourth character (☺️) is not horizontally centered, whereas the other characters are.

This issue only repros in Safari. In Firefox and Chrome, all emoji characters are rendered with the correct horizontal center alignment. (See attached screenshots.)

Based on my testing, this only repros with a custom COLR font (not the built-in Apple Color Emoji font), and only certain emoji characters are misaligned: ☺️, ��, ♥️, ��️, etc.

[1]: https://github.com/mozilla/twemoji-colr/releases/tag/v0.7.0

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20221229/cc76d8e8/attachment.htm>