[Webkit-unassigned] [Bug 176858] New: div with animated 'transform' should remain a containing block for positioned descendants, even if it's animating the value "transform:none"
bugzilla-daemon at webkit.org
bugzilla-daemon at webkit.org
Wed Sep 13 10:42:56 PDT 2017
https://bugs.webkit.org/show_bug.cgi?id=176858
Bug ID: 176858
Summary: div with animated 'transform' should remain a
containing block for positioned descendants, even if
it's animating the value "transform:none"
Product: WebKit
Version: Safari 10
Hardware: Unspecified
OS: Unspecified
Status: NEW
Severity: Normal
Priority: P2
Component: Animations
Assignee: webkit-unassigned at lists.webkit.org
Reporter: dholbert at mozilla.com
CC: dino at apple.com
I'm using Safari 10.1.2.
STEPS TO REPRODUCE:
(1) Visit https://jsfiddle.net/kkpznn6L/
EXPECTED RESULTS:
No red should be visible.
ACTUAL RESULTS:
Red is visible. (The fixed-pos lime div abandons its red containing block and uses the viewport as its containing block instead.)
Notes:
The animation ends at "transform:none", which normally (if there weren't any animations) would mean that the red div should stop being a containing block for positioned children, which would mean that Safari's behavior here is correct [1].
However, that spec text doesn't matter because there's another effect that supercedes it, from the CSS Animations spec:
"While an animation [...] has an animation-fill-mode of 'forwards' or 'both', the user agent must act as if the will-change property ([css-will-change-1]) on the element additionally includes all the properties animated by the animation."
https://drafts.csswg.org/css-animations/#animations
So the rendering should be the same as what it'd be if "will-change:transform" were present. For comparison, here is a reference case with that style manually added:
https://jsfiddle.net/kkpznn6L/1/
Safari renders *that one* correctly (no red). So, that means Safari is mis-rendering the original testcase (https://jsfiddle.net/kkpznn6L/ ) -- it's not honoring this bit of CSS Animations spec text.
Firefox 55 and Edge 15 each produce the expected result, BTW.
Chrome 62 dev and Safari 10.1.2 produce the incorrect/unexpected result.
Chrome bug: https://bugs.chromium.org/p/chromium/issues/detail?id=764783
[1] "...any value other than 'none' for the transform also causes the element to ... [act] as a containing block for fixed positioned descendants."
https://drafts.csswg.org/css-transforms/#transform-rendering
--
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/20170913/9fd0beb0/attachment.html>
More information about the webkit-unassigned
mailing list