mirror of
https://github.com/servo/servo.git
synced 2025-07-01 04:23:39 +01:00
89 lines
3.3 KiB
HTML
89 lines
3.3 KiB
HTML
<!DOCTYPE html>
|
|
<meta charset=utf-8>
|
|
<title>Document.getAnimations</title>
|
|
<link rel="help" href="https://drafts.csswg.org/web-animations/#dom-document-getanimations">
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
<script src="../../testcommon.js"></script>
|
|
<body>
|
|
<div id="log"></div>
|
|
<div id="target"></div>
|
|
<script>
|
|
'use strict';
|
|
|
|
const gKeyFrames = { 'marginLeft': ['100px', '200px'] };
|
|
|
|
test(t => {
|
|
assert_equals(document.getAnimations().length, 0,
|
|
'getAnimations returns an empty sequence for a document ' +
|
|
'with no animations');
|
|
}, 'Test document.getAnimations for non-animated content');
|
|
|
|
test(t => {
|
|
const div = createDiv(t);
|
|
const anim1 = div.animate(gKeyFrames, 100 * MS_PER_SEC);
|
|
const anim2 = div.animate(gKeyFrames, 100 * MS_PER_SEC);
|
|
assert_equals(document.getAnimations().length, 2,
|
|
'getAnimation returns running animations');
|
|
|
|
anim1.finish();
|
|
anim2.finish();
|
|
assert_equals(document.getAnimations().length, 0,
|
|
'getAnimation only returns running animations');
|
|
}, 'Test document.getAnimations for script-generated animations')
|
|
|
|
test(t => {
|
|
const div = createDiv(t);
|
|
const anim1 = div.animate(gKeyFrames, 100 * MS_PER_SEC);
|
|
const anim2 = div.animate(gKeyFrames, 100 * MS_PER_SEC);
|
|
assert_array_equals(document.getAnimations(),
|
|
[ anim1, anim2 ],
|
|
'getAnimations() returns running animations');
|
|
}, 'Test the order of document.getAnimations with script generated animations')
|
|
|
|
test(t => {
|
|
// This element exists but is not a descendent of any document, so isn't
|
|
// picked up by getAnimations.
|
|
const div = document.createElement('div');
|
|
const anim = div.animate(gKeyFrames, 100 * MS_PER_SEC);
|
|
assert_equals(document.getAnimations().length, 0);
|
|
|
|
// Now connect the div; it should appear in the list of animations.
|
|
document.body.appendChild(div);
|
|
t.add_cleanup(() => { div.remove(); });
|
|
assert_equals(document.getAnimations().length, 1);
|
|
}, 'Test document.getAnimations for a disconnected node');
|
|
|
|
test(t => {
|
|
const effect = new KeyframeEffect(null, gKeyFrames, 100 * MS_PER_SEC);
|
|
const anim = new Animation(effect, document.timeline);
|
|
anim.play();
|
|
|
|
assert_equals(document.getAnimations().length, 0,
|
|
'document.getAnimations() only returns animations targeting ' +
|
|
'elements in this document');
|
|
}, 'Test document.getAnimations with null target');
|
|
|
|
async_test(t => {
|
|
const iframe = document.createElement('iframe');
|
|
|
|
iframe.addEventListener("load", t.step_func_done(function() {
|
|
const div = createDiv(t, iframe.contentDocument)
|
|
const effect = new KeyframeEffect(div, null, 100 * MS_PER_SEC);
|
|
const anim = new Animation(effect, document.timeline);
|
|
anim.play();
|
|
|
|
// The animation's timeline is from the main document, but the effect's
|
|
// target element is part of the iframe document and that is what matters
|
|
// for getAnimations.
|
|
assert_equals(document.getAnimations().length, 0);
|
|
assert_equals(iframe.contentDocument.getAnimations().length, 1);
|
|
anim.finish();
|
|
}));
|
|
|
|
document.body.appendChild(iframe);
|
|
t.add_cleanup(function() { document.body.removeChild(iframe); });
|
|
}, 'Test document.getAnimations for elements inside same-origin iframes');
|
|
|
|
</script>
|
|
</body>
|