Bug 179007 - Emoji does not display when using -apple-system in CSS
Summary: Emoji does not display when using -apple-system in CSS
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: Text (show other bugs)
Version: Safari 11
Hardware: Mac macOS 10.13
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2017-10-30 04:46 PDT by Matt Sephton
Modified: 2019-05-02 16:20 PDT (History)
5 users (show)

See Also:


Attachments
screenshot of the emoji appearing/not in inspector/document (477.74 KB, image/png)
2017-10-30 04:46 PDT, Matt Sephton
no flags Details
reduced test case (446 bytes, text/html)
2017-11-08 08:21 PST, Matt Sephton
no flags Details
reduced test case - screenshot (27.63 KB, image/png)
2017-11-08 08:22 PST, Matt Sephton
no flags Details
Font Explorer X Pro politely giving me no choice but to have ATS auto activation disabled (146.91 KB, image/png)
2018-01-03 07:03 PST, Matt Sephton
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Matt Sephton 2017-10-30 04:46:00 PDT
Created attachment 325347 [details]
screenshot of the emoji appearing/not in inspector/document

http://www.halfapp.co uses the 💯 emoji.

In Safari on macOS I see a question mark in a square. See screenshot.  
I also have this issue in emoji used on my Instagram profile.  

Also, in the web inspector, I see the emoji.  
And if I use Look Up, the emoji is shown.  
Logging in as a guest user I see the emoji.  

No duplicate fonts, no fonts with errors or corruption.  
Apple Color Emoji is where it should be.  

And the emoji is displaying just fine in this post!

Permissions have been repaired and re-checked, but I can check something specific if that would help.

If I remove "-apple-system" from the CSS font definition the emoji appear (and of course the font changes).

Any ideas?

macOS 10.13, Safari 11.0 (13604.1.38.1.6)


Also see: <rdar://problem/35048088>
Comment 1 Radar WebKit Bug Importer 2017-10-30 09:41:33 PDT
<rdar://problem/35251087>
Comment 2 Myles C. Maxfield 2017-10-31 13:29:40 PDT
<rdar://problem/35048088>
Comment 3 Matt Sephton 2017-11-08 08:21:44 PST
Created attachment 326328 [details]
reduced test case
Comment 4 Matt Sephton 2017-11-08 08:22:13 PST
Created attachment 326329 [details]
reduced test case - screenshot
Comment 5 Matt Sephton 2018-01-03 07:03:19 PST
Created attachment 330380 [details]
Font Explorer X Pro politely giving me no choice but to have ATS auto activation disabled
Comment 6 Matt Sephton 2018-01-03 07:04:40 PST
Solution is to re-enable ATS auto activation:

$ atsutil autoactivation -e

ATS auto activation had been disabled on my machine by Font Explorer X Pro.

So it seems that Safari emoji rendering (and who knows what else) does not work properly when ATS auto activation is disabled.

You can disable it using:

$ atsutil autoactivation -d

And then open a new Safari window to check rendering.

<rdar://problem/36273583>
Comment 7 Myles C. Maxfield 2018-01-14 18:54:56 PST
Thanks for the analysis, this really helps us solve this bug!

—Myles
Comment 8 Matt Sephton 2018-01-16 04:49:57 PST
It was very frustrating to get to the bottom of it, so if it helped that is good news.

(In reply to Myles C. Maxfield from comment #7)
> Thanks for the analysis, this really helps us solve this bug!
> 
> —Myles
Comment 9 Myles C. Maxfield 2018-01-16 19:36:18 PST
<rdar://problem/33979180>
Comment 10 Matt Sephton 2018-01-22 03:30:18 PST
Why have all the comments on this issue disappeared?
Comment 11 Matt Sephton 2018-01-22 03:31:39 PST
Ignore me, content blocker issue.
Comment 13 Matt Sephton 2019-01-19 16:41:19 PST
Could this have reappeared through a regression in Mojave?

https://apple.stackexchange.com/questions/349042/emojis-appear-on-some-parts-of-apps-but-show-as-question-mark-in-other-parts

I see that the workaround `atsutil autoactivation -e` is not available in Mojave, instead it displays "Note: auto activation is no longer supported."