Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-03 04:30:10 +01:00
Code Issues Projects Releases Packages Wiki Activity

Auto merge of #26074 - jdm:transition-fix, r=SimonSapin

Browse source 
Avoid infinitely looping CSS transitions.

This change addresses the long-standing issue of CSS transitions not ending appropriately. It does not fundamentally change the way we process transitions/animations.

---
- [x] `./mach build -d` does not report any errors
- [x] `./mach test-tidy` does not report any errors
- [x] These changes fix #20379
- [x] There are tests for these changes
This commit is contained in:
bors-servo 2020-04-01 15:19:15 -04:00 • committed by GitHub
commit 516279e24f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 61 additions and 20 deletions
Download patch file Download diff file Expand all files Collapse all files

4
tests/wpt/mozilla/meta-layout-2020/css/transitionend_event.html.ini Normal file
View file

@ -0,0 +1,4 @@
[transitionend_event.html]
expected: TIMEOUT
[transitionend_event]
expected: TIMEOUT

7
tests/wpt/mozilla/meta/MANIFEST.json
View file

@ -13031,6 +13031,13 @@
{}
]
],
"transitionend_event.html": [
"71b88117a0280fbffcf3ab77105c0460317c66c8",
[
null,
{}
]
],
"white-space-pre-line-long-line.html": [
"bf0d0085fef0f1639637b2e652a7fb857cd51bf6",
[

27
tests/wpt/mozilla/tests/css/transitionend_event.html Normal file
View file

@ -0,0 +1,27 @@
<html>
<head>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
#test {
width: 10px;
height: 10px;
background: black;
transition: 1ms linear transform;
}
.transform {
transform:scale(1.2);
}
</style>
<div id="test" class="transform"></div>
<script>
async_test(function(t) {
let d = document.querySelector('div');
// Verify that we only receive a single transitionend event once the transition is complete.
d.ontransitionend = t.step_func(() => {
d.ontransitionend = t.unreached_func();
t.step_timeout(() => t.done(), 100);
});
t.step_timeout(() => d.className = "", 10);
});
</script>