Unreviewed. Update W3C WebDriver imported tests.
[WebKit-https.git] / WebDriverTests / imported / w3c / webdriver / tests / element_click / bubbling.py
1 from tests.support.asserts import assert_success
2 from tests.support.inline import inline
3
4
5 def click(session, element):
6     return session.transport.send(
7         "POST", "/session/{session_id}/element/{element_id}/click".format(
8             session_id=session.session_id,
9             element_id=element.id))
10
11
12 def test_click_event_bubbles_to_parents(session):
13     session.url = inline("""
14         <style>
15         body * {
16           margin: 10px;
17           padding: 10px;
18           border: 1px solid blue;
19         }
20         </style>
21
22         <div id=three>THREE
23           <div id=two>TWO
24             <div id=one>ONE</div>
25           </div>
26         </div>
27
28         <script>
29         window.clicks = [];
30
31         for (let level of document.querySelectorAll("div")) {
32           level.addEventListener("click", ({currentTarget}) => {
33             window.clicks.push(currentTarget);
34           });
35         }
36         </script>
37         """)
38     three, two, one = session.find.css("div")
39     one.click()
40
41     clicks = session.execute_script("return window.clicks")
42     assert one in clicks
43     assert two in clicks
44     assert three in clicks
45
46
47 def test_spin_event_loop(session):
48     """
49     Wait until the user agent event loop has spun enough times to
50     process the DOM events generated by clicking.
51     """
52     session.url = inline("""
53         <style>
54         body * {
55           margin: 10px;
56           padding: 10px;
57           border: 1px solid blue;
58         }
59         </style>
60
61         <div id=three>THREE
62           <div id=two>TWO
63             <div id=one>ONE</div>
64           </div>
65         </div>
66
67         <script>
68         window.delayedClicks = [];
69
70         for (let level of document.querySelectorAll("div")) {
71           level.addEventListener("click", ({currentTarget}) => {
72             setTimeout(() => window.delayedClicks.push(currentTarget), 100);
73           });
74         }
75         </script>
76         """)
77     three, two, one = session.find.css("div")
78     one.click()
79
80     delayed_clicks = session.execute_script("return window.delayedClicks")
81     assert one in delayed_clicks
82     assert two in delayed_clicks
83     assert three in delayed_clicks
84
85
86 def test_element_disappears_during_click(session):
87     """
88     When an element in the event bubbling order disappears (its CSS
89     display style is set to "none") during a click, Gecko and Blink
90     exhibit different behaviour.  Whilst Chrome fires a "click"
91     DOM event on <body>, Firefox does not.
92
93     A WebDriver implementation may choose to wait for this event to let
94     the event loops spin enough times to let click events propagate,
95     so this is a corner case test that Firefox does not hang indefinitely.
96     """
97     session.url = inline("""
98         <style>
99         #over,
100         #under {
101           position: absolute;
102           top: 8px;
103           left: 8px;
104           width: 100px;
105           height: 100px;
106         }
107
108         #over {
109           background: blue;
110           opacity: .5;
111         }
112         #under {
113           background: yellow;
114         }
115
116         #log {
117           margin-top: 120px;
118         }
119         </style>
120
121         <body id="body">
122           <div id=under></div>
123           <div id=over></div>
124
125            <div id=log></div>
126         </body>
127
128         <script>
129         let under = document.querySelector("#under");
130         let over = document.querySelector("#over");
131         let body = document.querySelector("body");
132         let log = document.querySelector("#log");
133
134         function logEvent({type, target, currentTarget}) {
135           log.innerHTML += "<p></p>";
136           log.lastElementChild.textContent = `${type} in ${target.id} (handled by ${currentTarget.id})`;
137         }
138
139         for (let ev of ["click", "mousedown", "mouseup"]) {
140           under.addEventListener(ev, logEvent);
141           over.addEventListener(ev, logEvent);
142           body.addEventListener(ev, logEvent);
143         }
144
145         over.addEventListener("mousedown", () => over.style.display = "none");
146         </script>
147         """)
148     over = session.find.css("#over", all=False)
149
150     # should not time out
151     response = click(session, over)
152     assert_success(response)