42 lines
1.6 KiB
HTML
42 lines
1.6 KiB
HTML
<!DOCTYPE html>
|
|
<title>Dependent timed element begin (restart) on syncbase</title>
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
<svg>
|
|
<rect width="10" height="10" fill="red">
|
|
<set attributeName="fill" to="blue" begin="0s; other.end" id="dependent"/>
|
|
</rect>
|
|
<rect x="10" width="10" height="10" fill="blue">
|
|
<animate attributeName="fill" from="yellow" to="red"
|
|
begin="indefinite" dur="10ms" id="other"/>
|
|
</rect>
|
|
</svg>
|
|
<script>
|
|
async_test(t => {
|
|
let count = 0;
|
|
let dependent = document.getElementById('dependent');
|
|
dependent.addEventListener('endEvent', t.step_func(() => count++));
|
|
let other = document.getElementById('other');
|
|
// Wait for #other to end and check animation values.
|
|
other.addEventListener('endEvent', t.step_func(() => {
|
|
t.step_timeout(() => {
|
|
assert_equals(count, 1);
|
|
assert_equals(getComputedStyle(dependent, null).fill, 'rgb(0, 0, 255)');
|
|
assert_equals(getComputedStyle(other, null).fill, 'rgb(0, 0, 255)');
|
|
t.done();
|
|
});
|
|
}));
|
|
let svg = other.ownerSVGElement;
|
|
// Check initial values.
|
|
window.onload = t.step_func(() => {
|
|
window.requestAnimationFrame(t.step_func(() => {
|
|
assert_equals(count, 0);
|
|
assert_equals(getComputedStyle(other, null).fill, 'rgb(0, 0, 255)');
|
|
assert_equals(getComputedStyle(dependent, null).fill, 'rgb(0, 0, 255)');
|
|
svg.unpauseAnimations();
|
|
}));
|
|
});
|
|
svg.pauseAnimations();
|
|
other.beginElementAt(0.01);
|
|
});
|
|
</script>
|