Magic-Mirror/gecko-dev
1
0
Fork 0
mirror of https://github.com/mozilla/gecko-dev.git synced 2024-11-26 06:11:37 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Bug 1589292 [wpt PR 19749] - Make ShouldHaveFocusAppearance() consistent with :focus-visible., a=testonly

Browse Source 
Automatic update from web-platform-tests
Make ShouldHaveFocusAppearance() consistent with :focus-visible.

Also simplify the model, and fix an issue where :focus-visible didn't match if `preventDefault()` was called on the keyboard event.

Now the model is that any trusted keyboard event will set had_keyboard_event to true, and any focus from mouse will re-set it to false.

Bug: 1010549
Change-Id: Ifcb9bfbef746b91d99fc8ef42a8ef0e223fca2c5
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1863061
Reviewed-by: Kent Tamura <tkent@chromium.org>
Commit-Queue: Alice Boxhall <aboxhall@chromium.org>
Cr-Commit-Position: refs/heads/master@{#707709}

--

wpt-commits: 670f3ef16f9b38e22e3b863dcdc2ea860348929a
wpt-pr: 19749
This commit is contained in:
Alice Boxhall 2019-10-22 17:18:29 +00:00 committed by James Graham
parent 849b518a86
commit 7b908e656a
1 changed files with 58 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
testing/web-platform/tests/css/selectors/focus-visible-011.html Normal file
View File

@ -0,0 +1,58 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>CSS Test (Selectors): :focus-visible matches even if preventDefault() is called</title>
<link rel="author" title="Alice Boxhall" href="aboxhall@chromium.org" />
<link rel="help" href="https://drafts.csswg.org/selectors-4/#the-focus-visible-pseudo" />
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/resources/testdriver.js"></script>
<script src="/resources/testdriver-vendor.js"></script>
<style>
button {
border: 0;
}
#next:focus-visible {
outline: darkgreen auto 5px;
}
#next:focus:not(:focus-visible) {
background-color: tomato;
outline: 0;
}
</style>
</head>
<body>
This test checks that <code>:focus-visible</code> matches after a keyboard event,
even if the event handler calls preventDefault() on the event.
<ul id="instructions">
<li>Click "Click here and press right arrow.".</li>
<li>Press the right arrow key.</li>
<li>If "Focus moves here." has a red background, then the test result is FAILURE.
If it has a green outline, then the test result is SUCCESS.</li>
</ul>
<br />
<button id="start" tabindex="0">Click here and press right arrow.</button>
<button id="next" tabindex="-1">Focus moves here.</button>
<script>
start.addEventListener('keydown', (e) => {
next.focus();
});
async_test(async function(t) {
next.addEventListener("focus", t.step_func(() => {
assert_equals(getComputedStyle(next).outlineColor, "rgb(0, 100, 0)");
t.done()
}));
// \ue014 -> ARROW_RIGHT
test_driver.send_keys(start, "\ue014").catch(t.step_func(() => {
assert_true(false, "send_keys not implemented yet");
t.done();
}));
}, ":focus-visible matches even if preventDefault() is called");
</script>
</body>
</html>