| <!DOCTYPE html> |
| <style> |
| #shadow |
| { |
| overflow: hidden; |
| position: absolute; |
| box-shadow: 0 0 50px #000; |
| height: 100px; |
| width: 100px; |
| } |
| #content |
| { |
| display: block; |
| height: 200px; |
| width: 200px; |
| background: rgba(0,255,0,0.3); |
| } |
| </style> |
| <script src="../../resources/js-test.js"></script> |
| <script> |
| if (window.testRunner) |
| testRunner.dumpAsText(); |
| |
| function click(x, y) |
| { |
| if (window.eventSender) { |
| eventSender.mouseMoveTo(x, y); |
| eventSender.mouseDown(); |
| eventSender.mouseUp(); |
| } |
| } |
| |
| function test(name, fn) |
| { |
| debug("<br>" + name); |
| fn(); |
| } |
| |
| description("This test checks that div block should not get events on clicking the shadow outside div block."); |
| |
| function runTests() |
| { |
| |
| test("Focus should remain in the textarea", function() { |
| var textarea = document.getElementById("content"); |
| var rect = textarea.getBoundingClientRect(); |
| click(rect.left + 5, rect.top + 5); |
| shouldBeEqualToString("document.activeElement.tagName", "TEXTAREA"); |
| }); |
| |
| // Click on the shadow at right of the div block. |
| test("Focus should move to the body", function() { |
| var shadow = document.getElementById("shadow"); |
| var rect = shadow.getBoundingClientRect(); |
| var x = rect.left + shadow.offsetWidth + 5; |
| var y = rect.top + 5; |
| click(x, y); |
| shouldBeEqualToString("document.activeElement.tagName", "BODY"); |
| }); |
| |
| // Focus on the textarea to prepare for the next test. |
| test("Focus should remain in the textarea", function() { |
| var textarea = document.getElementById("content"); |
| var rect = textarea.getBoundingClientRect(); |
| click(rect.left + 5, rect.top + 5); |
| shouldBeEqualToString("document.activeElement.tagName", "TEXTAREA"); |
| }); |
| |
| // Click on the shadow at bottom of the div block. |
| test("Focus should move to the body", function() { |
| var shadow = document.getElementById("shadow"); |
| var rect = shadow.getBoundingClientRect(); |
| var x = rect.left + 5; |
| var y = rect.top + shadow.offsetHeight + 5; |
| click(x, y); |
| shouldBeEqualToString("document.activeElement.tagName", "BODY"); |
| }); |
| |
| } |
| </script> |
| |
| <body onload="runTests();"> |
| <div id="shadow"> |
| <textarea id="content"></textarea> |
| </div> |
| </body> |
