[Webkit-unassigned] [Bug 278813] New: Blend modes in Safari are lost when zooming in

Wed Aug 28 13:52:51 PDT 2024

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

            Bug ID: 278813
           Summary: Blend modes in Safari are lost when zooming in
           Product: WebKit
           Version: Safari 17
          Hardware: All
                OS: All
            Status: NEW
          Severity: Minor
          Priority: P2
         Component: Animations
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: yitzchok at d7mtg.com
                CC: graouts at apple.com

Blend Mode Issue in WebKit

When using supported blend modes (e.g., `multiply`, `screen`, etc.) in Safari, zooming in causes the browser to forget the blend mode effect and display the element with its regular color. Zooming out does not restore the blend mode effect; only reloading the page does.

Steps to Reproduce
1. Create an HTML element with a blend mode applied using CSS.
2. Open the HTML file in Safari.
3. Zoom in using Safari's zoom feature (pinching on trackpad).

Example Code
```html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Blend Mode Bug</title>
    <style>
        .blend-mode {
            width: 200px;
            height: 200px;
            background-color: red;
            mix-blend-mode: overlay;
        }
        .background {
            width: 200px;
            height: 200px;
            background-color: blue;
            position: absolute;
            top: 0;
            left: 0;
        }
    </style>
</head>
<body>
    <div class="background"></div>
    <div class="blend-mode"></div>
</body>
</html>

-- 
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/20240828/40927ac7/attachment.htm>