Limit user-agent interactions based on the touch-action property on iOS
[WebKit-https.git] / LayoutTests / pointerevents / ios / touch-action-none-in-overflow-scrolling-touch.html
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset=utf-8>
5 <meta name="viewport" content="width=device-width, initial-scale=1">
6 <style>
7
8 #scrolling-container {
9     position: absolute;
10     left: 0;
11     top: 0;
12     width: 400px;
13     height: 400px;
14     overflow: scroll;
15     -webkit-overflow-scrolling: touch;
16 }
17
18 #scrolling-container > div {
19     position: absolute;
20     left: 0;
21     top: 0;
22     width: 200%;
23     height: 200%;
24     touch-action: none;
25 }
26
27 </style>
28 </head>
29 <body>
30 <div id="scrolling-container"><div></div></div>
31 <script src="../../resources/testharness.js"></script>
32 <script src="../../resources/testharnessreport.js"></script>
33 <script src="../utils.js"></script>
34 <script>
35
36 'use strict';
37
38 async_test(test => {
39     const scrollingContainer = document.body.firstElementChild;
40     ui.swipe({ x: 150, y: 150 }, { x: 50, y: 50 }).then(() => {
41         assert_equals(scrollingContainer.scrollLeft, 0, "The scrolling container was not scrolled in the x-axis.");
42         assert_equals(scrollingContainer.scrollTop, 0, "The scrolling container was not scrolled in the y-axis.");
43         test.done();
44     });
45 }, "Testing that setting touch-action: none in content hosted in a scrollable container using '-webkit-overflow-scrolling: touch' prevents scrolling of that container.");
46
47 </script>
48 </body>
49 </html>