Regression(r188105): Seems to have caused crashes during PLT on some iPads
[WebKit-https.git] / LayoutTests / fast / css / hover-display-block-none.html
1 <!doctype html>
2 <html lang="en">
3 <head>
4         <title>Switch between display block and none on :hover</title>
5         <style>
6                 .box {
7                         width: 100px;
8                         height: 100px;
9                 }
10                 #dummy {
11                         background-color: black;
12                 }
13                 #hoverTest {
14                         border: 5px solid green;
15                         border-left: 100px solid green;
16                         color: black;
17                         display: block;
18                         width: 230px;
19                 }
20                 #hoverTest:hover {
21                         border-color: darkred;
22                         display: none;
23                 }
24                 #after_hoverTest {
25                         background-color: blue;
26                         color: white;
27                         padding: 10px;
28                 }
29         </style>
30
31         <script src="../../resources/js-test-pre.js"></script>
32 </head>
33
34 <script type="text/javascript">
35         function elementHovered() {
36                 if (window.testRunner)
37                         document.getElementById("hoverTest").style.display = "none";
38         }
39 </script>
40
41 <body>
42         <div id="dummy" class="box"></div>
43         <div id="hoverTest" class="box" onmouseover="elementHovered()">When hovered, this box's display will switch from <b>block</b> to <b>none</b> (click on it and keep the mouse button pushed to avoid flicker and get a more clear view)</div>
44         <div id="after_hoverTest" class="box">This is here to show the layout being recomputed</div>
45
46         <script type="text/javascript">
47                 if (window.testRunner)
48                         testRunner.waitUntilDone();
49
50                 function beginTest() {
51                         if (window.eventSender) {
52                                 var hoverTest  = document.getElementById("hoverTest");
53
54                                 // move mouse on the hover test object
55                                 eventSender.mouseMoveTo(hoverTest.offsetLeft + 50, hoverTest.offsetTop + 10);
56
57                                 release();
58                         }
59                 }
60
61                 function release() {
62                         if (window.eventSender) {
63                                 var hoverTest  = document.getElementById("hoverTest");
64                                 var displayMode = window.getComputedStyle(hoverTest).getPropertyValue("display");
65
66                                 if (displayMode == "none")
67                                         testPassed("Setting display to none on hover processed OK.");
68                                 else
69                                         testFailed("Setting display to none on hover FAILED." + " (expected 'none', got '" + displayMode + "')");
70
71                                 var elementsToHide = document.getElementsByClassName('box');
72                                 for (var element, i = 0; element = elementsToHide[i]; i++)
73                                     element.style.visibility = "hidden";
74
75                                 if (window.testRunner)
76                                         testRunner.notifyDone();
77                         }
78                 }
79
80                 beginTest();
81         </script>
82 </body>
83 </html>