mirrors/ladybird
0
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-07-24 18:02:20 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 9

LibWeb: Ensure inert elements are unfocusable

Browse source
This commit is contained in:
Tim Ledbetter 2025-02-05 23:27:09 +00:00 • committed by Sam Atkins
parent a9ffc6359a
commit 1e691bd26d
Notes: github-actions[bot] 2025-02-21 12:43:35 +00:00
3 changed files with 96 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

8
Libraries/LibWeb/HTML/Focus.cpp
View file

@ -216,7 +216,9 @@ void run_focusing_steps(DOM::Node* new_focus_target, DOM::Node* fallback_target,
new_focus_target = content_navigable->active_document();
}
// FIXME: 4. If new focus target is a focusable area and its DOM anchor is inert, then return.
// 4. If new focus target is a focusable area and its DOM anchor is inert, then return.
if (new_focus_target->is_inert())
return;
// 5. If new focus target is the currently focused area of a top-level browsing context, then return.
if (!new_focus_target->document().browsing_context())
@ -264,7 +266,9 @@ void run_unfocusing_steps(DOM::Node* old_focus_target)
}
}
// FIXME: 2. If old focus target is inert, then return.
// 2. If old focus target is inert, then return.
if (old_focus_target->is_inert())
return;
// FIXME: 3. If old focus target is an area element and one of its shapes is the currently focused area of a
// top-level browsing context, or, if old focus target is an element with one or more scrollable regions, and one

11
Tests/LibWeb/Text/expected/wpt-import/inert/inert-node-is-unfocusable.txt Normal file
View file

@ -0,0 +1,11 @@
Harness status: OK
Found 6 tests
6 Pass
Pass Button outside of inert container is focusable.
Pass Button with inert atribute is unfocusable.
Pass All focusable elements inside inert subtree are unfocusable
Pass Can get inert via property
Pass Elements inside of inert subtrees return false when getting 'inert'
Pass Setting inert via property correctly modifies inert state

79
Tests/LibWeb/Text/input/wpt-import/inert/inert-node-is-unfocusable.html Normal file
View file

@ -0,0 +1,79 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>inert nodes are unfocusable</title>
<link rel="author" title="Alice Boxhall" href="aboxhall@chromium.org">
<script src="../resources/testharness.js"></script>
<script src="../resources/testharnessreport.js"></script>
</head>
<body id="body" tabindex="1">
<button id="focusable">Outside of inert container</button>
<button inert id="inert">Inert button</button>
<div inert id="container">
<input id="text" type="text">
<input id="datetime" type="datetime">
<input id="color" type="color">
<select id="select">
<optgroup id="optgroup">
<option id="option">Option</option>
</optgroup>
</select>
<div id="contenteditable-div" contenteditable>I'm editable</div>
<span id="tabindex-span" tabindex="0">I'm tabindexed.</div>
<embed id="embed" type="application/x-blink-test-plugin" width=100 height=100></embed>
<a id="anchor" href="">Link</a>
</div>
<script>
function testFocus(element, expectFocus) {
focusedElement = null;
element.addEventListener('focus', function() { focusedElement = element; }, false);
element.focus();
theElement = element;
assert_equals(focusedElement === theElement, expectFocus);
}
function testTree(element, expectFocus, excludeCurrent) {
if (element.nodeType == Node.ELEMENT_NODE && !excludeCurrent)
testFocus(element, expectFocus);
if (element.tagName === "SELECT")
return;
var childNodes = element.childNodes;
for (var i = 0; i < childNodes.length; i++)
testTree(childNodes[i], expectFocus);
}
test(function() {
testFocus(document.getElementById('focusable'), true);
}, "Button outside of inert container is focusable.");
test(function() {
testFocus(document.getElementById('inert'), false);
}, "Button with inert atribute is unfocusable.");
test(function() {
testTree(document.getElementById('container'), false);
}, "All focusable elements inside inert subtree are unfocusable");
test(function() {
assert_false(document.getElementById("focusable").inert, "Inert not set explicitly is false")
assert_true(document.getElementById("inert").inert, "Inert set explicitly is true");
assert_true(document.getElementById("container").inert, "Inert set on container is true");
}, "Can get inert via property");
test(function() {
assert_false(document.getElementById("text").inert, "Elements inside of inert subtrees return false when getting inert");
}, "Elements inside of inert subtrees return false when getting 'inert'");
test(function() {
document.getElementById('focusable').inert = true;
testFocus(document.getElementById('focusable'), false);
document.getElementById('inert').inert = false;
testFocus(document.getElementById('inert'), true);
document.getElementById('container').inert = false;
testTree(document.getElementById('container'), true, true);
}, "Setting inert via property correctly modifies inert state");
</script>
</body>
</html>