1446550 - overlay of canvasses with alpha results in color overshoot

Status: NEW

(Core :: Graphics: Canvas2D, defect, P3)

Description

[Erik De Rijcke]

Attachment: Screen Shot 2018-03-16 at 23.02.58-fullpage.png

User Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.124 Safari/537.36

Steps to reproduce:

Render content with alpha channel in offscreen webgl canvas (using a yuv2rgb+yuv2a shader), then render this canvas into different on-screen canvasses (with context2d)


Actual results:

Background colors seem to 'overshoot' into the canvas, effectively changing the canvas colors entirely (ie a white background makes a green canvas with 50% alpha turn solid purple)

Attached:
An image with canvas opacity set to 1.0 using css, demonstrates the issue nicely, when setting the canvas opacity to 0.5 using css makes the colors not overshoot.



Expected results:

Alpha should be correctly applied, colors should not overshoot.

Comment 1

[Tooru Fujisawa [:arai]]

Can you provide a testcase that demonstrates the issue?

Comment 2

[Erik De Rijcke]

https://github.com/udevbe/greenfield/tree/ff_bug/browser/public/bug

All required resources to reproduce are in the bug folder. Simply open the index.html and be greeted with purple rain.

Comment 3

[Aria Beingessner [:Gankra]]

Confirmed on my local linux machine (nvidia proprietary drivers).

Also interesting to note that webrender just completely drops the tiled background on the ground altogether (which looks better but is still incorrect).

Comment 4

[Aria Beingessner [:Gankra]]

Easy link to view the test page: http://htmlpreview.github.io/?https://github.com/udevbe/greenfield/blob/ff_bug/browser/public/bug/index.html

Comment 5

[Markus Stange [:mstange]]

Maybe the WebGL -> Canvas2D drawImage path fails to clamp color values to valid premultiplied alpha.

Comment 6

[Markus Stange [:mstange]]

It's worth checking whether initializing the WebGL context with { premultipliedAlpha: false } makes this behave correctly.