Layout Test svg/dom/animated-tearoff-list-remove-target.html is a flaky timeout
[WebKit-https.git] / LayoutTests / svg / hittest / svg-small-viewbox.xhtml
1 <html xmlns='http://www.w3.org/1999/xhtml'>
2   <head>
3     <style>
4       #svgRoot {
5           margin: 0px;
6           padding: 0px;
7           position: absolute; 
8           top: 0px; 
9           left: 0px;"
10       }
11
12       #rect {
13           fill: green;
14           fill-opacity: 0.1;
15       }
16     </style>
17   </head>
18   <body>
19     <p>Test for bug 34714 - onclick is not reliable for transformed SVG elements. This test checks that elementFromPoint() works correctly with an SVG rect element (green) defined within a 1x1 viewbox.</p>
20     <p>On success, you will see a series of "PASS" messages</p>
21     <pre id="console"></pre>
22
23     <svg id="svgRoot" width="400px" height="400px" viewBox="0 0 1 1" xmlns="http://www.w3.org/2000/svg">
24       <g transform="translate(0.5, 0)">
25           <rect id="rect" width="1" height="1" transform="translate(-0.499, 0)"/>
26       </g>
27     </svg>
28     
29     <script><![CDATA[
30     if (window.testRunner) {
31       testRunner.dumpAsText();
32     }
33
34     var resultString = "";
35     var rectElt = document.getElementById("rect");
36
37     var pointsInRect = [
38        {x: 1, y: 1},     // fails without the fix
39        {x: 1, y: 399},   // fails without the fix
40        {x: 399, y: 1},
41        {x: 399, y: 399},
42        {x: 200, y: 200}  
43     ];
44
45     pointsInRect.forEach( function(point) {
46         var pass = (rectElt == document.elementFromPoint(point.x, point.y));
47         resultString += ((pass) ? "PASS " : "FAIL ") + " rect contains point @ " + point.x + ", " + point.y + "\n";
48     });
49
50     var pointsNotInRect = [
51         {x: 1, y: 401},
52         {x: 401, y: 1},
53         {x: 401, y: 401},
54         {x: -1, y: -1},
55     ];
56
57     pointsNotInRect.forEach( function(point) {
58         var pass = (rectElt != document.elementFromPoint(point.x, point.y));
59         resultString += ((pass) ? "PASS " : "FAIL ") + " rect does not contain point @ " + point.x + ", " + point.y + "\n";
60     });
61
62     document.getElementById("console").innerHTML = resultString;
63     ]]></script>
64  </body>
65 </html>