Merge Chromium + Blink git repositories
[chromium-blink-merge.git] / third_party / WebKit / LayoutTests / fast / events / pointer-events.html
blob8c31125e8da4c22747cde990c74354d0a248f0fa
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
2 "http://www.w3.org/TR/html4/strict.dtd">
3 <html>
4 <head>
5 <meta http-equiv="Content-type" content="text/html; charset=utf-8">
6 <title>Test for pointer-events property</title>
7 <style type="text/css" media="screen">
8 p {
9 position: absolute;
10 width: 100px;
11 height: 30px;
12 margin: 0;
13 padding: 0;
14 font-size: 20px;
16 </style>
17 <script>
18 var pointerEventsValues = ['auto', 'none'];
20 var topEdge = 120;
22 function clickHit(identifierString) {
23 var text = document.getElementById('text' + identifierString);
24 text.textContent = '-HIT-';
27 function testContent() {
28 if (window.testRunner)
29 testRunner.dumpAsText();
31 var yOffset = topEdge;
33 var testContent = document.getElementById("test-content");
35 for (var pi = 0; pi < pointerEventsValues.length; pi++) {
36 var eventLabel = document.createElement('p');
37 eventLabel.style.left = "10px";
38 eventLabel.style.top = yOffset + "px";
39 eventLabel.style.pointerEvents = pointerEventsValues[pi];
40 eventLabel.textContent = pointerEventsValues[pi];
41 eventLabel.setAttribute('onclick', 'clickHit("' + pointerEventsValues[pi] + '")');
42 testContent.appendChild(eventLabel);
44 var hit = document.createElement('p');
45 hit.style.left = "140px";
46 hit.style.top = yOffset + "px";
47 hit.id = "text" + pointerEventsValues[pi];
48 hit.appendChild(document.createTextNode("-miss-"));
50 testContent.appendChild(hit);
52 if (window.eventSender) {
53 // Cell click
54 eventSender.mouseMoveTo(15, yOffset + 10);
55 eventSender.mouseDown();
56 eventSender.mouseUp();
59 yOffset += 40;
62 </script>
64 </head>
65 <body onload="testContent()">
66 <h1>Testing the values of 'pointer-events' on HTML content</h1>
67 <div>The labels on the left will be clicked and the result is shown to the right</div>
68 <div id="test-content">
69 </div>
70 </body>
71 </html>