Skip to content
Permalink
Browse files
2010-03-05 Dean Jackson <dino@apple.com>
        Reviewed by Simon Fraser.

        https://bugs.webkit.org/show_bug.cgi?id=35772
        Animation fill modes should be supported in the shorthand property

        Add CSSPropertyWebkitAnimationFillMode to the list of properties
        evaluated in the -webkit-animation shorthand.

        Test: animations/animation-shorthand.html

        * css/CSSParser.cpp:
        (WebCore::CSSParser::parseAnimationShorthand):

Canonical link: https://commits.webkit.org/46902@main
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@55605 268f45cc-cd09-0410-ab3c-d52691b4dbfc
  • Loading branch information
grorg committed Mar 6, 2010
1 parent 3783e87 commit 4995ac11cfa46f95bc38912de1005ef95b2195a9
Showing 5 changed files with 209 additions and 1 deletion.
@@ -1,3 +1,16 @@
2010-03-05 Dean Jackson <dino@apple.com>

Reviewed by Simon Fraser.

https://bugs.webkit.org/show_bug.cgi?id=35772
Animation fill modes should be supported in the shorthand property

Testcase for animation shorthand property (appears to be
the first of its kind).

* animations/animation-shorthand-expected.txt: Added.
* animations/animation-shorthand.html: Added.

2010-03-05 Eric Seidel <eric@webkit.org>

No review. Skipping recently regressed test to unblock the commit-queue (20 patches waiting).
@@ -0,0 +1,71 @@
Testing webkitAnimationName on a: PASS
Testing webkitAnimationDuration on a: PASS
Testing webkitAnimationTimingFunction on a: PASS
Testing webkitAnimationDelay on a: PASS
Testing webkitAnimationIterationCount on a: PASS
Testing webkitAnimationDirection on a: PASS
Testing webkitAnimationFillMode on a: PASS
Testing webkitAnimationName on b: PASS
Testing webkitAnimationDuration on b: PASS
Testing webkitAnimationTimingFunction on b: PASS
Testing webkitAnimationDelay on b: PASS
Testing webkitAnimationIterationCount on b: PASS
Testing webkitAnimationDirection on b: PASS
Testing webkitAnimationFillMode on b: PASS
Testing webkitAnimationName on c: PASS
Testing webkitAnimationDuration on c: PASS
Testing webkitAnimationTimingFunction on c: PASS
Testing webkitAnimationDelay on c: PASS
Testing webkitAnimationIterationCount on c: PASS
Testing webkitAnimationDirection on c: PASS
Testing webkitAnimationFillMode on c: PASS
Testing webkitAnimationName on d: PASS
Testing webkitAnimationDuration on d: PASS
Testing webkitAnimationTimingFunction on d: PASS
Testing webkitAnimationDelay on d: PASS
Testing webkitAnimationIterationCount on d: PASS
Testing webkitAnimationDirection on d: PASS
Testing webkitAnimationFillMode on d: PASS
Testing webkitAnimationName on e: PASS
Testing webkitAnimationDuration on e: PASS
Testing webkitAnimationTimingFunction on e: PASS
Testing webkitAnimationDelay on e: PASS
Testing webkitAnimationIterationCount on e: PASS
Testing webkitAnimationDirection on e: PASS
Testing webkitAnimationFillMode on e: PASS
Testing webkitAnimationName on f: PASS
Testing webkitAnimationDuration on f: PASS
Testing webkitAnimationTimingFunction on f: PASS
Testing webkitAnimationDelay on f: PASS
Testing webkitAnimationIterationCount on f: PASS
Testing webkitAnimationDirection on f: PASS
Testing webkitAnimationFillMode on f: PASS
Testing webkitAnimationName on g: PASS
Testing webkitAnimationDuration on g: PASS
Testing webkitAnimationTimingFunction on g: PASS
Testing webkitAnimationDelay on g: PASS
Testing webkitAnimationIterationCount on g: PASS
Testing webkitAnimationDirection on g: PASS
Testing webkitAnimationFillMode on g: PASS
Testing webkitAnimationName on h: PASS
Testing webkitAnimationDuration on h: PASS
Testing webkitAnimationTimingFunction on h: PASS
Testing webkitAnimationDelay on h: PASS
Testing webkitAnimationIterationCount on h: PASS
Testing webkitAnimationDirection on h: PASS
Testing webkitAnimationFillMode on h: PASS
Testing webkitAnimationName on i: PASS
Testing webkitAnimationDuration on i: PASS
Testing webkitAnimationTimingFunction on i: PASS
Testing webkitAnimationDelay on i: PASS
Testing webkitAnimationIterationCount on i: PASS
Testing webkitAnimationDirection on i: PASS
Testing webkitAnimationFillMode on i: PASS
Testing webkitAnimationName on j: PASS
Testing webkitAnimationDuration on j: PASS
Testing webkitAnimationTimingFunction on j: PASS
Testing webkitAnimationDelay on j: PASS
Testing webkitAnimationIterationCount on j: PASS
Testing webkitAnimationDirection on j: PASS
Testing webkitAnimationFillMode on j: PASS

@@ -0,0 +1,108 @@
<html>
<head>
<title>Test animation shorthand property</title>
<style type="text/css" media="screen">
.box {
height: 10px;
width: 10px;
background-color: blue;
}
#a {
}
#b {
-webkit-animation: none;
}
#c {
-webkit-animation: anim1 10s;
}
#d {
-webkit-animation: anim1 10s linear;
}
#e {
-webkit-animation: anim1 10s linear 5s;
}
#f {
-webkit-animation: anim1 10s linear 5s 3;
}
#g {
-webkit-animation: anim1 10s linear 5s infinite alternate;
}
#h {
-webkit-animation: anim1 10s linear 5s infinite alternate forwards;
}
#i {
-webkit-animation: anim1 10s linear normal none;
}
#j {
-webkit-animation: anim1 10s linear infinite backwards, anim2 3s none, anim3 5s both;
}

@-webkit-keyframes anim1 { }
@-webkit-keyframes anim2 { }
</style>
<script type="text/javascript" charset="utf-8">
if (window.layoutTestController)
layoutTestController.dumpAsText();

const kProperties = [
"webkitAnimationName",
"webkitAnimationDuration",
"webkitAnimationTimingFunction",
"webkitAnimationDelay",
"webkitAnimationIterationCount",
"webkitAnimationDirection",
"webkitAnimationFillMode"
];
const kExpectedResults = [
{ id: 'a', values: [ "none", "0s", "cubic-bezier(0.25, 0.1, 0.25, 1)", "0s", "1", "normal", "none" ] },
{ id: 'b', values: [ "none", "0s", "cubic-bezier(0.25, 0.1, 0.25, 1)", "0s", "1", "normal", "none" ] },
{ id: 'c', values: [ "anim1", "10s", "cubic-bezier(0.25, 0.1, 0.25, 1)", "0s", "1", "normal", "none" ] },
{ id: 'd', values: [ "anim1", "10s", "cubic-bezier(0, 0, 1, 1)", "0s", "1", "normal", "none" ] },
{ id: 'e', values: [ "anim1", "10s", "cubic-bezier(0, 0, 1, 1)", "5s", "1", "normal", "none" ] },
{ id: 'f', values: [ "anim1", "10s", "cubic-bezier(0, 0, 1, 1)", "5s", "3", "normal", "none" ] },
{ id: 'g', values: [ "anim1", "10s", "cubic-bezier(0, 0, 1, 1)", "5s", "infinite", "alternate", "none" ] },
{ id: 'h', values: [ "anim1", "10s", "cubic-bezier(0, 0, 1, 1)", "5s", "infinite", "alternate", "forwards" ] },
{ id: 'i', values: [ "anim1", "10s", "cubic-bezier(0, 0, 1, 1)", "0s", "1", "normal", "none" ] },
{ id: 'j', values: [ "anim1, anim2, anim3", "10s, 3s, 5s", "cubic-bezier(0, 0, 1, 1), cubic-bezier(0.25, 0.1, 0.25, 1), cubic-bezier(0.25, 0.1, 0.25, 1)", "0s, 0s, 0s", "infinite, 1, 1", "normal, normal, normal", "backwards, none, both" ] }
];

function start()
{
var resultsString = "";
kExpectedResults.forEach(function(curItem) {
var el = document.getElementById(curItem.id);
var elStyle = window.getComputedStyle(el);

for (var i=0; i < kProperties.length; i++) {
var computedValue = elStyle[kProperties[i]];
var expectedValue = curItem.values[i];
if (computedValue == expectedValue)
resultsString += "Testing " + kProperties[i] + " on " + curItem.id + ": PASS" + "<br>";
else
resultsString += "Testing " + kProperties[i] + " on " + curItem.id + " expected <code>" + expectedValue + "</code> got <code>" + computedValue + "</code>: FAIL" + "<br>";

}
});

var results = document.getElementById('result');
results.innerHTML = resultsString;
}

window.addEventListener('load', start, false);
</script>
</head>
<body>
<div id="a" class="box"></div>
<div id="b" class="box"></div>
<div id="c" class="box"></div>
<div id="d" class="box"></div>
<div id="e" class="box"></div>
<div id="f" class="box"></div>
<div id="g" class="box"></div>
<div id="h" class="box"></div>
<div id="i" class="box"></div>
<div id="j" class="box"></div>
<div id="result">
</div>
</body>
</html>
@@ -1,3 +1,18 @@
2010-03-05 Dean Jackson <dino@apple.com>

Reviewed by Simon Fraser.

https://bugs.webkit.org/show_bug.cgi?id=35772
Animation fill modes should be supported in the shorthand property

Add CSSPropertyWebkitAnimationFillMode to the list of properties
evaluated in the -webkit-animation shorthand.

Test: animations/animation-shorthand.html

* css/CSSParser.cpp:
(WebCore::CSSParser::parseAnimationShorthand):

2010-03-05 Dean Jackson <dino@apple.com>

Reviewed by Simon Fraser
@@ -1891,7 +1891,8 @@ bool CSSParser::parseAnimationShorthand(bool important)
CSSPropertyWebkitAnimationTimingFunction,
CSSPropertyWebkitAnimationDelay,
CSSPropertyWebkitAnimationIterationCount,
CSSPropertyWebkitAnimationDirection };
CSSPropertyWebkitAnimationDirection,
CSSPropertyWebkitAnimationFillMode };
const int numProperties = sizeof(properties) / sizeof(properties[0]);

ShorthandScope scope(this, CSSPropertyWebkitAnimation);

0 comments on commit 4995ac1

Please sign in to comment.