[WPE] run-qt-wpe-minibrowser needlessly expects a --wpe argument
[WebKit-https.git] / LayoutTests / fast / forms / ios / ipad / select-form-run-twice.html
1 <!DOCTYPE html> <!-- webkit-test-runner [ useFlexibleViewport=true ] -->
2
3 <html>
4 <head>
5     <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
6     <style>
7         body {
8             height: 1500px;
9         }
10         #container {
11             position: fixed;
12             top: 10px;
13             left: 10px;
14             bottom: 30px;
15             right: 10px;
16             background-color: rgba(0, 0, 0, 0.5);
17             padding: 10px;
18             box-sizing: border-box;
19             border: 5px solid black;
20         }
21         
22         select {
23             display: block;
24             margin: 500px 200px 20px 20px;
25         }
26         
27         button {
28             display: block;
29         }
30         
31     </style>
32     <script src="../resources/zooming-test-utils.js"></script>
33     <script src="../../../../resources/basic-gestures.js"></script>
34     <script>
35         if (window.testRunner)
36             testRunner.waitUntilDone();
37
38         function getScrollDownUIScript(x, y)
39         {
40             return `
41                 (function() {
42                     uiController.didEndScrollingCallback = function() {
43                         uiController.uiScriptComplete();
44                     };
45
46                     uiController.scrollToOffset(${x}, ${y});
47                 })();`
48         }
49
50         function getTapOnSelectUIScript(x, y, row)
51         {
52             return `
53                 (function() {
54                     uiController.didStartFormControlInteractionCallback = function() {
55                         uiController.selectFormAccessoryPickerRow(${row});
56                     };
57
58                     uiController.didEndFormControlInteractionCallback = function() {
59                         uiController.uiScriptComplete();
60                     };
61
62                     uiController.singleTapAtPoint(${x}, ${y}, function() {
63                     });
64                 })();`
65         }
66
67         var firstButtonIsClicked = false;
68         var finalButtonIsClicked = false;
69         var firstButtonTimeoutID;
70         var finalButtonTimeoutID;
71         
72         function firstButtonClicked()
73         {
74             clearTimeout(firstButtonTimeoutID);
75             if (!firstButtonIsClicked) {
76                 firstButtonIsClicked = true;
77                 
78                 document.getElementById('nextStep').textContent = 'PASS: hit testing found #nextButton after first select interaction';
79                 var selectElement = document.getElementsByTagName('select')[0];
80                 var point = getPointInsideElement(selectElement, 10, 10);
81                 testRunner.runUIScript(getTapOnSelectUIScript(point.x, point.y, 5), function() {
82                     document.getElementById('select-value2').textContent = selectElement.value;
83                         tryTapOnFinalButton();
84                 });
85             }
86         }
87     
88         function finalButtonClicked()
89         {
90             clearTimeout(finalButtonTimeoutID);
91             if (!finalButtonIsClicked) {
92                 finalButtonIsClicked = true;
93                 document.getElementById('result').textContent = 'PASS: hit testing found #finalTarget after select interaction';
94                 if (window.testRunner)
95                     testRunner.notifyDone();
96             }
97         }
98
99         async function tryTapOnFirstButton()
100         {
101             var firstPoint = getPointInsideElement(document.getElementById('firstTarget'), 10, 10);
102             await tapAtPoint(firstPoint.x, firstPoint.y);
103             
104             // We have to keep retrying, because the dimming view behind the popover animates out,
105             // and we currently have no callback when that animation completes.
106             if (!firstButtonIsClicked)
107                 firstButtonTimeoutID = window.setTimeout(tryTapOnFirstButton, 100);
108         }
109     
110         async function tryTapOnFinalButton()
111         {
112             var finalPoint = getPointInsideElement(document.getElementById('finalTarget'), 10, 10);
113             await tapAtPoint(finalPoint.x, finalPoint.y);
114             
115             // We have to keep retrying, because the dimming view behind the popover animates out,
116             // and we currently have no callback when that animation completes.
117             if (!finalButtonIsClicked)
118                 finalButtonTimeoutID = window.setTimeout(tryTapOnFinalButton, 100);
119         }
120     
121
122         function doTest()
123         {
124             if (!window.testRunner)
125                 return;
126
127             testRunner.waitUntilDone();
128             testRunner.dumpAsText();
129
130             testRunner.runUIScript(getScrollDownUIScript(0, 500), function() {
131                 var selectElement = document.getElementsByTagName('select')[0];
132                 var point = getPointInsideElement(selectElement, 10, 10);
133                 testRunner.runUIScript(getTapOnSelectUIScript(point.x, point.y, 2), function() {
134                     document.getElementById('select-value').textContent = selectElement.value;
135                     tryTapOnFirstButton();
136                 });
137             });
138         }
139         
140         window.addEventListener('load', doTest, false);
141     </script>
142 </head>
143 <body>
144     <p>This is the top</p>
145     <div id="container">
146         <button id="firstTarget" onclick="firstButtonClicked()">First Click</button>
147         <button id="finalTarget" onclick="finalButtonClicked()">Final Click</button>
148         <select>
149             <option>January</option>
150             <option>February</option>
151             <option>March</option>
152             <option>April</option>
153             <option>May</option>
154             <option>June</option>
155             <option>July</option>
156             <option>August</option>
157             <option>September</option>
158         </select>
159         <span id="select-value">Value goes here</span>
160         <span id="select-value2">2nd Value goes here</span>
161         <div id="nextStep">FAIL: should have hit-tested and found #target element</div>
162         <div id="result">FAIL: should have hit-tested and found #target element</div>
163     </div>
164     
165 </div>
166 </body>
167 </html>