Bug 249867 - filter:drop-shadow() with a large radius makes node disappear when multiple shadows are applied
Summary: filter:drop-shadow() with a large radius makes node disappear when multiple s...
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: Safari 16
Hardware: All All
: P2 Normal
Assignee: Nobody
URL:
Keywords: BrowserCompat, InRadar
Depends on:
Blocks:
 
Reported: 2022-12-24 07:27 PST by Valery Sibikovsky
Modified: 2022-12-31 07:27 PST (History)
5 users (show)

See Also:

Attachments
Add an attachment (proposed patch, testcase, etc.)

Note You need to log in before you can comment on or make changes to this bug.
Description Valery Sibikovsky 2022-12-24 07:27:00 PST 
When multiple `drop-shadow()` layers are used in the `filter` property, and the blur radius of one of the shadows is too big, it makes the node disappear. 
 
Example: https://codepen.io/combdn/pen/YzjyXrE (It reproduces on iOS 16.2. On a Mac, you might need to set a bigger radius to trigger it.)

Not sure about the exact triggering point. It may be due to the shadow going out of the viewport bounds. 

P. S. It seems that Firefox limits the radius to 100px, no matter how big the number is in CSS.
Comment 1 Radar WebKit Bug Importer 2022-12-31 07:27:16 PST 
<rdar://problem/103790558>