| <html> |
| <head> |
| <script> |
| |
| if (window.testRunner) { |
| testRunner.dumpAsText(); |
| testRunner.waitUntilDone(); |
| } |
| function test() |
| { |
| document.getElementById("target").addEventListener("click", targetClick, true); |
| |
| if (window.eventSender) { |
| eventSender.mouseMoveTo(52, 52); |
| eventSender.mouseDown(); |
| eventSender.mouseUp(); |
| window.setTimeout(finish, 0); |
| } |
| } |
| |
| var finished = false; |
| function finish() |
| { |
| if (finished) |
| return; |
| finished = true; |
| log("targetClickFired: " + targetClickFired); |
| log("containerClickFired: " + containerClickFired); |
| if (targetClickFired && !containerClickFired) |
| log("test passed"); |
| else |
| log("test failed"); |
| if (window.testRunner) |
| testRunner.notifyDone(); |
| } |
| |
| function log(text) { |
| document.getElementById("result").innerHTML = document.getElementById("result").innerHTML + text + "<br>"; |
| } |
| |
| var targetClickFired = false; |
| var containerClickFired = false; |
| |
| function targetClick(e) { |
| window.setTimeout(finish, 0); |
| targetClickFired = true; |
| e.stopPropagation(); |
| e.preventDefault(); |
| }; |
| |
| function containerClick(e) { |
| window.setTimeout(finish, 0); |
| containerClickFired = true; |
| }; |
| |
| </script> |
| |
| </head> |
| <body onload="test()"> |
| |
| <p>This tests checks that capturing event handlers trigger on the node that is the target of the event, and that stopPropagation in such a handler prevents further bubble handlers from triggering.</p> |
| <div onclick="containerClick(event)"> |
| <div style="position:absolute; top: 40; left: 40; width: 100; height: 40; background-color: pink" id="target" onclick="targetClick(event)">Click here</a> |
| </div> |
| |
| <div id="result" style="position: absolute; top: 100; left: 50;"><br></div> |
| </body> |
| </html> |