Index: LayoutTests/animations/composition/padding-top-composition.html |
diff --git a/LayoutTests/animations/composition/left-composition.html b/LayoutTests/animations/composition/padding-top-composition.html |
similarity index 52% |
copy from LayoutTests/animations/composition/left-composition.html |
copy to LayoutTests/animations/composition/padding-top-composition.html |
index ae89c507ac484be6584dd0985944c18bf07088f7..3b88e539b4e22dc9efcdd8b33eb21c6f1c48fa9a 100644 |
--- a/LayoutTests/animations/composition/left-composition.html |
+++ b/LayoutTests/animations/composition/padding-top-composition.html |
@@ -1,21 +1,10 @@ |
<!DOCTYPE html> |
<meta charset="UTF-8"> |
-<style> |
-.target { |
- position: relative; |
- width: 10px; |
- height: 10px; |
- background-color: black; |
-} |
-.expected { |
- background-color: green; |
-} |
-</style> |
<body> |
<script src="../interpolation/resources/interpolation-test.js"></script> |
<script> |
assertComposition({ |
- property: 'left', |
+ property: 'padding-top', |
underlying: '50px', |
addFrom: '100px', |
addTo: '200px', |
@@ -28,7 +17,33 @@ assertComposition({ |
]); |
assertComposition({ |
- property: 'left', |
+ property: 'padding-top', |
+ underlying: '100px', |
+ addFrom: '10px', |
+ addTo: '2px', |
+}, [ |
+ {at: -0.5, is: '114px'}, |
+ {at: 0, is: '110px'}, |
+ {at: 0.5, is: '106px'}, |
+ {at: 1, is: '102px'}, |
+ {at: 1.5, is: '98px'}, // Value clamping should happen after composition. |
+]); |
+ |
+assertComposition({ |
+ property: 'padding-top', |
+ underlying: '10%', |
+ addFrom: '100px', |
+ addTo: '20%', |
+}, [ |
+ {at: -0.3, is: 'calc(130px + 4%)'}, |
+ {at: 0, is: 'calc(100px + 10%)'}, |
+ {at: 0.5, is: 'calc(50px + 20%)'}, |
+ {at: 1, is: '30%'}, |
+ {at: 1.5, is: 'calc(-50px + 40%)'}, |
+]); |
+ |
+assertComposition({ |
+ property: 'padding-top', |
underlying: '50px', |
addFrom: '100px', |
replaceTo: '200px', |
@@ -39,18 +54,5 @@ assertComposition({ |
{at: 1, is: '200px'}, |
{at: 1.5, is: '225px'}, |
]); |
- |
-assertComposition({ |
- property: 'left', |
- underlying: 'auto', |
- addFrom: '100px', |
- addTo: '200px', |
-}, [ |
- {at: -0.3, is: '70px'}, |
- {at: 0, is: '100px'}, |
- {at: 0.5, is: '150px'}, |
- {at: 1, is: '200px'}, |
- {at: 1.5, is: '250px'}, |
-]); |
</script> |
</body> |