Bug 249952

Summary: An element cannot have backface-visibility:hidden and backdrop-filter:blur(9px) at the same time as this breaks backface-visibility:hidden
Product: WebKit Reporter: Multifaceted.Abnormal
Component: CSSAssignee: Matt Woodrow <mattwoodrow>
Status: RESOLVED FIXED    
Severity: Critical CC: mattwoodrow, simon.fraser, webkit-bug-importer
Priority: P2 Keywords: InRadar
Version: Safari 15   
Hardware: iPhone / iPad   
OS: iOS 15   
Attachments:
Description Flags
Testcase none

Description Multifaceted.Abnormal 2022-12-29 20:49:35 PST 
If and element has backface-visibility:hidden on it because it's part of a flip card, adding backdrop-filter:blur(9px) breaks the backface-visibility:hidden property.  It's really super annoying as it works properly on everything else.  I'm begging you to fix it.  Because since the browser thinks both properties are compatible with the proper -webkit- prefix, one cannot even use an @media query to hide the backdrop-filter property on mobile.  Both are compatible so it won't trigger the media query.  Unless I'm just stupid (a real possibility) this is a bug and it's one stoping my code from working on iOS mobile which was my original target.
Comment 1 Simon Fraser (smfr) 2023-01-03 15:28:58 PST 
Multifaceted.Abnormal, could you attach a test case, or link to a demo that shows the bug?
Comment 2 Radar WebKit Bug Importer 2023-01-05 20:50:17 PST 
<rdar://problem/103940530>
Comment 3 Matt Woodrow 2023-09-17 17:47:07 PDT 
Created attachment 467731 [details]
Testcase
Comment 4 Matt Woodrow 2023-09-18 20:01:36 PDT 
Pull request: https://github.com/WebKit/WebKit/pull/17895
Comment 5 EWS 2023-09-25 19:10:25 PDT 
Committed 268427@main (93bef5855560): <https://commits.webkit.org/268427@main>

Reviewed commits have been landed. Closing PR #17895 and removing active labels.