My favorites | Sign in
Project Home Downloads Wiki Issues Code Search
New issue   Search
for
  Advanced search   Search tips   Subscriptions
Issue 62435: Emoji does not display in webpage contents on OS X Lion+
632 people starred this issue and may be notified of changes. Back to list
 
Reported by meta...@gmail.com, Nov 8, 2010
Chrome Version       : 7.0.517.41
URLs (if applicable) : http://www.fileformat.info/info/unicode/char/1f4a9/browsertest.htm
Other browsers tested:
Add OK or FAIL after other browsers where you have tested this issue:
     Safari 5: FAIL
  Firefox 3.x: OK
       IE 7/8: n/a

What steps will reproduce the problem?
1. Install Symbola font from http://users.teilar.gr/~g1951d/ (or any other font which includes the Emoji symbol for U+1F4A9)
2. View test page at http://www.fileformat.info/info/unicode/char/1f4a9/browsertest.htm

What is the expected result?
All four boxes should display the same pile of poo.

What happens instead?
On Kubuntu Linux 10.10 with stable Chrome release, the three Unicode character versions display correctly and are identical to the "Should look like" image.
On Mac OS X, the three Unicode character versions do not display; instead, I get the empty box character.

Please provide any additional information below. Attach a screenshot if
possible.

This is probably a much more general problem, but that's the Unicode character I noticed it with...
Oct 27, 2011
#13 avi@chromium.org
was: Unicode / font-fallback: Unicode pile of poo does not display on Mac OS X, works on Linux
Summary: Emoji does not display in webpage contents on OS X Lion
Labels: Hotlist-MacOSXLion
Oct 27, 2011
#16 avi@chromium.org
Thakis commented on  bug 90177 :

Happened to see this in WebKit/Tools/DumpRenderTree/mac/DumpRenderTree.cpp:

   [preferences setPictographFontFamily:@"Apple Color Emoji"];

Maybe related?
Cc: thakis@chromium.org
Nov 2, 2011
#17 jshin@chromium.org
Although it's not a great idea to invent a new CSS generic family for emoji (imho), that's what's done. So, I believe by adding a new preference for PictorGraphFontFamily, we can fix this problem. I'll give it a shot as I mentioned in  bug 90177 . 



Nov 2, 2011
#18 jshin@chromium.org
The webkit change for PictorGraphFontFamily is https://bugs.webkit.org/show_bug.cgi?id=65197

The change will only work on Lion. We need to do some plumbing in Chrome and chrome's webkit.  


Jun 5, 2012
#22 katmomoi
http://www.unicode.org/~scherer/emoji4unicode/snapshot/emojidata.html

The above page contains the full set of Emoji added to Unicode 6. The 2nd column uses the code points for some 720 Emoji characters.
On Mac OS Lion, there is Apple Color Emoji that can display all the Emoji on Safari. Unfortunately none of the Emoji displays on the latest Chrome.
Can we make sure that Chrome too displays all the characters on Mac using Mac OS Lion's built in font for Emoji? 
Jun 5, 2012
#24 asvitkine@chromium.org
(+cc some WebKit fonts / i18n folks)
Cc: jshin@chromium.org hb...@chromium.org x...@chromium.org
Jun 5, 2012
#25 thakis@chromium.org
Probably needs

https://bugs.webkit.org/show_bug.cgi?id=88393
https://chromiumcodereview.appspot.com/10540022

but that's not enough. (A html file that contains "😰" and has font-family: "Apple Color Emoji" doesn't show the character correctly either; once that works the rest should start working with the above CLs)
Jun 5, 2012
#26 thakis@chromium.org
https://bugzilla.mozilla.org/show_bug.cgi?id=715798
https://bugzilla.mozilla.org/show_bug.cgi?id=119490#c120
suggest that the emoji font is special; maybe the font serialization can't handle it?
Jun 5, 2012
#27 ba...@chromium.org
To support Apple Color Emoji, we need to ask Skia people to use CTFontDrawGlyphs(), which available in 10.7 SDK. WebKit mac port uses the API.
https://code.google.com/searchframe#OAMlx_jo-ck/src/third_party/WebKit/Source/WebCore/platform/graphics/mac/FontMac.mm&exact_package=chromium&q=CTFontDrawGlyphs&l=135

Jun 6, 2012
#28 thakis@chromium.org
I gave that a try, but failed to get it to work so far. Work in progress attached.
skia-ctglyphs.diff
2.1 KB   View   Download
Jun 6, 2012
#29 thakis@chromium.org
Stuff looks almost correct if I set the offset to {0,0}; I suppose coretext transformation order is slightly different.
Sep 18, 2012
#31 rsesek@chromium.org
 Issue 150599  has been merged into this issue.
Sep 19, 2012
#32 tkent@chromium.org
 Issue 150748  has been merged into this issue.
Sep 21, 2012
#33 thakis@chromium.org
In addition to the changes mentioned above, https://bugs.webkit.org/show_bug.cgi?id=97286 needs to be reverted too.
Sep 23, 2012
#34 thakis@chromium.org
A few notes about SkFontHost_mac_coretext.cpp:

* SkFontHost::FilterRec needs to always use kLCD16_Format for bitmap fonts such as emoji, else it might create grayscale glyphs and emoji characters show up as greyscale. (attached patch has proof-of-concept code for this)

* On retina displays, bitmap fonts are currently rendered at half the resolution

* Gamma correction (or something) causes colors for bitmap fonts to be off. Skip doing this for bitmap fonts.

* Text is currently drawn white-on-black with a TODO to invert this. This is apparently needed for bitmap fonts, else they end up with inverted colors. (Or something further down in skia inverts, so a double-invert is needed to make that a noop). Also proof-of-concepted in the attached patch.
skia-emoji.patch
7.5 KB   View   Download
Sep 23, 2012
#36 thakis@chromium.org
(No comment was entered for this change.)
Summary: Emoji does not display in webpage contents on OS X Lion+
Sep 23, 2012
#37 thakis@chromium.org
(See  issue 151883  for the omnibox shift caused by emojis)
Sep 24, 2012
#38 thakis@chromium.org
LayoutTests/fast/css/font-family-pictograph.html starts looking ok when forcing rec->fMaskFormat to kLCD32_Format (not kARGB32_Format surprinsingly) in SkFontHost::FilterRec(), and when sending SkScalerContext_Mac() down the leopard path always (which passes the true font size instead of 1 for the font size).

(Note: it's still pixel-scaled on retina.)
Oct 5, 2012
#40 bugdro...@chromium.org
The following revision refers to this bug:
    http://src.chromium.org/viewvc/chrome?view=rev&revision=160338

------------------------------------------------------------------------
r160338 | thakis@chromium.org | 2012-10-05T08:56:03.686369Z

Changed paths:
   M http://src.chromium.org/viewvc/chrome/trunk/src/webkit/glue/webpreferences.h?r1=160338&r2=160337&pathrev=160338
   M http://src.chromium.org/viewvc/chrome/trunk/src/chrome/app/resources/locale_settings_cros.grd?r1=160338&r2=160337&pathrev=160338
   M http://src.chromium.org/viewvc/chrome/trunk/src/chrome/browser/ui/prefs/prefs_tab_helper_browsertest.cc?r1=160338&r2=160337&pathrev=160338
   M http://src.chromium.org/viewvc/chrome/trunk/src/chrome/common/pref_names.cc?r1=160338&r2=160337&pathrev=160338
   M http://src.chromium.org/viewvc/chrome/trunk/src/chrome/common/pref_names.h?r1=160338&r2=160337&pathrev=160338
   M http://src.chromium.org/viewvc/chrome/trunk/src/chrome/browser/chrome_content_browser_client.cc?r1=160338&r2=160337&pathrev=160338
   M http://src.chromium.org/viewvc/chrome/trunk/src/chrome/app/resources/locale_settings_win.grd?r1=160338&r2=160337&pathrev=160338
   M http://src.chromium.org/viewvc/chrome/trunk/src/chrome/app/resources/locale_settings_linux.grd?r1=160338&r2=160337&pathrev=160338
   M http://src.chromium.org/viewvc/chrome/trunk/src/chrome/app/resources/locale_settings_mac.grd?r1=160338&r2=160337&pathrev=160338
   M http://src.chromium.org/viewvc/chrome/trunk/src/chrome/browser/extensions/api/font_settings/font_settings_api.cc?r1=160338&r2=160337&pathrev=160338
   M http://src.chromium.org/viewvc/chrome/trunk/src/chrome/browser/ui/prefs/prefs_tab_helper.cc?r1=160338&r2=160337&pathrev=160338
   M http://src.chromium.org/viewvc/chrome/trunk/src/webkit/glue/webpreferences.cc?r1=160338&r2=160337&pathrev=160338

mac: Plumbing for the emoji font.

Since emoji is disabled in webkit for chromium, this has no observable effect yet.

BUG=62435
TEST=none
TBR=tony

Review URL: https://chromiumcodereview.appspot.com/10540022
------------------------------------------------------------------------
Oct 5, 2012
#41 thakis@chromium.org
After the above commit, the following changes are needed to get the proof-of-concept going:

1. Revert https://bugs.webkit.org/show_bug.cgi?id=97286  in webkit (just 2 lines) locally
2. Apply the patch from comment 34

Issues with the patch:
* Emojis show up as lodpi on retina displays
* Baselines are messed up (bashi suggests this could be fixed by using the emoji font only for bitmap font glyphs)
* The skia patch is very messy

bashi says he'll try to get the skia part moving.
Oct 5, 2012
#42 jshin@chromium.org
I added a couple of comments to https://chromiumcodereview.appspot.com/10540022/ (post-commit comment). They're just about font pref on Windows and Linux. 

Oct 15, 2012
#43 bugdro...@chromium.org
The following revision refers to this bug:
    http://src.chromium.org/viewvc/chrome?view=rev&revision=162045

------------------------------------------------------------------------
r162045 | thakis@chromium.org | 2012-10-16T02:11:47.859944Z

Changed paths:
   M http://src.chromium.org/viewvc/chrome/trunk/src/chrome/app/resources/locale_settings_cros.grd?r1=162045&r2=162044&pathrev=162045
   M http://src.chromium.org/viewvc/chrome/trunk/src/chrome/app/resources/locale_settings_win.grd?r1=162045&r2=162044&pathrev=162045
   M http://src.chromium.org/viewvc/chrome/trunk/src/webkit/glue/webpreferences.cc?r1=162045&r2=162044&pathrev=162045

Address review feedback for r160338

On Windows, use Segoe UI Symbol as emoji font.
On CrOS, use Droid Emoji.
Simplify the defaults, they're overridden anyway.

BUG=62435
TEST=none


Review URL: https://chromiumcodereview.appspot.com/11071011
------------------------------------------------------------------------
Nov 13, 2012
#45 hora...@gmail.com
Emoji is shown correctly in Title (or when adding a bookmark).

Emoji is not correct when it's in the content.

FYI: http://apple.stackexchange.com/questions/41228/why-do-emoji-like-appear-when-i-use-safari-but-not-chrome

Version 25.0.1323.1 dev
Feb 24, 2013
#46 g...@chromium.org
What needs to happen to get this to work? Note: The standard OSX Japanese IME inserts emoji 

type 'ichigo' you get not θ‹Ί only but also πŸ“ 
type 'bi-ru' and you get not only ビール but also 🍺 and 🍻
type 'ke-ki' and you get not only γ‚±γƒΌγ‚­but also 🍰 and πŸŽ‚

All this works in Safari on OSX and IE on Windows. Anything I can do to help it work on Chrome?
Feb 24, 2013
#47 thakis@chromium.org
gman: See comment 41 and some of the previous comments. The most important thing is to figure out how to do the skia parts right (need to call the new CTFontDrawGlyphs() function and tell skia to use 32 bit glyphs; comment 41 has a somewhat-working patch).
Mar 8, 2013
#48 mark@chromium.org
I tried to put some πŸ’© into a code review but all I got was a box. I kind of think we should be able to use πŸ’© in code reviews, so this was pretty disappointing to me.

bashi, are you still working on the Skia side of this?
Apr 11, 2013
#53 raomoka...@gmail.com
The same thing is happening in Chrome on Windows 8 (which has native support for emoji). Internet Explorer displays them correctly, but Chrome up till today doesn't...perhaps cause fkn Google doesn't support emoji in any of its OS, so it wants other OS users to see the web the same way its OS users do.
Apr 29, 2013
#54 tkent@chromium.org
 Issue 236171  has been merged into this issue.
Cc: eae@chromium.org leviw@chromium.org
Jul 19, 2013
#56 paul.ir...@gmail.com
You can install this Chrome extension for emoji in the meantime: 
https://chrome.google.com/webstore/detail/chromoji-emoji-for-google/cahedbegdkagmcjfolhdlechbkeaieki
Jul 20, 2013
#58 br...@chromium.org
What's required to resolve this issue and properly support emoji? Also, what's the status on Windows and ChromeOS? Emoji seem to be showing up properly for me on ChOS.
Jul 20, 2013
#59 thakis@chromium.org
brian: See previous comments for what needs to be done. Summary:

1. Skia needs to be learn to draw 32bit rgba glyphs
2. Skia's mac text renderer needs to call CTFontDrawGlyphs() for bitmap fonts (see patch in comment 34)
(2b. Make sure they show up hidpi on retina displays)
3. Some minor plumbing needs to be done to enable this in skia (see comment 41)

CrOS uses vector fonts for Emoji and hence uses the regular font rendering paths for them. Apple decided that Emojis warrant introducing 32bit rgba bitmap fonts (which means they look bad at very large font sizes, but that's admittedly a rare use case), and skia doesn't support that new font mode yet.

I saw a design doc from reed@ about 32bit bitmap glyphs a while ago, I don't know what the status of that is.
Cc: r...@chromium.org
Aug 16, 2013
#62 rsesek@chromium.org
 Issue 273491  has been merged into this issue.
Sep 27, 2013
#63 jshin@chromium.org
JFYI : See bug 245397. Skia on Linux/Android can handle color glyphs with FreeType 2.5.0.1. Android WebView support was added, which can be ported to Blink on Linux. 
Dec 18, 2013
#70 r...@google.com
(No comment was entered for this change.)
Owner: bunge...@chromium.org
Cc: r...@google.com
Jan 10, 2014
#71 ebrami...@gmail.com
Win8.1/IE11 equivalent to this bug: Issue 333011
Jan 10, 2014
#72 eae@chromium.org
Please star the issue to indicate that you'd like to see it fixed, adding redundant comment only slows down the process.
Labels: Restrict-View-EditIssue
Jan 10, 2014
#73 eae@chromium.org
(No comment was entered for this change.)
Labels: -Restrict-View-EditIssue Restrict-AddIssueComment-EditIssue
Feb 9, 2014
#74 esei...@chromium.org
Ran into this again today, came to check on things and see if I could help fix.  I see a plan laid out in comment 59, but that's almost 8 months ago and I know the font code has changed significantly since!  Curious if either Email or Ben have a status update as to what remains and if there are ways others can help with the remaining issues.  Thanks!
Feb 9, 2014
#75 noms@chromium.org
I'm slowly working on a fix, but it isn't very promising at the moment. I tried applying Nico's patch and cleaning up the Skia code, but his patch doesn't work anymore. :(
I spoke to Ben, and he mentioned he has looked a bit at it and had a sketch of patch, but he's been pretty busy with the Windows font stuff so I haven't got ahold of it yet. In any case, I was going to ask some Skia folks next week if they could point me in the right direction towards fixing this. 
Any and all comments welcome!
Mar 3, 2014
#76 noms@chromium.org
Here is the patch that I currently have, based on Nico's old patch. I'm building with the 10.7 sdk, so I temporarily took out the dlsym call to make sure that isn't what is breaking everything (it isn't). This code is currently drawing the glyphs with CTFontDrawGlyphs, which I understand is the right approach. 

The problem is that even though the baselines seem fine for the text, I've never been able to actually see an emoji glyph being drawn. The glyph bounds are fine (if I memset the background to green, I see the proper square where the emoji should be), and the loaded font has color glyphs, but they do not show up.
emoji.patch
5.3 KB   Download
Mar 4, 2014
#77 thakis@chromium.org
Mostly works for me. left to right: chrome, chromium with your patch, safari. (Colors are off, but hey.)

This is on 10.8, non-retina. Maybe it's not right on retina displays yet.

I did:

cd third_party/skia/src; patch -p1 < ~/Downloads/emoji.patch
cd -
cd third_party/WebKit
# change stuff
git diff
diff --git a/Source/platform/fonts/mac/FontCacheMac.mm b/Source/platform/fonts/mac/FontCacheMac.mm
index a67362d..7cba3b3 100644
--- a/Source/platform/fonts/mac/FontCacheMac.mm
+++ b/Source/platform/fonts/mac/FontCacheMac.mm
@@ -119,8 +119,8 @@ PassRefPtr<SimpleFontData> FontCache::platformFallbackForCharacter(const FontDes
         return nullptr;
 
     // Chromium can't render AppleColorEmoji.
-    if ([[substituteFont familyName] isEqual:@"Apple Color Emoji"])
-        return nullptr;
+    //if ([[substituteFont familyName] isEqual:@"Apple Color Emoji"])
+        //return nullptr;
 
     // Use the family name from the AppKit-supplied substitute font, requesting the
     // traits, weight, and size we want. One way this does better than the original
Screen Shot 2014-03-04 at 11.40.02 AM.png
793 KB   View   Download
Mar 6, 2014
#78 thakis@chromium.org
On 10.9, the patch doesn't work for me either, independent of retinaness.

(This is how Firefox added support: https://bugzilla.mozilla.org/show_bug.cgi?id=715798#c44)
Apr 8, 2014
#87 kenjibaheux@chromium.org
(No comment was entered for this change.)
Cc: -hb...@chromium.org -kenjibaheux@chromium.org -ba...@chromium.org
Apr 10, 2014
#88 rsesek@chromium.org
 Issue 361986  has been merged into this issue.
May 18, 2014
#89 thakis@chromium.org
Here's a silly demo that shows that CTFontDrawGlyphs does the thing on 10.9, so the patch probably just has a few offsets off? Here's a screenshot of running this on 10.9, would be interesting to see if this has the same output on 10.8.
Screen Shot 2014-05-18 at 10.23.56 PM.png
100 KB   View   Download
FooView.m
1.1 KB   Download
Jun 6, 2014
#90 rsesek@chromium.org
FooView.m only shows a red rectangle on 10.8.
Jun 6, 2014
#91 noms@chromium.org
Given how consistently this patch works, I can't wait to try it out on 10.10 :(
Jun 12, 2014
#92 rsesek@chromium.org
The patch works on 10.10!
Aug 14, 2014
#93 jshin@chromium.org
Great to hear that it works on 10.10. 
If it works on 10.10 (but not in earlier OS X), I think we should get this in potentially with a run-time OS version check to avoid a problem on earlier OS X (if any). 

I'm afraid we're getting a lot of bad PR on this issue. 
Cc: markda...@google.com
Aug 14, 2014
#94 jia...@opera.com
It will still be interesting to know how come it worked on 10.8 and 10.10 but not 10.9, and last time I checked the patch is still missing polishing from Skia side to fully work. Any chance to get more Skia developers to help understanding it better? I have tried but without more Skia background it's hard to understand how it is supposed to work.
Aug 14, 2014
#95 noms@chromium.org
I think rsesek@ was referring to Nico's red square patch. I dont think the emoji patch works on 10.10, or is in any shape ready to go out.

Aug 14, 2014
#96 rsesek@chromium.org
Right, I was testing Nico's FooView.m, which does not work on 10.8, but it does on 10.9 and 10.10. I definitely support just getting this done for modern OSes using a run-time check. We've been without emoji support for far too long.
Sep 2, 2014
#97 r...@google.com
I'll sync-up with bungeman tomorrow, and see if he has any insight.
Sep 2, 2014
#98 noms@chromium.org
(No comment was entered for this change.)
Cc: h...@chromium.org
Sep 16, 2014
#99 tkent@chromium.org
 Issue 414535  has been merged into this issue.
Sign in to add a comment

Powered by Google Project Hosting