Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(254)

Unified Diff: LayoutTests/animations/interpolation/transform-interpolation.html

Issue 1265873002: Add test coverage for interpolations using CSS wide keywords and neutral keyframes (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Rebased Created 5 years, 4 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: LayoutTests/animations/interpolation/transform-interpolation.html
diff --git a/LayoutTests/animations/interpolation/transform-interpolation.html b/LayoutTests/animations/interpolation/transform-interpolation.html
index 0a82076df4041c127634db24e8d9b9a09e659b29..fa14b356ff8fb4eaffca1e1c0d32129f3af6f8ae 100644
--- a/LayoutTests/animations/interpolation/transform-interpolation.html
+++ b/LayoutTests/animations/interpolation/transform-interpolation.html
@@ -1,6 +1,9 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<style>
+.parent {
+ transform: translate(30px);
+}
.target {
color: white;
width: 100px;
@@ -8,11 +11,15 @@
background-color: black;
display: inline-block;
overflow: hidden;
+ transform: translate(10px);
}
.expected {
background-color: green;
}
-.target div {
+.parent {
+ transform: 30px;
+}
+.target > div {
width: 10px;
height: 10px;
display: inline-block;
@@ -29,6 +36,57 @@
</template>
<script src="resources/interpolation-test.js"></script>
<script>
+assertInterpolation({
+ property: 'transform',
+ from: '',
+ to: 'translate(20px)',
+}, [
+ {at: -1, is: 'translate(0px)'},
+ {at: 0, is: 'translate(10px)'},
+ {at: 0.25, is: 'translate(12.5px)'},
+ {at: 0.75, is: 'translate(17.5px)'},
+ {at: 1, is: 'translate(20px)'},
+ {at: 2, is: 'translate(30px)'},
+]);
+
+assertInterpolation({
+ property: 'transform',
+ from: 'initial',
+ to: 'translate(20px)',
+}, [
+ {at: -1, is: 'translate(-20px)'},
+ {at: 0, is: 'translate(0px)'},
+ {at: 0.25, is: 'translate(5px)'},
+ {at: 0.75, is: 'translate(15px)'},
+ {at: 1, is: 'translate(20px)'},
+ {at: 2, is: 'translate(40px)'},
+]);
+
+assertInterpolation({
+ property: 'transform',
+ from: 'inherit',
+ to: 'translate(20px)',
+}, [
+ {at: -1, is: 'translate(40px)'},
+ {at: 0, is: 'translate(30px)'},
+ {at: 0.25, is: 'translate(27.5px)'},
+ {at: 0.75, is: 'translate(22.5px)'},
+ {at: 1, is: 'translate(20px)'},
+ {at: 2, is: 'translate(10px)'},
+]);
+
+assertInterpolation({
+ property: 'transform',
+ from: 'unset',
+ to: 'translate(20px)',
+}, [
+ {at: -1, is: 'translate(-20px)'},
+ {at: 0, is: 'translate(0px)'},
+ {at: 0.25, is: 'translate(5px)'},
+ {at: 0.75, is: 'translate(15px)'},
+ {at: 1, is: 'translate(20px)'},
+ {at: 2, is: 'translate(40px)'},
+]);
// Perspective
assertInterpolation({

Powered by Google App Engine
This is Rietveld 408576698