| OLD | NEW |
|---|
| (Empty) | |
| 1 <!DOCTYPE html> |
| 2 <html> |
| 3 <body onload="onPageLoad()"> |
| 4 Check that hit testing on a <rect> with various miterlimits around sqrt(2)
works properly. If the test passes, you will see "PASS" below. |
| 5 <p id="result">Running test...</p> |
| 6 <svg id="svg" width="100" height="100" version="1.1"> |
| 7 <rect id="rect" fill="none" stroke="black" stroke-width="20" x="10" y="10" w
idth="80" height="80"/> |
| 8 </svg> |
| 9 <script type="text/javascript"> |
| 10 if (window.testRunner) { |
| 11 testRunner.dumpAsText(); |
| 12 testRunner.waitUntilDone(); |
| 13 } |
| 14 |
| 15 var result = document.getElementById("result"), |
| 16 svg = document.getElementById("svg"), |
| 17 rect = document.getElementById("rect"); |
| 18 function onPageLoad() { |
| 19 // sqrt(2) = 1.414213562373095... |
| 20 var intervals = [ |
| 21 ["1.4", "1.5"], |
| 22 ["1.41", "1.42"], |
| 23 ["1.414", "1.415"], |
| 24 ["1.4142", "1.4143"], |
| 25 ["1.41421", "1.41422"], |
| 26 ["1.414213", "1.414214"] |
| 27 //,["1.4142135", "1.4142136"] |
| 28 ]; |
| 29 |
| 30 var bcr = svg.getBoundingClientRect(), |
| 31 x0 = bcr.left, |
| 32 y0 = bcr.top; |
| 33 |
| 34 var i = 0; |
| 35 requestAnimationFrame(function nextInterval() { |
| 36 if (i >= intervals.length) { |
| 37 if (result.textContent == "Running test...") |
| 38 result.textContent = "PASS"; |
| 39 |
| 40 if (window.testRunner) |
| 41 testRunner.notifyDone(); |
| 42 |
| 43 return; |
| 44 } |
| 45 |
| 46 var interval = intervals[i++]; |
| 47 |
| 48 if (!(interval[0] < Math.SQRT2)) |
| 49 result.textContent += " FAIL - Expecting " + interval[0] + " to be s
trictly less than sqrt(2)."; |
| 50 rect.setAttribute("stroke-miterlimit", interval[0]); |
| 51 var actualMiterlimit = getComputedStyle(rect, null).strokeMiterlimit; |
| 52 if (!(actualMiterlimit < Math.SQRT2)) |
| 53 result.textContent += " FAIL - After setting the miterlimit to " + i
nterval[0] + ", expecting the computed miterlimit " + actualMiterlimit + " to be
strictly less than sqrt(2)."; |
| 54 |
| 55 // Because the miterlimit is less than sqrt(2), the join style should |
| 56 // switch to "bevel". |
| 57 // i.e. if we get the element near the bottom right corner, it should be |
| 58 // the <svg> and not the <rect>. |
| 59 if (document.elementFromPoint(x0 + 97, y0 + 97) !== svg) { |
| 60 result.textContent += " FAIL - The element at point (97, 97) should
be the <svg> element (miterlimit is actually " + actualMiterlimit + " after sett
ing it to " + interval[0] + ")."; |
| 61 // If this check fails, stop the test early so we can examine the |
| 62 // <rect> visually. |
| 63 if (window.testRunner) |
| 64 testRunner.notifyDone(); |
| 65 return; |
| 66 } |
| 67 |
| 68 requestAnimationFrame(function () { |
| 69 if (!(interval[1] >= Math.SQRT2)) |
| 70 result.textContent += " FAIL - Expecting " + interval[1] + " to
be greater than or equal to sqrt(2)."; |
| 71 rect.setAttribute("stroke-miterlimit", interval[1]); |
| 72 var actualMiterlimit = getComputedStyle(rect, null).strokeMiterlimit
; |
| 73 if (!(actualMiterlimit >= Math.SQRT2)) |
| 74 result.textContent += " FAIL - After setting the miterlimit to "
+ interval[1] + ", expecting the computed miterlimit " + actualMiterlimit + " t
o be greater than or equal to sqrt(2)."; |
| 75 |
| 76 // The join style should still be "bevel". |
| 77 if (document.elementFromPoint(x0 + 97, y0 + 97) !== rect) { |
| 78 result.textContent += " FAIL - The element at point (97, 97) sho
uld be the <rect> element (miterlimit is actually " + actualMiterlimit + " after
setting it to " + interval[1] + ")."; |
| 79 // If this check fails, stop the test early so we can examine th
e |
| 80 // <rect> visually. |
| 81 if (window.testRunner) |
| 82 testRunner.notifyDone(); |
| 83 return; |
| 84 } |
| 85 |
| 86 requestAnimationFrame(nextInterval); |
| 87 }); |
| 88 }); |
| 89 } |
| 90 </script> |
| 91 </body> |
| 92 </html> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 745383007:
Fix an issue where hit detection could fail on rect and ellipse shapes (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master