[Webkit-unassigned] [Bug 241079] New: Combination CSS image (gradient) and SVG asset as CSS mask doesn’t render correctly until highlighting/selecting the masked element

[bugzilla-daemon at webkit.org]

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

            Bug ID: 241079
           Summary: Combination CSS image (gradient) and SVG asset as CSS
                    mask doesn’t render correctly until
                    highlighting/selecting the masked element
           Product: WebKit
           Version: Safari Technology Preview
          Hardware: Mac (Intel)
                OS: macOS 12
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: Compositing
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: noah at noahliebman.net
                CC: simon.fraser at apple.com

Created attachment 459838

  --> https://bugs.webkit.org/attachment.cgi?id=459838&action=review

actual result

When using a CSS mask that is both a linear gradient and SVG image, the gradient is ignored until after selecting the masked element.

```
mask-image:
    linear-gradient(to bottom, #000, #000 calc(100% - 38px), #0000 calc(100% - 38px), #0000),
    url("bottomwave.svg");
```

Each mask works individually.

[Demo](https://projects.noahliebman.net/safari-svg-multiple-mask-bug/)

The issue does not occur on every reload, but it occurs much of the time.

See attachment for video demo.

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20220529/bda0f49a/attachment-0001.htm>