Steps to reproduce
- Create Canvas 2D Context
globalAlphato be value between 0 and 1
fontsupporting colored emoji like “Segeo UI Emoji”
fillTextwith colored characters like “😂”
- The string in
fillTextis expected to have text opacity set in (2), but now in Edge, only the colored glyph would have either concrete color (if
globalAlpha> 0) or transparent (if
ctx.globalAlpha = 0.5; ctx.fillStyle = 'blue'; ctx.fillRect(10, 10, 100, 100); ctx.fillStyle = 'red'; ctx.fillRect(50, 50, 300, 100); ctx.fillStyle = 'yellow'; ctx.font = "500 4em Segoe UI Emoji"; ctx.fillText("1😂23", 80, 170);
Attached results in Edge 40.15063.0.0 and Firefox 53.0.3
My Windows 10 App BGraphics, based on Edge HTML, is affected by this issue. User could have to create colored emoji with different opacity on a canvas.
Comments and activity
- Microsoft Edge Team
Changed Assigned To to “James M.”
Changed Assigned To to “Rick J.”
Changed Assigned To to “Christian F.”
Hi Team, any updates from this issue? Thanks! :)
Hi Team, is there any updates? Thanks!
Hi, do you have any updates on the Canvas color emoji issue?