967f13986396d87b2e523edb8452c1a61a68f426
[WebKit-https.git] / LayoutTests / fast / events / touch / ios / content-observation / clickable-content-is-inside-a-container.html
1 <html>
2 <head>
3 <title>This tests the case when we've got all the renderers constructed before they become visible and the container is not clickable.</title>
4 <script src="../../../../../resources/basic-gestures.js"></script>
5 <style>
6 #tapthis {
7     width: 400px;
8     height: 400px;
9     border: 1px solid green;
10 }
11
12 #becomesVisible {
13     max-height: 0px;
14     width: 100px;
15     height: 100px;
16     background-color: green;
17     overflow: hidden;
18 }
19
20 #becomesVisibleChild {
21     width: 50px;
22     height: 50px;
23     background-color: blue;
24 }
25
26 </style>
27 <script>
28 async function test() {
29     if (!window.testRunner || !testRunner.runUIScript)
30         return;
31     if (window.internals)
32         internals.settings.setContentChangeObserverEnabled(true);
33
34     testRunner.waitUntilDone();
35     testRunner.dumpAsText();
36
37     let rect = tapthis.getBoundingClientRect();
38     let x = rect.left + rect.width / 2;
39     let y = rect.top + rect.height / 2;
40
41     await tapAtPoint(x, y);
42 }
43 </script>
44 </head>
45 <body onload="test()">
46 <div id=tapthis>PASS if 'clicked' text is not shown below.</div>
47 <div id=becomesVisible><div id=becomesVisibleChild></div></div>
48 <pre id=result></pre>
49 <script>
50 tapthis.addEventListener("mouseover", function( event ) {
51     becomesVisible.style.maxHeight = "100px";
52     document.body.offsetHeight;
53     if (window.testRunner)
54         testRunner.notifyDone();
55 }, false);
56
57 becomesVisibleChild.addEventListener("click", function( event ) {   
58     result.innerHTML = "clicked hidden";
59 }, false);
60
61 tapthis.addEventListener("click", function( event ) {   
62     result.innerHTML = "clicked";
63 }, false);
64 </script>
65 </body>
66 </html>