Bug 189256 – feFlood with explicit size in CSS filter doesn't render

• Component: CSS
• Status: REOPENED

[Simon Fraser (smfr)]

Attached test case doesn't render in Safari; it does in FF and Chrome (differently).

Oddly, toggling dismay:none on the SVG changes behavior.

[Simon Fraser (smfr)]

Created attachment 348805 [details]
Testcase

[Ahmad Saleem]

I am able to reproduce this bug in Safari 16.4 and green rect is on 0,0 while Chrome Canary 114 and Firefox Nightly 113 does not start from 0,0 but has margin around it.

[Said Abou-Hallawa]

Created attachment 465833 [details]
unclipped filtered element

I think the display in WebKit is more correct than Chrome and FireFox. The default filterRegion of the SVGFilter is { -10%, -10%, 110%, 110% }. Because the filtered element dimension is { 100, 100 }, the filterRegion will be extended 10 pixels from all directions.

In WebKit, this is drawn with no clipping. But in Chrome and FireFox, the top and the left extended areas are clipped. See the attached new test case where a filtered element is drawn and an another overlay element with the same dimension is drawn on top of it. The overlay element only draws the border.

[Simon Fraser (smfr)]

I don't think this config changed; if our rendering differs from Chrome and Firefox and we think the behavior is correct, we should open a spec issue to have the spec clarify behavior.

It's not clear to me that WebKit behavior is correct.

[Said Abou-Hallawa]

(In reply to Simon Fraser (smfr) from comment #4)
> I don't think this config changed; if our rendering differs from Chrome and
> Firefox and we think the behavior is correct, we should open a spec issue to
> have the spec clarify behavior.

But the specs is clear for applying an SVGFilter on an SVGElement. The geometry of the filterRegion is { -10%, -10%, 110%, 110% }, see https://drafts.fxtf.org/filter-effects/#filter-region. 

The problem happens when applying the SVGFilter to an HTMLElement. Do we apply the filterRegion geometry outside the HTMLElement border box? 

> 
> It's not clear to me that WebKit behavior is correct.

I am not sure why the rendering of Chrome and FireFox is correct. They clip the top and left filter extension and they keep the right and the bottom.

And I think we need at least to retitle this bug and preferably close this one and open a new one. The original bug was fixed (not drawing the filter itself). We now want to discuss: The filterRegion geometry of the SVGFilter when applied on an HTMLElement.

[Simon Fraser (smfr)]

I’m OK with doing that.