blob: 3b7bcf4b27fe55b89d7d3efb02b4c194ad963a37 [file] [log] [blame]
<!-- webkit-test-runner [ enableCSSAnimationsAndCSSTransitionsBackedByWebAnimations=true ] -->
<html>
<head>
<style>
.shape {
width: 100px;
height: 100px;
float: left;
-webkit-shape-outside: url('../resources/svg-shape-003.svg');
background: url('../resources/svg-shape-003.svg');
}
.container {
width: 200px;
height: 200px;
border: 2px solid blue;
}
@-webkit-keyframes threshold-anim {
from { -webkit-shape-image-threshold: 0; }
to { -webkit-shape-image-threshold: 1; }
}
.shape {
-webkit-animation: threshold-anim 2s linear;
}
</style>
<script src="../../../animations/resources/animation-test-helpers.js"></script>
<script type="text/javascript">
const expectedValues = [
// [animation-name, time, element-id, property, expected-value, tolerance]
["threshold-anim", 1, "shape", "-webkit-shape-image-threshold", "0.5", 0.05],
];
runAnimationTest(expectedValues);
</script>
</head>
<body>
<div class='container'>
<div class='shape' id='shape'></div>
Moving Text
</div>
<div id="result">
</div>
</body>
</html>