mirror of
https://github.com/servo/servo.git
synced 2025-10-17 08:49:21 +01:00
42 lines
1.8 KiB
HTML
42 lines
1.8 KiB
HTML
<!DOCTYPE html>
|
|
<title>'keySplines' with x-values outside of the 0 to 1 range</title>
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
<svg>
|
|
<rect x="10" width="10" height="10" fill="blue">
|
|
<animate attributeName="x" values="0; 250" dur="5s"/>
|
|
</rect>
|
|
<rect x="10" width="10" height="10" y="20" fill="blue">
|
|
<animate attributeName="x" values="0; 250" dur="5s"
|
|
keyTimes="0; 1" keySplines="-1 0 1 1" calcMode="spline"/>
|
|
</rect>
|
|
<rect x="10" width="10" height="10" y="30" fill="blue">
|
|
<animate attributeName="x" values="0; 250" dur="5s"
|
|
keyTimes="0; 1" keySplines="2 0 1 1" calcMode="spline"/>
|
|
</rect>
|
|
<rect x="10" width="10" height="10" y="10" fill="blue">
|
|
<animate attributeName="x" values="0; 250" dur="5s"
|
|
keyTimes="0; 1" keySplines="0 0 -1 1" calcMode="spline"/>
|
|
</rect>
|
|
<rect x="10" width="10" height="10" y="40" fill="blue">
|
|
<animate attributeName="x" values="0; 250" dur="5s"
|
|
keyTimes="0; 1" keySplines="0 0 2 1" calcMode="spline"/>
|
|
</rect>
|
|
</svg>
|
|
<script>
|
|
async_test(t => {
|
|
let svg = document.querySelector('svg');
|
|
svg.pauseAnimations();
|
|
svg.setCurrentTime(2.5);
|
|
window.onload = t.step_func(() => {
|
|
requestAnimationFrame(t.step_func_done(() => {
|
|
let rects = document.getElementsByTagName('rect');
|
|
assert_equals(rects[0].getBBox().x, 125, 'animations applied');
|
|
assert_equals(rects[1].getBBox().x, 10, 'first control point x less than zero');
|
|
assert_equals(rects[2].getBBox().x, 10, 'first control point x greater than one');
|
|
assert_equals(rects[3].getBBox().x, 10, 'second control point x less than zero');
|
|
assert_equals(rects[4].getBBox().x, 10, 'second control point x greater than one');
|
|
}));
|
|
});
|
|
});
|
|
</script>
|