Bug 202643
| Summary: | Filter with animated gradient input doesn't update dynamically | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Simon Fraser (smfr) <simon.fraser> |
| Component: | SVG | Assignee: | Simon Fraser (smfr) <simon.fraser> |
| Status: | RESOLVED CONFIGURATION CHANGED | ||
| Severity: | Normal | CC: | sabouhallawa, simon.fraser, webkit-bug-importer, zimmermann |
| Priority: | P2 | Keywords: | InRadar |
| Version: | WebKit Nightly Build | ||
| Hardware: | Unspecified | ||
| OS: | Unspecified | ||
| URL: | https://codepen.io/enxaneta/pen/276a3fd67cade1208e5440b6fda5725d | ||
| See Also: | https://bugs.webkit.org/show_bug.cgi?id=204204 | ||
Simon Fraser (smfr)
The examples on https://codepen.io/enxaneta/post/svg-waves-with-fedisplacementmap don't work in WebKit.
| Attachments | ||
|---|---|---|
| Add attachment proposed patch, testcase, etc. |
Radar WebKit Bug Importer
<rdar://problem/56049856>
Simon Fraser (smfr)
This is not about CSS filters. This is about a filter inside one <svg> in html being used inside another.
Said Abou-Hallawa
This now works in Safari better than Chrome and FireFox. WebKit applies filter in the static case while other browsers do not. The reason in the static examples the filter has an <feImage> while is defined like this:
<feImage result="pict2" xlink:href="#gradient"></feImage>
While in the animated case, this <feImage> is defined as a data url.
<feImage result="pict2" xlink:href="data:image/svg+xml;..."></feImage>
WebKit handles the case of <feImage> referencing another SVG element correctly.