[Webkit-unassigned] [Bug 236876] New: Text contents in <span> with opacity not repainting/updating when sibling element has "will-change: transform"
bugzilla-daemon at webkit.org
bugzilla-daemon at webkit.org
Fri Feb 18 19:22:05 PST 2022
https://bugs.webkit.org/show_bug.cgi?id=236876
Bug ID: 236876
Summary: Text contents in <span> with opacity not
repainting/updating when sibling element has
"will-change: transform"
Product: WebKit
Version: Safari Technology Preview
Hardware: All
OS: All
Status: NEW
Severity: Major
Priority: P2
Component: Layout and Rendering
Assignee: webkit-unassigned at lists.webkit.org
Reporter: long.zheng at gmail.com
CC: bfulgham at webkit.org, simon.fraser at apple.com,
zalan at apple.com
Created attachment 452615
--> https://bugs.webkit.org/attachment.cgi?id=452615&action=review
Demo of the repro
When working on a React application, I noticed that in Safari one of my <span> elements with some text content was not updating even though the underlying value in the DOM has changed. Upon extensive debugging and testing, I have deduced the problem occurs when
- the text <span> element has a CSS opacity value applied
- the sibling element has a CSS "will-change: transform" applied
Repro:
- https://codesandbox.io/s/broken-feather-rl7u6b?file=/src/App.tsx
- Drag the input slider along the track
- The "Progress: 0" text should update/repaint as you drag the slider
- If you inspect the DOM, you can see the value and the node value does update
(See video attachment)
Actual behaviour:
- The text does not update/repaint
- The text updates/repaints if you mouse select the element
Expected behaviour:
- The text updates as you drag the slider
I have reproed this on
- Safari Version 15.3 (17612.4.9.1.8) on macOS 12.2.1
- Safari Technology Preview Release 140 (Safari 15.4, WebKit 17614.1.1.5) on macOS 12.2.1
- Safari on iOS 15.3.1
I cannot repro this issue on
- Chrome 98.0.4758.102 (Official Build) (arm64)
- Firefox 97.0 (64-bit)
--
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/20220219/056c08fe/attachment-0001.htm>
More information about the webkit-unassigned
mailing list