Bug 228771 - [cairo][GTK][WPE] Elliptic radial gradients are not working
Summary: [cairo][GTK][WPE] Elliptic radial gradients are not working
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: WebKitGTK (show other bugs)
Version: WebKit Nightly Build
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Miguel Gomez
URL:
Keywords:
Depends on:
Blocks:
 
Reported: 2021-08-04 04:56 PDT by Miguel Gomez
Modified: 2021-08-06 11:02 PDT (History)
4 users (show)

See Also:


Attachments
Patch (2.75 KB, patch)
2021-08-04 05:00 PDT, Miguel Gomez
no flags Details | Formatted Diff | Diff

Note You need to log in before you can comment on or make changes to this bug.
Description Miguel Gomez 2021-08-04 04:56:05 PDT
There are some examples in this page that show the problem: https://people.igalia.com/magomez/gradient/index.html
All of the rendered gradients are circular while some of them should be elliptic.

The problem here is that we use cairo_pattern_create_radial() to create the gradients, and that doesn't support elliptic gradients. We need to do some transformation matrix magic in order to achieve the elliptic result.
Comment 1 Miguel Gomez 2021-08-04 05:00:08 PDT
Created attachment 434898 [details]
Patch
Comment 2 Miguel Gomez 2021-08-04 05:02:15 PDT
(In reply to Miguel Gomez from comment #1)
> Created attachment 434898 [details]
> Patch

This patch is going to break some layout tests that will need to be rebaselined. At this point I can't reproduce the results created by the bot, so in order to update the test results I'll wait for the bot to fail on them, get the result produced, and send later a gardening patch with the new expectations.
Comment 3 EWS 2021-08-04 13:28:24 PDT
Committed r280654 (240265@main): <https://commits.webkit.org/240265@main>

All reviewed patches have been landed. Closing bug and clearing flags on attachment 434898 [details].
Comment 4 Arcady Goldmints-Orlov 2021-08-06 11:02:06 PDT
As an added bonus this also fixed imported/w3c/web-platform-tests/css/css-images/multiple-position-color-stop-radial.html