mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2025-07-29 12:19:54 +00:00
LibWeb: Implement <input type=checkbox switch> experimentally
In conformance with the requirements of the spec PR at https://github.com/whatwg/html/pull/9546, this change adds support for the “switch” attribute for type=checkbox “input” elements — which is shipping in Safari (since Safari 17.4). This change also implements support for exposing it to AT users with role=switch.
This commit is contained in:
parent
eee90f4aa2
commit
583ca6af89
Notes:
github-actions[bot]
2024-12-13 11:32:27 +00:00
Author: https://github.com/sideshowbarker
Commit: 583ca6af89
Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/2887
Reviewed-by: https://github.com/AtkinsSJ ✅
Reviewed-by: https://github.com/shannonbooth
16 changed files with 268 additions and 3 deletions
|
@ -0,0 +1,8 @@
|
|||
<!doctype html>
|
||||
<meta charset=utf-8>
|
||||
|
||||
<script src="../../../../resources/testharness.js"></script>
|
||||
<script src="../../../../resources/testharnessreport.js"></script>
|
||||
|
||||
<div id=log></div>
|
||||
<script src="../../../../html/semantics/forms/the-input-element/input-type-checkbox-switch.tentative.window.js"></script>
|
|
@ -0,0 +1,19 @@
|
|||
test(t => {
|
||||
const input = document.createElement("input");
|
||||
input.switch = true;
|
||||
|
||||
assert_true(input.hasAttribute("switch"));
|
||||
assert_equals(input.getAttribute("switch"), "");
|
||||
assert_equals(input.type, "text");
|
||||
}, "switch IDL attribute, setter");
|
||||
|
||||
test(t => {
|
||||
const container = document.createElement("div");
|
||||
container.innerHTML = "<input type=checkbox switch>";
|
||||
const input = container.firstChild;
|
||||
|
||||
assert_true(input.hasAttribute("switch"));
|
||||
assert_equals(input.getAttribute("switch"), "");
|
||||
assert_equals(input.type, "checkbox");
|
||||
assert_true(input.switch);
|
||||
}, "switch IDL attribute, getter");
|
|
@ -0,0 +1,8 @@
|
|||
<!doctype html>
|
||||
<meta charset=utf-8>
|
||||
|
||||
<script src="../../../../resources/testharness.js"></script>
|
||||
<script src="../../../../resources/testharnessreport.js"></script>
|
||||
|
||||
<div id=log></div>
|
||||
<script src="../../../../html/semantics/selectors/pseudo-classes/input-checkbox-switch.tentative.window.js"></script>
|
|
@ -0,0 +1,75 @@
|
|||
test(t => {
|
||||
const input = document.body.appendChild(document.createElement("input"));
|
||||
t.add_cleanup(() => input.remove());
|
||||
input.type = "checkbox";
|
||||
input.switch = true;
|
||||
input.indeterminate = true;
|
||||
|
||||
assert_false(input.matches(":indeterminate"));
|
||||
}, "Switch control does not match :indeterminate");
|
||||
|
||||
test(t => {
|
||||
const input = document.body.appendChild(document.createElement("input"));
|
||||
t.add_cleanup(() => input.remove());
|
||||
input.type = "checkbox";
|
||||
input.switch = true;
|
||||
input.indeterminate = true;
|
||||
|
||||
assert_false(input.matches(":indeterminate"));
|
||||
|
||||
input.switch = false;
|
||||
assert_true(input.matches(":indeterminate"));
|
||||
}, "Checkbox that is no longer a switch control does match :indeterminate");
|
||||
|
||||
test(t => {
|
||||
const input = document.body.appendChild(document.createElement("input"));
|
||||
t.add_cleanup(() => input.remove());
|
||||
input.type = "checkbox";
|
||||
input.indeterminate = true;
|
||||
|
||||
assert_true(input.matches(":indeterminate"));
|
||||
|
||||
input.setAttribute("switch", "blah");
|
||||
assert_false(input.matches(":indeterminate"));
|
||||
}, "Checkbox that becomes a switch control does not match :indeterminate");
|
||||
|
||||
test(t => {
|
||||
const input = document.body.appendChild(document.createElement("input"));
|
||||
t.add_cleanup(() => input.remove());
|
||||
input.type = "checkbox";
|
||||
input.indeterminate = true;
|
||||
|
||||
assert_true(document.body.matches(":has(:indeterminate)"));
|
||||
|
||||
input.switch = true;
|
||||
assert_false(document.body.matches(":has(:indeterminate)"));
|
||||
}, "Parent of a checkbox that becomes a switch control does not match :has(:indeterminate)");
|
||||
|
||||
test(t => {
|
||||
const input = document.body.appendChild(document.createElement("input"));
|
||||
t.add_cleanup(() => input.remove());
|
||||
input.type = "checkbox";
|
||||
input.switch = true
|
||||
input.checked = true;
|
||||
|
||||
assert_true(document.body.matches(":has(:checked)"));
|
||||
|
||||
input.switch = false;
|
||||
assert_true(document.body.matches(":has(:checked)"));
|
||||
|
||||
input.checked = false;
|
||||
assert_false(document.body.matches(":has(:checked)"));
|
||||
}, "Parent of a switch control that becomes a checkbox continues to match :has(:checked)");
|
||||
|
||||
test(t => {
|
||||
const input = document.body.appendChild(document.createElement("input"));
|
||||
t.add_cleanup(() => input.remove());
|
||||
input.type = "checkbox";
|
||||
input.switch = true;
|
||||
input.indeterminate = true;
|
||||
assert_false(input.matches(":indeterminate"));
|
||||
input.type = "text";
|
||||
input.removeAttribute("switch");
|
||||
input.type = "checkbox";
|
||||
assert_true(input.matches(":indeterminate"));
|
||||
}, "A switch control that becomes a checkbox in a roundabout way");
|
Loading…
Add table
Add a link
Reference in a new issue