LibWeb: Fix case insensitivity for HTMLElement "hidden" attribute

This commit is contained in:
Veeti Paananen 2025-09-10 21:02:12 +03:00 committed by Jelle Raaijmakers
parent bf8b8c260a
commit 5e23df7d8a
5 changed files with 111 additions and 2 deletions

View File

@ -852,13 +852,15 @@ GC::Ptr<DOM::NodeList> HTMLElement::labels()
return m_labels;
}
// https://html.spec.whatwg.org/multipage/interaction.html#dom-hidden
Variant<bool, double, String> HTMLElement::hidden() const
{
// 1. If the hidden attribute is in the hidden until found state, then return "until-found".
if (get_attribute(HTML::AttributeNames::hidden) == "until-found")
auto const& hidden = get_attribute(HTML::AttributeNames::hidden);
if (hidden.has_value() && hidden->equals_ignoring_ascii_case("until-found"sv))
return "until-found"_string;
// 2. If the hidden attribute is set, then return true.
if (has_attribute(HTML::AttributeNames::hidden))
if (hidden.has_value())
return true;
// 3. Return false.
return false;

View File

@ -0,0 +1,13 @@
Harness status: OK
Found 8 tests
8 Pass
Pass hidden-ua-stylesheet
Pass div.removeAttribute('hidden')
Pass div.setAttribute('hidden', '')
Pass div.setAttribute('hidden', 'asdf')
Pass div.setAttribute('hidden', 'until-found')
Pass div.setAttribute('hidden', 'UNTIL-FOUND')
Pass div.setAttribute('hidden', 'UnTiL-FoUnD')
Pass div.setAttribute('hidden', '0')

View File

@ -0,0 +1,6 @@
Harness status: OK
Found 1 tests
1 Pass
Pass element.hidden should return "until-found" regardless of uppercase letters.

View File

@ -0,0 +1,68 @@
<!DOCTYPE html>
<link rel=author href="mailto:jarhar@chromium.org">
<link rel=help href="https://html.spec.whatwg.org/multipage/rendering.html#hiddenCSS">
<link rel=help href="https://github.com/whatwg/html/pull/7475#issuecomment-1069313217">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<div id=div>hello world</div>
<table id=table>
<colgroup id=colgroup>
<col id=col></col>
</colgroup>
</table>
<script>
function testDisplayNone(description) {
test(() => {
assert_equals(getComputedStyle(div).display, 'none',
`${description} should make the div display:none.`);
assert_equals(getComputedStyle(div).contentVisibility, 'visible',
`${description} should not affect the div's content-visibility property.`);
}, description);
}
function testCVHidden(description) {
test(() => {
assert_equals(getComputedStyle(div).display, 'block',
`${description} should not affect the div's display property.`);
assert_equals(getComputedStyle(div).contentVisibility, 'hidden',
`${description} should make the div content-visibility:hidden.`);
assert_equals(div.hidden, "until-found",
`${description} should make the div hidden=until-found.`);
}, description);
}
function testNormal(description) {
test(() => {
assert_equals(getComputedStyle(div).display, 'block',
`${description} should not affect the div's display property.`);
assert_equals(getComputedStyle(div).contentVisibility, 'visible',
`${description} should not affect the div's content-visibility property.`);
}, description);
}
test(() => {
div.removeAttribute('hidden');
testNormal(`div.removeAttribute('hidden')`);
div.setAttribute('hidden', '');
testDisplayNone(`div.setAttribute('hidden', '')`);
div.setAttribute('hidden', 'asdf');
testDisplayNone(`div.setAttribute('hidden', 'asdf')`);
div.setAttribute('hidden', 'until-found');
testCVHidden(`div.setAttribute('hidden', 'until-found')`);
div.setAttribute('hidden', 'UNTIL-FOUND');
testCVHidden(`div.setAttribute('hidden', 'UNTIL-FOUND')`);
div.setAttribute('hidden', 'UnTiL-FoUnD');
testCVHidden(`div.setAttribute('hidden', 'UnTiL-FoUnD')`);
div.setAttribute('hidden', '0');
testDisplayNone(`div.setAttribute('hidden', '0')`);
});
</script>

View File

@ -0,0 +1,20 @@
<!DOCTYPE html>
<link rel=author href="mailto:jarhar@chromium.org">
<link rel=help href="https://html.spec.whatwg.org/#the-hidden-attribute">
<link rel=helph href="https://issues.chromium.org/issues/402108887">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<div id=target>div</div>
<script>
test(() => {
const target = document.getElementById('target');
target.setAttribute('hidden', 'UNTIL-FOUND');
assert_equals(target.hidden, 'until-found');
target.setAttribute('hidden', 'uNtIl-FoUnD');
assert_equals(target.hidden, 'until-found');
target.setAttribute('hidden', 'until-found');
assert_equals(target.hidden, 'until-found');
}, 'element.hidden should return "until-found" regardless of uppercase letters.');
</script>