[Webkit-unassigned] [Bug 158807] New: -webkit-backdrop-filter leaves artifacts on rounded borders

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=158807

            Bug ID: 158807
           Summary: -webkit-backdrop-filter leaves artifacts on rounded
                    borders
    Classification: Unclassified
           Product: WebKit
           Version: Safari 9
          Hardware: iOS
                OS: iOS 9.3
            Status: NEW
          Severity: Major
          Priority: P2
         Component: CSS
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: asa_carter at hotmail.com

Created attachment 281383
  --> https://bugs.webkit.org/attachment.cgi?id=281383&action=review
Preview of artifacts in iOS safari

Issue:

Using -webkit-backdrop-filter to create a background blur leaves artifacts around the edge of an element that has a border-radius.

Removing the -webkit-backdrop-filter removes the artifacts.

In addition, the blur is also used with a CSS fade animation in my example and the blur is not drawn until the animation has completed. Not sure if this is a bug?

How to reproduce:

Visit https://appifiny.co.uk/demo/ in Safari or Safari on iOS.

Observe artifacts around each corner.
Observe blur being visibly drawn after fade animation has completed.


OS: OS X 10.11.5
Safari: 9.1.1
iOS: 10 Beta 1

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <https://lists.webkit.org/pipermail/webkit-unassigned/attachments/20160615/da0f801a/attachment-0001.html>