mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-10-09 03:15:11 +00:00
84aff91995
When an animation is newly created while the same property transition is running, the transition style rule persists until we call RequestRestyle() for transitions level. That means if user calls getComputedStyle for the property right after creating animation, the style obtained by getComputedStyle still included the transitions level rule. As a result, the transitions level style overrides newly created animation style until the next normal restyling process happens (i.e. process transition level restyle request). Vice versa, in the case where an animation is removed, transitions level style does not appear until the next normal restyling. This patch fixes this problem by trigerring a resyle of the transitions level when an animation is created or removed. MozReview-Commit-ID: HY6amLmDHTi --HG-- extra : rebase_source : 67e58dc9a6c695299c3eef684bf7357153c5168b
38 lines
1.0 KiB
HTML
38 lines
1.0 KiB
HTML
<!doctype html>
|
|
<meta charset=utf-8>
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
<script src="../testcommon.js"></script>
|
|
<style>
|
|
@keyframes margin-left {
|
|
from { margin-left: 20px; }
|
|
to { margin-left: 80px; }
|
|
}
|
|
</style>
|
|
<body>
|
|
<div id="log"></div>
|
|
<script>
|
|
'use strict';
|
|
|
|
test(function(t) {
|
|
var div = addDiv(t, { style: 'transition: margin-left 100s; ' +
|
|
'margin-left: 80px' });
|
|
var cs = getComputedStyle(div);
|
|
|
|
assert_equals(cs.marginLeft, '80px', 'initial margin-left');
|
|
|
|
div.style.marginLeft = "20px";
|
|
assert_equals(cs.marginLeft, '80px', 'margin-left transition at 0s');
|
|
|
|
div.style.animation = "margin-left 2s";
|
|
assert_equals(cs.marginLeft, '20px',
|
|
'margin-left animation overrides transition at 0s');
|
|
|
|
div.style.animation = "none";
|
|
assert_equals(cs.marginLeft, '80px',
|
|
'margin-left animation stops overriding transition at 0s');
|
|
}, 'Animation overrides/stops overriding transition immediately');
|
|
|
|
</script>
|
|
</body>
|