Bug 139412 - SVG chained filter effects clip out-of-region drawing incorrectly
Summary: SVG chained filter effects clip out-of-region drawing incorrectly
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: SVG (show other bugs)
Version: 528+ (Nightly build)
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2014-12-08 13:36 PST by Said Abou-Hallawa
Modified: 2023-05-08 02:28 PDT (History)
5 users (show)

See Also:


Attachments
Test case (858 bytes, image/svg+xml)
2014-12-08 13:36 PST, Said Abou-Hallawa
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Said Abou-Hallawa 2014-12-08 13:36:09 PST
Created attachment 242844 [details]
Test case

Open the following SVG in WebKit:

<svg xmlns="http://www.w3.org/2000/svg">
    <filter id="f1" x="0" y="0" width="100" height="100" filterUnits="userSpaceOnUse">
      <!-- Create a green square at x=0. -->
      <feFlood result="red" x="100" y="0" flood-color="red"/>
      <feFlood result="green" flood-color="green"/>
      <!--
          Attempt to offset the red square left to cover up the green square.
          However, this filter's filter region should clip away the red square,
          and only transparent pixels should be offset left, leaving the green
          square intact.
      -->
      <feOffset result="red" in="SourceGraphic" dx="-100" x="0" y="0" width="200" height="100"/>
      <feMerge>
          <feMergeNode in="green"/>
          <feMergeNode in="red"/>
      </feMerge>
    </filter>
    <rect x="0" y="0" width="100" height="100" filter="url(#f1)"/>
</svg>

Result: Nothing is drawn.
Expected: A 100 x 100 green rectangle. A black rectangle is drawn at (0,0). The filter f1 has a red rectangle drawn at (100,0). This rectangle should be completely clipped since it outside the rectangle area of the target element. When offsetting this rectangle with dx=-1, this should not have any effect because it clipped when it was first drawn. Merging this empty rectangle with a green rectangle should result in a green rectangle at (0,0)

NOTE: FireFox and Chrome both render this SVG as expected.
NOTE: This test is an imported test from Mozilla SVG test suite but is modified a little to narrow down the problem.
Comment 1 Radar WebKit Bug Importer 2014-12-08 13:36:54 PST
<rdar://problem/19180719>
Comment 2 Dirk Schulze 2014-12-08 13:37:20 PST
IIRC there is a dupe for this one already.
Comment 3 Michael Catanzaro 2016-07-23 11:00:23 PDT
These tests are flaky (sometimes pass) on GTK, passing more often now that we've enabled threaded compositor. Updating expectations accordingly.
Comment 4 Ahmad Saleem 2022-10-16 04:43:42 PDT
I am able to reproduce this bug in Safari Technology Preview 155 as well, where nothing is draw while both Chrome Canary 108 and Firefox Nightly 107 have "green" square. Thanks!
Comment 5 Ahmad Saleem 2023-05-08 02:28:09 PDT
(In reply to Ahmad Saleem from comment #4)
> I am able to reproduce this bug in Safari Technology Preview 155 as well,
> where nothing is draw while both Chrome Canary 108 and Firefox Nightly 107
> have "green" square. Thanks!

With LBSE turned on using WebKit ToT (minibrowser), it does show 'black' rectangle compared to 'green' of other browsers. So LBSE slightly progresses this.