1<!DOCTYPE html>
2<meta charset="UTF-8">
3<style>
4.target {
5  width: 50px;
6  height: 50px;
7  background-color: black;
8  display: inline-block;
9  outline: 2px solid orange;
10  margin: 18px;
11}
12.replica {
13  background-color: green;
14}
15</style>
16<body>
17<script src="../testharness/testharness.js"></script>
18<script src="../testharness/testharnessreport.js"></script>
19<script src="resources/interpolation-test.js"></script>
20<script>
21assertInterpolation({
22  property: 'outline-width',
23  from: '0px',
24  to: '10px'
25}, [
26  {at: -0.3, is: '0px'}, // CSS outline-width can't be negative.
27  {at: 0, is: '0px'},
28  {at: 0.3, is: '3px'},
29  {at: 0.6, is: '6px'},
30  {at: 1, is: '10px'},
31  {at: 1.5, is: '15px'}
32]);
33assertInterpolation({
34  property: 'outline-width',
35  from: 'thick',
36  to: '15px'
37}, [
38  {at: -2, is: '0px'}, // CSS outline-width can't be negative.
39  {at: -0.3, is: '2px'},
40  {at: 0, is: '5px'},
41  {at: 0.3, is: '8px'},
42  {at: 0.6, is: '11px'},
43  {at: 1, is: '15px'},
44  {at: 1.5, is: '20px'}
45]);
46</script>
47</body>
48