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

Auto merge of #26244 - mrobinson:animation-cancel, r=jdm

Browse source 
Add support for canceling CSS transitions

This change adds support for canceling CSS transitions when a property is
no longer transitionable. Support for canceling and replacing CSS
transitions when the end value changes is still pending. This change
also takes advantage of updating the constellation message to fix a bug
where transition events could be sent for closed pipelines.

Fixes #15079.

<!-- Please describe your changes on the following line: -->

---
<!-- Thank you for contributing to Servo! Please replace each `[ ]` by `[X]` when the step is complete, and replace `___` with appropriate data: -->
- [x] `./mach build -d` does not report any errors
- [x] `./mach test-tidy` does not report any errors
- [x] These changes fix #15079.

<!-- Either: -->
- [x] There are tests for these changes OR
- [ ] These changes do not require tests because ___

<!-- Also, please make sure that "Allow edits from maintainers" checkbox is checked, so that we can help you if you get stuck somewhere along the way.-->

<!-- Pull requests that do not address these steps are welcome, but they will require additional verification as part of the review process. -->
This commit is contained in:
bors-servo 2020-04-22 15:34:06 -04:00 • committed by GitHub
commit 610991bdfc
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
15 changed files with 351 additions and 153 deletions
Download patch file Download diff file Expand all files Collapse all files

7
tests/wpt/metadata/MANIFEST.json
View file

@ -399093,6 +399093,13 @@
}
]
],
"transitioncancel-002.html": [
"e62b17b5dc60ef762e0a0780c967b6e014da5bc9",
[
null,
{}
]
],
"transitionevent-interface.html": [
"a40ba4537518361c13aab1d9b0648387f7c88aaa",
[

18
tests/wpt/metadata/css/css-transitions/idlharness.html.ini
View file

@ -5,42 +5,24 @@
[HTMLElement interface: attribute ontransitionstart]
expected: FAIL
[Document interface: attribute ontransitioncancel]
expected: FAIL
[Document interface: document must inherit property "ontransitionstart" with the proper type]
expected: FAIL
[Document interface: document must inherit property "ontransitioncancel" with the proper type]
expected: FAIL
[HTMLElement interface: attribute ontransitionrun]
expected: FAIL
[HTMLElement interface: document must inherit property "ontransitioncancel" with the proper type]
expected: FAIL
[Window interface: attribute ontransitionrun]
expected: FAIL
[Window interface: attribute ontransitioncancel]
expected: FAIL
[HTMLElement interface: document must inherit property "ontransitionstart" with the proper type]
expected: FAIL
[HTMLElement interface: attribute ontransitioncancel]
expected: FAIL
[HTMLElement interface: document must inherit property "ontransitionrun" with the proper type]
expected: FAIL
[Window interface: window must inherit property "ontransitionrun" with the proper type]
expected: FAIL
[Window interface: window must inherit property "ontransitioncancel" with the proper type]
expected: FAIL
[Document interface: attribute ontransitionstart]
expected: FAIL

4
tests/wpt/metadata/css/css-transitions/transitioncancel-001.html.ini
View file

@ -1,4 +0,0 @@
[transitioncancel-001.html]
[transitioncancel should be fired if the element is made display:none during the transition]
expected: FAIL

46
tests/wpt/web-platform-tests/css/css-transitions/transitioncancel-002.html Normal file
View file

@ -0,0 +1,46 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Transitions Test: Removing transitioning property from transition-property triggers transitioncancel</title>
<link rel="author" title="Martin Robinson" href="mailto:mrobinson@igalia.com">
<meta name="assert" content="Removing transitioning property from transition-property
causes transitioncancel.">
<link rel="help" href="https://drafts.csswg.org/css-transitions-2/#event-dispatch">
<script src="/resources/testharness.js" type="text/javascript"></script>
<script src="/resources/testharnessreport.js" type="text/javascript"></script>
<script src="./support/helper.js" type="text/javascript"></script>
</head>
<body>
<div id="log"></div>
<script>
promise_test(async t => {
// Create element and prepare to trigger a transition on it.
const div = addDiv(t, {
style: 'transition: background-color 0.25s; background-color: red;',
});
// Attach event listeners
const eventWatcher = new EventWatcher(t, div, ['transitioncancel']);
div.addEventListener('transitionend', t.step_func((event) => {
assert_unreached('transitionend event should not be fired');
}));
// Trigger transition
getComputedStyle(div).backgroundColor;
div.style.backgroundColor = 'green';
getComputedStyle(div).backgroundColor;
// Remove the transitioning property from transition-property asynchronously.
await waitForFrame();
div.style.transitionProperty = 'none';
await eventWatcher.wait_for('transitioncancel');
}, 'Removing a transitioning property from transition-property should trigger transitioncancel');
</script>
</body>
</html>