Skip to content

GitLab

T
tangled
Commit ccf3f604 authored by Stephen McGruer's avatar Stephen McGruer Committed by Commit Bot
Browse files
Options

Port {top, left, right, bottom}-interpolation.html to WPT 

Bug: 900581
Change-Id: Ib549a18ca17223ee252b2171194e25357f0ef45f
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1758133Reviewed-by: default avatarXida Chen <xidachen@chromium.org>
Commit-Queue: Stephen McGruer <smcgruer@chromium.org>
Cr-Commit-Position: refs/heads/master@{#687647}
parent ab46f66a
Hide whitespace changes
Inline Side-by-side
Showing with 310 additions and 0 deletions
third_party/blink/web_tests/animations/interpolation/bottom-interpolation.html → third_party/blink/web_tests/external/wpt/css/css-position/animations/bottom-interpolation.html
View file @ ccf3f604
<!DOCTYPE html>
<meta charset="UTF-8">
<link rel="help" href="https://drafts.csswg.org/css-position-3/#propdef-bottom">
<meta name="test" content="bottom supports animation as a length or percentage">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<style>
.parent {
bottom: 30px;
......@@ -17,55 +24,55 @@
background-color: green;
}
</style>
<body>
<script src="resources/interpolation-test.js"></script>
<body></body>
<script>
assertInterpolation({
test_interpolation({
property: 'bottom',
from: neutralKeyframe,
to: '20px',
}, [
{at: -0.3, is: '7px'},
{at: 0, is: '10px'},
{at: 0.5, is: '15px'},
{at: 1, is: '20px'},
{at: 1.5, is: '25px'},
{at: -0.3, expect: '7px'},
{at: 0, expect: '10px'},
{at: 0.5, expect: '15px'},
{at: 1, expect: '20px'},
{at: 1.5, expect: '25px'},
]);
assertNoInterpolation({
test_no_interpolation({
property: 'bottom',
from: 'initial',
to: '20px',
});
assertInterpolation({
test_interpolation({
property: 'bottom',
from: 'inherit',
to: '20px',
}, [
{at: -0.3, is: '33px'},
{at: 0, is: '30px'},
{at: 0.5, is: '25px'},
{at: 1, is: '20px'},
{at: 1.5, is: '15px'},
{at: -0.3, expect: '33px'},
{at: 0, expect: '30px'},
{at: 0.5, expect: '25px'},
{at: 1, expect: '20px'},
{at: 1.5, expect: '15px'},
]);
assertNoInterpolation({
test_no_interpolation({
property: 'bottom',
from: 'unset',
to: '20px',
});
assertInterpolation({
test_interpolation({
property: 'bottom',
from: '-10px',
to: '10px'
}, [
{at: -0.3, is: '-16px'},
{at: 0, is: '-10px'},
{at: 0.5, is: '0px'},
{at: 1, is: '10px'},
{at: 1.5, is: '20px'}
{at: -0.3, expect: '-16px'},
{at: 0, expect: '-10px'},
{at: 0.5, expect: '0px'},
{at: 1, expect: '10px'},
{at: 1.5, expect: '20px'}
]);
</script>
</body>
third_party/blink/web_tests/animations/interpolation/left-interpolation.html → third_party/blink/web_tests/external/wpt/css/css-position/animations/left-interpolation.html
View file @ ccf3f604
<!DOCTYPE html>
<meta charset="UTF-8">
<link rel="help" href="https://drafts.csswg.org/css-position-3/#propdef-left">
<meta name="test" content="left supports animation as a length or percentage">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<style>
.parent {
position: relative;
......@@ -16,55 +23,54 @@
background-color: green;
}
</style>
<body>
<script src="resources/interpolation-test.js"></script>
<body></body>
<script>
assertInterpolation({
test_interpolation({
property: 'left',
from: neutralKeyframe,
to: '20px',
}, [
{at: -0.3, is: '7px'},
{at: 0, is: '10px'},
{at: 0.5, is: '15px'},
{at: 1, is: '20px'},
{at: 1.5, is: '25px'},
{at: -0.3, expect: '7px'},
{at: 0, expect: '10px'},
{at: 0.5, expect: '15px'},
{at: 1, expect: '20px'},
{at: 1.5, expect: '25px'},
]);
assertNoInterpolation({
test_no_interpolation({
property: 'left',
from: 'initial',
to: '20px',
});
assertInterpolation({
test_interpolation({
property: 'left',
from: 'inherit',
to: '20px',
}, [
{at: -0.3, is: '33px'},
{at: 0, is: '30px'},
{at: 0.5, is: '25px'},
{at: 1, is: '20px'},
{at: 1.5, is: '15px'},
{at: -0.3, expect: '33px'},
{at: 0, expect: '30px'},
{at: 0.5, expect: '25px'},
{at: 1, expect: '20px'},
{at: 1.5, expect: '15px'},
]);
assertNoInterpolation({
test_no_interpolation({
property: 'left',
from: 'unset',
to: '20px',
});
assertInterpolation({
test_interpolation({
property: 'left',
from: '-10px',
to: '10px'
}, [
{at: -0.3, is: '-16px'},
{at: 0, is: '-10px'},
{at: 0.5, is: '0px'},
{at: 1, is: '10px'},
{at: 1.5, is: '20px'}
{at: -0.3, expect: '-16px'},
{at: 0, expect: '-10px'},
{at: 0.5, expect: '0px'},
{at: 1, expect: '10px'},
{at: 1.5, expect: '20px'}
]);
</script>
</body>
third_party/blink/web_tests/animations/interpolation/right-interpolation.html → third_party/blink/web_tests/external/wpt/css/css-position/animations/right-interpolation.html
View file @ ccf3f604
<!DOCTYPE html>
<meta charset="UTF-8">
<link rel="help" href="https://drafts.csswg.org/css-position-3/#propdef-right">
<meta name="test" content="right supports animation as a length or percentage">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<style>
.parent {
margin-left: 40px;
......@@ -16,55 +23,55 @@
background-color: green;
}
</style>
<body>
<script src="resources/interpolation-test.js"></script>
<body></body>
<script>
assertInterpolation({
test_interpolation({
property: 'right',
from: neutralKeyframe,
to: '20px',
}, [
{at: -0.3, is: '7px'},
{at: 0, is: '10px'},
{at: 0.5, is: '15px'},
{at: 1, is: '20px'},
{at: 1.5, is: '25px'},
{at: -0.3, expect: '7px'},
{at: 0, expect: '10px'},
{at: 0.5, expect: '15px'},
{at: 1, expect: '20px'},
{at: 1.5, expect: '25px'},
]);
assertNoInterpolation({
test_no_interpolation({
property: 'right',
from: 'initial',
to: '20px',
});
assertInterpolation({
test_interpolation({
property: 'right',
from: 'inherit',
to: '20px',
}, [
{at: -0.3, is: '33px'},
{at: 0, is: '30px'},
{at: 0.5, is: '25px'},
{at: 1, is: '20px'},
{at: 1.5, is: '15px'},
{at: -0.3, expect: '33px'},
{at: 0, expect: '30px'},
{at: 0.5, expect: '25px'},
{at: 1, expect: '20px'},
{at: 1.5, expect: '15px'},
]);
assertNoInterpolation({
test_no_interpolation({
property: 'right',
from: 'unset',
to: '20px',
});
assertInterpolation({
test_interpolation({
property: 'right',
from: '-10px',
to: '10px'
}, [
{at: -0.3, is: '-16px'},
{at: 0, is: '-10px'},
{at: 0.5, is: '0px'},
{at: 1, is: '10px'},
{at: 1.5, is: '20px'}
{at: -0.3, expect: '-16px'},
{at: 0, expect: '-10px'},
{at: 0.5, expect: '0px'},
{at: 1, expect: '10px'},
{at: 1.5, expect: '20px'}
]);
</script>
</body>
third_party/blink/web_tests/animations/interpolation/top-interpolation.html → third_party/blink/web_tests/external/wpt/css/css-position/animations/top-interpolation.html
View file @ ccf3f604
<!DOCTYPE html>
<meta charset="UTF-8">
<link rel="help" href="https://drafts.csswg.org/css-position-3/#propdef-top">
<meta name="assert" content="top supports animation as a length or percentage">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<style>
.parent {
top: 30px;
......@@ -18,55 +25,55 @@
margin-right: 10px;
}
</style>
<body>
<script src="resources/interpolation-test.js"></script>
<body></body>
<script>
assertInterpolation({
test_interpolation({
property: 'top',
from: neutralKeyframe,
to: '20px',
}, [
{at: -0.3, is: '7px'},
{at: 0, is: '10px'},
{at: 0.5, is: '15px'},
{at: 1, is: '20px'},
{at: 1.5, is: '25px'},
{at: -0.3, expect: '7px'},
{at: 0, expect: '10px'},
{at: 0.5, expect: '15px'},
{at: 1, expect: '20px'},
{at: 1.5, expect: '25px'},
]);
assertNoInterpolation({
test_no_interpolation({
property: 'top',
from: 'initial',
to: '20px',
});
assertInterpolation({
test_interpolation({
property: 'top',
from: 'inherit',
to: '20px',
}, [
{at: -0.3, is: '33px'},
{at: 0, is: '30px'},
{at: 0.5, is: '25px'},
{at: 1, is: '20px'},
{at: 1.5, is: '15px'},
{at: -0.3, expect: '33px'},
{at: 0, expect: '30px'},
{at: 0.5, expect: '25px'},
{at: 1, expect: '20px'},
{at: 1.5, expect: '15px'},
]);
assertNoInterpolation({
test_no_interpolation({
property: 'top',
from: 'unset',
to: '20px',
});
assertInterpolation({
test_interpolation({
property: 'top',
from: '-10px',
to: '10px'
}, [
{at: -0.3, is: '-16px'},
{at: 0, is: '-10px'},
{at: 0.5, is: '0px'},
{at: 1, is: '10px'},
{at: 1.5, is: '20px'}
{at: -0.3, expect: '-16px'},
{at: 0, expect: '-10px'},
{at: 0.5, expect: '0px'},
{at: 1, expect: '10px'},
{at: 1.5, expect: '20px'}
]);
</script>
</body>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment