Closed Bug 817019 Opened 7 years ago Closed 7 years ago

CSS radial gradient is broken with d2d/azure enabled

Categories

(Core :: Graphics, defect)

17 Branch
x86_64
Windows 7
defect
Not set

Tracking

()

VERIFIED FIXED
mozilla21
Tracking Status
firefox17 --- affected
firefox18 + wontfix
firefox19 + wontfix
firefox20 + verified
firefox21 --- verified

People

(Reporter: g.underflow, Assigned: bas.schouten)

Details

(Keywords: regression, testcase)

Attachments

(5 files)

Attached file 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.
Attachment #687127 - Attachment mime type: text/plain → text/html
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
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
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.
@g.underflow, help us find the regressing change via http://mozilla.github.com/mozregression/, that would help resolve this problem quickly.
(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.
Last good nightly: 2012-10-06
First bad nightly: 2012-10-07

Pushlog:
http://hg.mozilla.org/mozilla-central/pushloghtml?fromchange=2da1f2bde40e&tochange=ecd4c4304219
Component: General → Graphics
Product: Firefox → Core
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
Status: UNCONFIRMED → NEW
Ever confirmed: true
Keywords: regression, testcase
Jet do you have someone who can take a look at this regression range and find an assignee for this?
Assignee: nobody → bugs
+cc: Bas for a look.
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.
Assignee: bugs → bas
Status: NEW → ASSIGNED
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.
Attachment #701557 - Flags: review?(jmuizelaar)
Attachment #701557 - Flags: review?(jmuizelaar) → review+
Attachment #701558 - Flags: review?(jmuizelaar) → review+
https://hg.mozilla.org/mozilla-central/rev/692692f8ddd0
https://hg.mozilla.org/mozilla-central/rev/c0bd07de5197
Status: ASSIGNED → RESOLVED
Closed: 7 years ago
Resolution: --- → FIXED
Target Milestone: --- → mozilla21
This is not critical enough to fix for FF19 given where we are in the cycle. Can you nominate for uplift to Aurora?
Should we nominate this for Beta or Aurora now?
Please nominate for Beta uplift, thank you.
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
Attachment #701557 - Flags: approval-mozilla-beta?
Attachment #701557 - Flags: approval-mozilla-beta? → approval-mozilla-beta+
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.
I confirm the fix is verified on Windows 7x64 using FF 21 RC (20130507220413)
Status: RESOLVED → VERIFIED
You need to log in before you can comment on or make changes to this bug.