[Webkit-unassigned] [Bug 257023] New: Element left in blurred state after animation

[bugzilla-daemon at webkit.org]

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

            Bug ID: 257023
           Summary: Element left in blurred state after animation
           Product: WebKit
           Version: Safari 16
          Hardware: Unspecified
                OS: Unspecified
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: Animations
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: matt.sephton at gmail.com
                CC: dino at apple.com, graouts at apple.com

Created attachment 466414

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

screen recording of the issue, with workaround

I am seeing a CSS element animate in but it is left in a blurry state.

However, if I do certain things that cause the page to redraw then it finally appears as it should.

I can move the mouse a certain way, scroll the page, or use the web inspector.

If I apply `animation: none !important` to the element `#polyglot__panel` then the issue goes away.

The CSS is inside the Polyglot App Extension https://apps.apple.com/gb/app/polyglot/id1471801525?mt=12
- install and run the app
- check "instant translation" box
- go to safari
- activate extension
- goto page https://github.com/uetchy/Polyglot/issues/128
- select some text by double clicking
- do not move the mouse afterwards 
- translation popup panel will appear, blurred
- scroll page, panel will unblur

Attached is a screen recording.

Related:
- https://bugs.webkit.org/show_bug.cgi?id=254585
- https://bugs.webkit.org/show_bug.cgi?id=254665

-- 
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/20230519/1854b9c1/attachment.htm>