LayoutTests/animations/import.html - WebKit - Git at Google

 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

 <html lang="en">
 <head>
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
   <title>Test of @import rule for importing keyframes</title>
   <style type="text/css"> @import "resources/keyframes.css"; </style>
   <style type="text/css" media="screen">
     #box {
         position: absolute;
         left: 0;
         top: 100px;
         height: 100px;
         width: 100px;
         background-color: blue;
         -webkit-animation-duration: 1s;
         -webkit-animation-timing-function: linear;
         -webkit-animation-name: "anim";
     }
     </style>
     <script src="resources/animation-test-helpers.js" type="text/javascript" charset="utf-8"></script>
     <script type="text/javascript" charset="utf-8">

     const expectedValues = [
       // [animation-name, time, element-id, property, expected-value, tolerance]
       ["anim", 0.3, "box", "left", 100, 1],
       ["anim", 0.7, "box", "left", 200, 1],
     ];

     runAnimationTest(expectedValues);

   </script>
 </head>
 <body>
 This test performs an animation of the left property. It should stop for 100ms at 100px and 200px
 We test for those values 50ms after it has stopped at each position. The keyframes are imported
 so this tests whether they come in correctly.
 <div id="box">
 </div>
 <div id="result">
 </div>
 </body>
 </html>
	<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
	"http://www.w3.org/TR/html4/loose.dtd">

	<html lang="en">
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<title>Test of @import rule for importing keyframes</title>
	<style type="text/css"> @import "resources/keyframes.css"; </style>
	<style type="text/css" media="screen">
	#box {
	position: absolute;
	left: 0;
	top: 100px;
	height: 100px;
	width: 100px;
	background-color: blue;
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: linear;
	-webkit-animation-name: "anim";
	}
	</style>
	<script src="resources/animation-test-helpers.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript" charset="utf-8">

	const expectedValues = [
	// [animation-name, time, element-id, property, expected-value, tolerance]
	["anim", 0.3, "box", "left", 100, 1],
	["anim", 0.7, "box", "left", 200, 1],
	];

	runAnimationTest(expectedValues);

	</script>
	</head>
	<body>
	This test performs an animation of the left property. It should stop for 100ms at 100px and 200px
	We test for those values 50ms after it has stopped at each position. The keyframes are imported
	so this tests whether they come in correctly.
	<div id="box">
	</div>
	<div id="result">
	</div>
	</body>
	</html>