| <!DOCTYPE html> |
| |
| <script src="../../resources/js-test-pre.js"></script> |
| |
| <style> |
| /* Float everything so they fit inside the viewport for using eventSender to click */ |
| section, footer, span, textarea, select { float: left; } |
| </style> |
| |
| <footer> |
| <input> |
| </footer> |
| |
| <section style="height: 100px; width: 100px; overflow: scroll;"></section> |
| |
| <div tabindex="1"> |
| <header style="height: 100px; width: 100px; overflow: scroll;"></header> |
| </div> |
| |
| <span contenteditable> |
| <u style="height: 100px; width: 100px; overflow: scroll; display: block;"></u> |
| </span> |
| |
| <textarea rows="5"> |
| Text. |
| Text. |
| Text. |
| Text. |
| Text. |
| Text. |
| Text. |
| Text. |
| Text. |
| Text. |
| </textarea> |
| |
| <select multiple> |
| <option> Text. |
| <option> Text. |
| <option> Text. |
| <option> Text. |
| <option> Text. |
| <option> Text. |
| <option> Text. |
| </select> |
| |
| <script> |
| if (window.testRunner) |
| testRunner.dumpAsText(); |
| |
| function click(x, y) |
| { |
| if (window.eventSender) { |
| eventSender.mouseMoveTo(x, y); |
| eventSender.mouseDown(); |
| eventSender.mouseUp(); |
| } |
| } |
| |
| function clickVerticalScrollbar(type) |
| { |
| var element = document.querySelector(type); |
| click(element.offsetLeft + element.offsetWidth - 5, element.offsetTop + 5); |
| } |
| |
| function clickHorizontalScrollbar(type) |
| { |
| var element = document.querySelector(type); |
| click(element.offsetLeft + 5, element.offsetTop + element.offsetHeight - 5); |
| } |
| |
| function test(name, fn) |
| { |
| debug("<br>" + name); |
| fn(); |
| } |
| |
| description("This tests clicking scrollbars, which should only move the focus if an ancestor is mouse focusable."); |
| |
| test("Focus should remain in the input", function() { |
| document.querySelector("input").focus(); |
| clickVerticalScrollbar("section"); |
| clickHorizontalScrollbar("section"); |
| shouldBeEqualToString("document.activeElement.tagName", "INPUT"); |
| }); |
| |
| test("Focus should move if ancestor is mouse focusable", function() { |
| document.querySelector("input").focus(); |
| clickVerticalScrollbar("header"); |
| shouldBeEqualToString("document.activeElement.tagName", "DIV"); |
| document.querySelector("input").focus(); |
| clickHorizontalScrollbar("header"); |
| shouldBeEqualToString("document.activeElement.tagName", "DIV"); |
| }); |
| |
| test("Focus should move if ancestor is content editable", function() { |
| document.querySelector("input").focus(); |
| clickVerticalScrollbar("u"); |
| shouldBeEqualToString("document.activeElement.tagName", "SPAN"); |
| document.querySelector("input").focus(); |
| clickHorizontalScrollbar("u"); |
| shouldBeEqualToString("document.activeElement.tagName", "SPAN"); |
| }); |
| |
| test("Form controls should move the focus", function() { |
| clickVerticalScrollbar("textarea"); |
| shouldBeEqualToString("document.activeElement.tagName", "TEXTAREA"); |
| clickVerticalScrollbar("select"); |
| shouldBeEqualToString("document.activeElement.tagName", "SELECT"); |
| }); |
| |
| test("Disabled form controls should not move the focus", function() { |
| document.querySelector("input").focus(); |
| document.querySelector("select").disabled = true; |
| clickVerticalScrollbar("select"); |
| shouldBeEqualToString("document.activeElement.tagName", "INPUT"); |
| }); |
| </script> |
| |
| <script src="../../resources/js-test-post.js"></script> |
