21a41d950b139f21673f7a4ed67e2690dfea21dc
[WebKit-https.git] / LayoutTests / transitions / transition-to-from-undefined.html
1 <!DOCTYPE html><!-- webkit-test-runner [ enableWebAnimationsCSSIntegration=true ] -->
2
3 <html>
4 <head>
5   <style>
6     .box {
7         position: relative;
8         height: 100px;
9         width: 100px;
10         margin: 10px;
11         background-color: gray;
12         transition: max-height 2s linear;
13     }
14     
15     #test1 {
16         max-height: 100px;
17     }
18     
19     body.final #test1 {
20         max-height: none;
21     }
22
23     #test2 {
24         max-height: none;
25     }
26     
27     body.final #test2 {
28         max-height: 100px
29     }
30
31     #test3 {
32         max-height: 0;
33     }
34     
35     body.final #test3 {
36         max-height: 100px
37     }
38   </style>
39   <script src="resources/transition-test-helpers.js"></script>
40   <script type="text/javascript">
41
42     const expectedValues = [
43       // [time, element-id, property, expected-value, tolerance]
44       [1, 'test1', 'max-height', 'none', 2],
45       [1, 'test2', 'max-height', '100', 2],
46       [1, 'test3', 'max-height', '50', 2],
47     ];
48   
49     function setupTest()
50     {
51         document.body.classList.add('final');
52     }
53     
54     runTransitionTest(expectedValues, setupTest, usePauseAPI);
55   </script>
56 </head>
57 <body>
58   <div id="test1" class="box"></div>
59   <div id="test2" class="box"></div>
60   <div id="test3" class="box"></div>
61
62   <div id="result"></div>
63 </body>
64 </html>