- Revision
- 224968
- Author
- [email protected]
- Date
- 2017-11-17 09:42:35 -0800 (Fri, 17 Nov 2017)
Log Message
[Web Animations] Force a stacking context during animations that animate properties that will force a stacking context
https://bugs.webkit.org/show_bug.cgi?id=179811
Reviewed by Dean Jackson.
Source/WebCore:
The Web Animations specification mandates in section 4.7 (w3c.github.io/web-animations/#side-effects-section) that
"for every property targeted by at least one animation effect that is current or in effect, the user agent must act
as if the will-change property ([css-will-change-1]) on the target element includes the property."
After parsing new keyframes, we check if any of the CSS properties that get animated would end up forcing a stacking
context, and if so, enforce a stacking context during the entire active lifetime of the animation.
Test: webanimations/animation-opacity-animation-crash.html
* animation/KeyframeEffect.cpp:
(WebCore::KeyframeEffect::processKeyframes):
(WebCore::KeyframeEffect::computeStackingContextImpact):
(WebCore::KeyframeEffect::applyAtLocalTime):
* animation/KeyframeEffect.h:
LayoutTests:
Adding a new test that would crash otherwise because we wouldn't adequately force a stacking
context as the animation would begin.
* webanimations/animation-opacity-animation-crash-expected.txt: Added.
* webanimations/animation-opacity-animation-crash.html: Added.
Modified Paths
Added Paths
Diff
Modified: trunk/LayoutTests/ChangeLog (224967 => 224968)
--- trunk/LayoutTests/ChangeLog 2017-11-17 16:25:15 UTC (rev 224967)
+++ trunk/LayoutTests/ChangeLog 2017-11-17 17:42:35 UTC (rev 224968)
@@ -1,3 +1,16 @@
+2017-11-16 Antoine Quint <[email protected]>
+
+ [Web Animations] Force a stacking context during animations that animate properties that will force a stacking context
+ https://bugs.webkit.org/show_bug.cgi?id=179811
+
+ Reviewed by Dean Jackson.
+
+ Adding a new test that would crash otherwise because we wouldn't adequately force a stacking
+ context as the animation would begin.
+
+ * webanimations/animation-opacity-animation-crash-expected.txt: Added.
+ * webanimations/animation-opacity-animation-crash.html: Added.
+
2017-11-16 Commit Queue <[email protected]>
Unreviewed, rolling out r224921.
Added: trunk/LayoutTests/webanimations/animation-opacity-animation-crash-expected.txt (0 => 224968)
--- trunk/LayoutTests/webanimations/animation-opacity-animation-crash-expected.txt (rev 0)
+++ trunk/LayoutTests/webanimations/animation-opacity-animation-crash-expected.txt 2017-11-17 17:42:35 UTC (rev 224968)
@@ -0,0 +1,7 @@
+layer at (0,0) size 800x600
+ RenderView at (0,0) size 800x600
+layer at (0,0) size 800x600
+ RenderBlock {HTML} at (0,0) size 800x600
+ RenderBody {BODY} at (8,8) size 784x584
+layer at (8,8) size 100x100
+ RenderBlock {DIV} at (0,0) size 100x100 [bgcolor=#000000]
Added: trunk/LayoutTests/webanimations/animation-opacity-animation-crash.html (0 => 224968)
--- trunk/LayoutTests/webanimations/animation-opacity-animation-crash.html (rev 0)
+++ trunk/LayoutTests/webanimations/animation-opacity-animation-crash.html 2017-11-17 17:42:35 UTC (rev 224968)
@@ -0,0 +1,11 @@
+<div id="target" style="width: 100px; height: 100px; background-color: black;"></div>
+<script>
+
+const animation = new Animation(new KeyframeEffect(document.getElementById("target"), [
+ { opacity: 1 },
+ { opacity: 0 }
+]));
+animation.startTime = 0;
+animation.effect.timing.duration = 1000;
+
+</script>
Modified: trunk/Source/WebCore/ChangeLog (224967 => 224968)
--- trunk/Source/WebCore/ChangeLog 2017-11-17 16:25:15 UTC (rev 224967)
+++ trunk/Source/WebCore/ChangeLog 2017-11-17 17:42:35 UTC (rev 224968)
@@ -1,3 +1,25 @@
+2017-11-16 Antoine Quint <[email protected]>
+
+ [Web Animations] Force a stacking context during animations that animate properties that will force a stacking context
+ https://bugs.webkit.org/show_bug.cgi?id=179811
+
+ Reviewed by Dean Jackson.
+
+ The Web Animations specification mandates in section 4.7 (w3c.github.io/web-animations/#side-effects-section) that
+ "for every property targeted by at least one animation effect that is current or in effect, the user agent must act
+ as if the will-change property ([css-will-change-1]) on the target element includes the property."
+
+ After parsing new keyframes, we check if any of the CSS properties that get animated would end up forcing a stacking
+ context, and if so, enforce a stacking context during the entire active lifetime of the animation.
+
+ Test: webanimations/animation-opacity-animation-crash.html
+
+ * animation/KeyframeEffect.cpp:
+ (WebCore::KeyframeEffect::processKeyframes):
+ (WebCore::KeyframeEffect::computeStackingContextImpact):
+ (WebCore::KeyframeEffect::applyAtLocalTime):
+ * animation/KeyframeEffect.h:
+
2017-11-17 Ali Juma <[email protected]>
Update feature status for Visual Viewport API to "In Development"
Modified: trunk/Source/WebCore/animation/KeyframeEffect.cpp (224967 => 224968)
--- trunk/Source/WebCore/animation/KeyframeEffect.cpp 2017-11-17 16:25:15 UTC (rev 224967)
+++ trunk/Source/WebCore/animation/KeyframeEffect.cpp 2017-11-17 17:42:35 UTC (rev 224968)
@@ -31,6 +31,7 @@
#include "RenderStyle.h"
#include "StyleProperties.h"
#include "StyleResolver.h"
+#include "WillChangeData.h"
namespace WebCore {
using namespace JSC;
@@ -118,9 +119,24 @@
m_keyframes = WTFMove(newKeyframes);
+ computeStackingContextImpact();
+
return { };
}
+void KeyframeEffect::computeStackingContextImpact()
+{
+ m_triggersStackingContext = false;
+ for (auto& keyframe : m_keyframes) {
+ for (auto propertyID : keyframe.properties) {
+ if (WillChangeData::propertyCreatesStackingContext(propertyID)) {
+ m_triggersStackingContext = true;
+ break;
+ }
+ }
+ }
+}
+
void KeyframeEffect::applyAtLocalTime(Seconds localTime, RenderStyle& targetStyle)
{
if (!m_target)
@@ -139,6 +155,12 @@
// FIXME: This will crash if we attempt to animate properties that require an AnimationBase.
for (auto propertyId : m_keyframes[0].properties)
CSSPropertyAnimation::blendProperties(this, propertyId, &targetStyle, &m_keyframes[0].style, &m_keyframes[1].style, progress);
+
+ // https://w3c.github.io/web-animations/#side-effects-section
+ // For every property targeted by at least one animation effect that is current or in effect, the user agent
+ // must act as if the will-change property ([css-will-change-1]) on the target element includes the property.
+ if (m_triggersStackingContext && targetStyle.hasAutoZIndex())
+ targetStyle.setZIndex(0);
}
RenderElement* KeyframeEffect::renderer() const
Modified: trunk/Source/WebCore/animation/KeyframeEffect.h (224967 => 224968)
--- trunk/Source/WebCore/animation/KeyframeEffect.h 2017-11-17 16:25:15 UTC (rev 224967)
+++ trunk/Source/WebCore/animation/KeyframeEffect.h 2017-11-17 17:42:35 UTC (rev 224968)
@@ -61,8 +61,11 @@
private:
KeyframeEffect(Element*);
ExceptionOr<void> processKeyframes(JSC::ExecState&, JSC::Strong<JSC::JSObject>&&);
+ void computeStackingContextImpact();
+
RefPtr<Element> m_target;
Vector<Keyframe> m_keyframes;
+ bool m_triggersStackingContext { false };
};
