| <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> |
| <html> |
| <head> |
| <script src="../../resources/js-test.js"></script> |
| <script src="../../resources/accessibility-helper.js"></script> |
| </head> |
| <body> |
| |
| <button id="button">Click me</button> |
| <input type="text" id="text-input"> |
| |
| <script> |
| description("This test ensures that making an element focused via accessibility (e.g. full keyboard access) re-focuses the page so that a focus ring can be drawn."); |
| |
| function takeFocus(id) { |
| debug(`\nTaking focus via accessibilityController for id #${id}`); |
| accessibilityController.accessibleElementById(id).takeFocus(); |
| } |
| |
| if (window.accessibilityController) { |
| var button = document.getElementById("button"); |
| var textInput = document.getElementById("text-input"); |
| shouldBe("getComputedStyle(button).getPropertyValue('outline-width')", "'0px'"); |
| shouldBe("getComputedStyle(textInput).getPropertyValue('outline-width')", "'0px'"); |
| |
| takeFocus("button"); |
| // Expect focus ring to have been drawn for the button. |
| shouldBe("getComputedStyle(button).getPropertyValue('outline-width')", "'3px'"); |
| shouldBe("getComputedStyle(textInput).getPropertyValue('outline-width')", "'0px'"); |
| |
| takeFocus("text-input"); |
| shouldBe("getComputedStyle(button).getPropertyValue('outline-width')", "'0px'"); |
| shouldBe("getComputedStyle(textInput).getPropertyValue('outline-width')", "'3px'"); |
| |
| debug("\nMaking the entire page un-focused"); |
| // This simulates situations in which WebKit is embedded in another app and focus is not properly handed |
| // over to WebKit when necessary, i.e. a full-keyboard access user tabbing into the embedded web view. |
| if (window.internals) |
| internals.setPageIsFocused(false); |
| else |
| debug("FAIL: window.internals not available") |
| |
| takeFocus("button"); |
| // Focusing the button via accessibility should re-focus the page and allow a focus ring to be drawn. |
| // This simulates conditions where embedded WKWebView's are not ever marked as focused via their hosting |
| // app, e.g. via [WKContentViewInteraction becomeFirstResponderForWebView]. |
| shouldBe("getComputedStyle(button).getPropertyValue('outline-width')", "'3px'"); |
| shouldBe("getComputedStyle(textInput).getPropertyValue('outline-width')", "'0px'"); |
| } |
| </script> |
| </body> |
| </html> |
| |
