817019 - CSS radial gradient is broken with d2d/azure enabled

Status: VERIFIED FIXED

(Core :: Graphics, defect)

Description

[g.underflow]

Attachment: Testcase

CSS radial gradient is not rendered OR has broken rendering with d2d/azure enabled through gfx.content.azure.enabled. Disabling D2D with either disabling azure or forcing d2d to be disabled through gfx.direct2d.disabled fixes the issue and the gradient is rendered correctly.

Comment 1

[g.underflow]

Attachment: Gradient not rendering with D2D/azure enabled

Comment 2

[g.underflow]

Attachment: Gradient rendered correctly with D2D/Azure disabled

Comment 3

[Alice0775 White]

Works for me in
http://hg.mozilla.org/releases/mozilla-release/rev/919435c6f654
Mozilla/5.0 (Windows NT 6.1; WOW64; rv:17.0) Gecko/17.0 Firefox/17.0 ID:20121119183901

  Graphics

        Adapter Description
        ATI Radeon HD 4300/4500 Series

        Vendor ID
        0x1002

        Device ID
        0x954f

        Adapter RAM
        512

        Adapter Drivers
        aticfx64 aticfx64 aticfx32 aticfx32 atiumd64 atidxx64 atiumdag atidxx32 atiumdva atiumd6a atitmm64

        Driver Version
        8.970.100.3000

        Driver Date
        7-3-2012

        Direct2D Enabled
        true

        DirectWrite Enabled
        true (6.1.7601.17789)

        ClearType Parameters
        Gamma: 2200 Pixel Structure: RGB ClearType Level: 50 Enhanced Contrast: 50

        WebGL Renderer
        Google Inc. -- ANGLE (ATI Radeon HD 4300/4500 Series) -- OpenGL ES 2.0 (ANGLE 1.0.0.1242)

        GPU Accelerated Windows
        1/1 Direct3D 10

        AzureCanvasBackend
        direct2d

        AzureFallbackCanvasBackend
        cairo

        AzureContentBackend
        direct2d

Comment 4

[g.underflow]

Here's config from about:support.

        User Agent
        Mozilla/5.0 (Windows NT 6.1; WOW64; rv:17.0) Gecko/17.0 Firefox/17.0

  Graphics

        Adapter Description
        NVIDIA GeForce GTX 260

        Vendor ID
        0x10de

        Device ID
        0x05e2

        Adapter RAM
        896

        Adapter Drivers
        nvd3dumx,nvwgf2umx,nvwgf2umx nvd3dum,nvwgf2um,nvwgf2um

        Driver Version
        9.18.13.697

        Driver Date
        10-2-2012

        Direct2D Enabled
        true

        DirectWrite Enabled
        true (6.2.9200.16440)

        ClearType Parameters
        DISPLAY1 [ Gamma: 2200 Pixel Structure: RGB ClearType Level: 100 Enhanced Contrast: 100 ] DISPLAY4 [ Gamma: 2200 Pixel Structure: RGB ClearType Level: 100 Enhanced Contrast: 100 ]

        WebGL Renderer
        Google Inc. -- ANGLE (NVIDIA GeForce GTX 260) -- OpenGL ES 2.0 (ANGLE 1.0.0.1242)

        GPU Accelerated Windows
        1/1 Direct3D 10

        AzureCanvasBackend
        direct2d

        AzureFallbackCanvasBackend
        cairo

        AzureContentBackend
        direct2d

Comment 5

[g.underflow]

Works correctly in

Mozilla/5.0 (Windows NT 6.1; WOW64; rv:16.0) Gecko/20100101 Firefox/16.0
Built from http://hg.mozilla.org/releases/mozilla-release/rev/e0c8343d2809

So it's something introduced with 17 branch.

Comment 6

[Alice0775 White]

@g.underflow, help us find the regressing change via http://mozilla.github.com/mozregression/, that would help resolve this problem quickly.

Comment 7

[g.underflow]

(In reply to Alice0775 White from comment #6)
> @g.underflow, help us find the regressing change via
> http://mozilla.github.com/mozregression/, that would help resolve this
> problem quickly.

I'll look it up, when I have some time. But currently I have found what is causing the gradient not to render properly. CSS "border" property is the cause. Removing it resolves the problem, even with the D2D/Azure enabled. Also I have found that "border-radius" is also causing problems. The gradient renders correctly if your remove "border-radius", but leave simple "border", OR if you remove "border" from the element having "border-radius". Having both "border" and "border-radius" breaks the gradient.

Comment 8

[g.underflow]

Last good nightly: 2012-10-06
First bad nightly: 2012-10-07

Pushlog:
http://hg.mozilla.org/mozilla-central/pushloghtml?fromchange=2da1f2bde40e&tochange=ecd4c4304219

Comment 9

[(mostly gone) XtC4UaLL [:xtc4uall]]

Confirmed for
Mozilla/5.0 (Windows NT 6.1; WOW64; rv:17.0) Gecko/20100101 Firefox/17.0 ID:20121128204232
upto
Mozilla/5.0 (Windows NT 6.1; WOW64; rv:20.0) Gecko/20121201 Firefox/20.0 ID:20121201030812

Comment 10

[Lukas Blakk [:lsblakk] use ?needinfo]

Jet do you have someone who can take a look at this regression range and find an assignee for this?

Comment 11

[Jet Villegas (inactive)]

+cc: Bas for a look.

Comment 12

[Bas Schouten (:bas.schouten)]

I'll investigate this when I get back from vacation. We did change a little bit of the gradient behavior (since we're fully compliant with Canvas now), so maybe something there went wrong.

Comment 13

[Bas Schouten (:bas.schouten)]

Attachment: Don't push cleartype layers for transparent rendertargets

This was pretty hard to track down! The cause here is that the fact that we push a ClearType layer on the transparent temporary render target used for storing the mask of the drawing operation when drawing complex radial gradients, will cause the actual operation (i.e. a FillRect in this case) bounds to be ignored.

Comment 14

[Bas Schouten (:bas.schouten)]

Attachment: Reftest: Test bounded ops with a clip, an opaque canvas and a complex radial gradient.

Comment 15

[Bas Schouten (:bas.schouten)]

http://hg.mozilla.org/integration/mozilla-inbound/rev/692692f8ddd0
http://hg.mozilla.org/integration/mozilla-inbound/rev/c0bd07de5197

Comment 16

[Ed Morley [:emorley]]

https://hg.mozilla.org/mozilla-central/rev/692692f8ddd0
https://hg.mozilla.org/mozilla-central/rev/c0bd07de5197

Comment 17

[Alex Keybl [:akeybl]]

This is not critical enough to fix for FF19 given where we are in the cycle. Can you nominate for uplift to Aurora?

Comment 18

[Bas Schouten (:bas.schouten)]

Should we nominate this for Beta or Aurora now?

Comment 19

[Lukas Blakk [:lsblakk] use ?needinfo]

Please nominate for Beta uplift, thank you.

Comment 20

[Bas Schouten (:bas.schouten)]

Comment on attachment 701557 [details] [diff] [review]
Don't push cleartype layers for transparent rendertargets

[Approval Request Comment]
Bug caused by (feature/regressing bug #): Azure Content
User impact if declined: Broken rendering CSS radial gradients
Testing completed (on m-c, etc.): m-c and aurora
Risk to taking this patch (and alternatives if risky): Extremely limited
String or UUID changes made by this patch: None

Comment 21

[Ryan VanderMeulen [:RyanVM]]

https://hg.mozilla.org/releases/mozilla-beta/rev/6b28f69191ce

Comment 22

[Bogdan Maris [:bogdan_maris], Desktop QA]

Mozilla/5.0 (Windows NT 6.1; WOW64; rv:20.0) Gecko/20100101 Firefox/20.0
Mozilla/5.0 (Windows NT 6.1; WOW64; rv:21.0) Gecko/20130307 Firefox/21.0

Verified as fixed using TC provided by reporter, CSS radial gradients rendered correctly on Firefox 20 Beta 4 (buildID: 20130307075451) and latest Aurora (buildID: 20130307042016). 
I noticed that when the cursor of the mouse is pushed inside of the big transparent circle and I leave it there the image is shaking. In chrome and safari I don`t get the same behavior. I can file a new bug if necessary.

Comment 23

[Mihai Morar, (:MihaiMorar)]

I confirm the fix is verified on Windows 7x64 using FF 21 RC (20130507220413)