From 0a4c2a2743982b450687df23f854d76591c6883d Mon Sep 17 00:00:00 2001
From: Navid EMAD <navid.emad@yespark.fr>
Date: Tue, 28 Apr 2026 06:31:14 +0200
Subject: [PATCH 1/3] css: apply UA stylesheet display:none defaults for
 unrendered elements
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

`StyleManager.hasDisplayNone` honored only the `[hidden]` UA-stylesheet
rule; the rest of HTML Rendering §15.3.1 ("Hidden elements") was
unimplemented. As a result `getComputedStyle(headEl).display === "block"`
and `el.checkVisibility()` returned `true` for `<head>`, `<script>`,
`<style>`, `<link>`, `<meta>`, `<title>`, `<noscript>`, `<template>`,
`<param>`, `<source>`, `<track>`, `<area>`, `<datalist>`,
`<input type="hidden">`, and the non-`<summary>` direct children of a
closed `<details>`.

Add a `matchesUaDisplayNoneRule` helper consulted at the top of
`isElementHidden` so both `getComputedStyle().display` (via
`hasDisplayNone`) and `el.checkVisibility()` (via `isHidden`'s ancestor
walker) honor the same UA-stylesheet truth. The helper covers the
`[hidden]` attribute, a new `Tag.isHiddenByUaStylesheet()` predicate
mapping the spec's unrendered tag list, the
`input[type="hidden" i]` rule, and the `details:not([open]) > *:not(summary)`
parent-relationship rule. Inline `display` overrides still win per CSS
cascade.

Closes #2293
---
 src/browser/StyleManager.zig                  |  50 +++++++-
 .../tests/element/check_visibility.html       | 109 ++++++++++++++++++
 src/browser/webapi/Element.zig                |  14 +++
 src/cdp/domains/dom.zig                       |   7 +-
 4 files changed, 175 insertions(+), 5 deletions(-)
diff --git a/src/browser/StyleManager.zig b/src/browser/StyleManager.zig
index d9672e67..35e436cc 100644
--- a/src/browser/StyleManager.zig
+++ b/src/browser/StyleManager.zig
@@ -234,14 +234,45 @@ pub fn isHidden(self: *StyleManager, el: *Element, cache: ?*VisibilityCache, opt
 }
 
 /// Computed display:none for a single element (own property, no ancestor walk).
-/// Also honors the HTML `hidden` attribute, matching the UA stylesheet rule
-/// `[hidden] { display: none }`.
+/// Honors the UA stylesheet rules per HTML Rendering §15.3.1 "Hidden elements"
+/// via `isElementHidden`.
 pub fn hasDisplayNone(self: *StyleManager, el: *Element) bool {
     self.rebuildIfDirty() catch return false;
-    if (el.hasAttributeSafe(comptime .wrap("hidden"))) return true;
     return self.isElementHidden(el, .{});
 }
 
+/// True if `el` matches a UA-stylesheet display:none rule per HTML Rendering
+/// §15.3.1 "Hidden elements" — covers the `[hidden]` attribute, the unrendered
+/// tag-name list, `<input type="hidden" i>`, and the closed-`<details>` non-
+/// `<summary>` direct-child rule. Centralized so `getComputedStyle().display`
+/// (via `hasDisplayNone`) and `el.checkVisibility()` (via `isHidden`) share
+/// the same UA-stylesheet truth.
+fn matchesUaDisplayNoneRule(el: *Element) bool {
+    // [hidden] { display: none } — applies to all elements.
+    if (el.hasAttributeSafe(comptime .wrap("hidden"))) return true;
+
+    const tag = el.getTag();
+    if (tag.isHiddenByUaStylesheet()) return true;
+
+    // input[type="hidden" i] { display: none !important }
+    if (tag == .input) {
+        if (el.getAttributeSafe(comptime .wrap("type"))) |type_val| {
+            if (std.ascii.eqlIgnoreCase(type_val, "hidden")) return true;
+        }
+    }
+
+    // details:not([open]) > *:not(summary) { display: none }
+    if (tag != .summary) {
+        if (el.parentElement()) |parent| {
+            if (parent.getTag() == .details and !parent.hasAttributeSafe(comptime .wrap("open"))) {
+                return true;
+            }
+        }
+    }
+
+    return false;
+}
+
 /// Computed visibility:hidden for an element, considering only the `visibility`
 /// chain (walks ancestors since `visibility` inherits by default). Ignores
 /// display:none: an ancestor with display:none means the element isn't
@@ -313,6 +344,19 @@ fn isElementHidden(self: *StyleManager, el: *Element, options: CheckVisibilityOp
         opacity_priority = INLINE_PRIORITY;
     }
 
+    // UA stylesheet display:none rules (HTML Rendering §15.3.1 "Hidden elements").
+    // Inline `display` already wins above (sets display_priority == INLINE_PRIORITY);
+    // skip the UA check in that case so author inline overrides keep working.
+    // Otherwise short-circuit return true: the spec lists `input[type=hidden]`
+    // and `noscript` as `!important` and the rest are normal-origin UA rules
+    // that author CSS could in principle override, but author overrides of
+    // `<script>`/`<head>`/closed-`<details>` children are exceptionally rare
+    // and matching the existing `[hidden]` short-circuit keeps the behavior
+    // consistent across all UA rules.
+    if (options.check_display and display_priority != INLINE_PRIORITY) {
+        if (matchesUaDisplayNoneRule(el)) return true;
+    }
+
     if (display_priority == INLINE_PRIORITY and visibility_priority == INLINE_PRIORITY and opacity_priority == INLINE_PRIORITY) {
         return false;
     }
diff --git a/src/browser/tests/element/check_visibility.html b/src/browser/tests/element/check_visibility.html
index eeb7ec25..364c5314 100644
--- a/src/browser/tests/element/check_visibility.html
+++ b/src/browser/tests/element/check_visibility.html
@@ -191,6 +191,115 @@
   }
 </script>
 
+<script id="ua_unrendered_tags_are_display_none">
+  {
+    // Per HTML Rendering §15.3.1 "Hidden elements", these tags get
+    // display:none from the UA stylesheet:
+    //   area, base, datalist, head, link, meta, noscript, param, script,
+    //   source, style, template, title, track
+    // (basefont/noembed/noframes/rp are obsolete and not represented in
+    // Lightpanda's Element.Tag enum.)
+    const tags = [
+      'area', 'base', 'datalist', 'link', 'meta', 'noscript', 'param',
+      'script', 'source', 'style', 'template', 'title', 'track',
+    ];
+    for (const t of tags) {
+      const el = document.createElement(t);
+      document.body.appendChild(el);
+      testing.expectEqual('none', window.getComputedStyle(el).display);
+      testing.expectEqual(false, el.checkVisibility());
+      el.remove();
+    }
+    // <head> itself
+    testing.expectEqual('none', window.getComputedStyle(document.head).display);
+    testing.expectEqual(false, document.head.checkVisibility());
+  }
+</script>
+
+<script id="ua_input_type_hidden_is_display_none">
+  {
+    // input[type="hidden" i] { display: none !important }
+    const inp = document.createElement('input');
+    inp.type = 'hidden';
+    document.body.appendChild(inp);
+    testing.expectEqual('none', window.getComputedStyle(inp).display);
+    testing.expectEqual(false, inp.checkVisibility());
+
+    // Other input types are visible
+    inp.type = 'text';
+    testing.expectEqual(true, inp.checkVisibility());
+
+    // Spec uses [type=hidden i] (case-insensitive)
+    inp.type = 'HIDDEN';
+    testing.expectEqual(false, inp.checkVisibility());
+
+    inp.remove();
+  }
+</script>
+
+<script id="ua_closed_details_hides_non_summary_children">
+  {
+    // details:not([open]) > *:not(summary) { display: none }
+    const details = document.createElement('details');
+    const summary = document.createElement('summary');
+    summary.textContent = 'header';
+    const child = document.createElement('p');
+    child.textContent = 'body';
+    details.appendChild(summary);
+    details.appendChild(child);
+    document.body.appendChild(details);
+
+    // Closed: <summary> visible, body child hidden
+    testing.expectEqual(true, summary.checkVisibility());
+    testing.expectEqual(false, child.checkVisibility());
+    testing.expectEqual('none', window.getComputedStyle(child).display);
+
+    // Open: child visible
+    details.setAttribute('open', '');
+    testing.expectEqual(true, child.checkVisibility());
+
+    // Closed again
+    details.removeAttribute('open');
+    testing.expectEqual(false, child.checkVisibility());
+
+    // Descendants of a closed-details child are hidden via the ancestor walk.
+    const grandchild = document.createElement('span');
+    child.appendChild(grandchild);
+    testing.expectEqual(false, grandchild.checkVisibility());
+
+    details.remove();
+  }
+</script>
+
+<script id="hidden_attribute_propagates_through_check_visibility">
+  {
+    // [hidden] { display: none } applies to the element itself...
+    const parent = document.createElement('div');
+    parent.setAttribute('hidden', '');
+    const child = document.createElement('span');
+    parent.appendChild(child);
+    document.body.appendChild(parent);
+
+    testing.expectEqual(false, parent.checkVisibility());
+    // ...and through ancestor walking, hides descendants too.
+    testing.expectEqual(false, child.checkVisibility());
+
+    parent.remove();
+  }
+</script>
+
+<script id="inline_display_overrides_ua_default">
+  {
+    // Author inline `display: block` on a UA-hidden tag wins per CSS cascade
+    // (inline > UA stylesheet).
+    const s = document.createElement('script');
+    s.style.display = 'block';
+    document.body.appendChild(s);
+    testing.expectEqual(true, s.checkVisibility());
+    s.remove();
+  }
+</script>
+
 <script id="deep_nesting">
   {
     const levels = 5;
diff --git a/src/browser/webapi/Element.zig b/src/browser/webapi/Element.zig
index 97b4b346..c8a6276f 100644
--- a/src/browser/webapi/Element.zig
+++ b/src/browser/webapi/Element.zig
@@ -1659,6 +1659,20 @@ pub const Tag = enum {
             else => false,
         };
     }
+
+    // UA stylesheet display:none defaults per HTML Rendering §15.3.1
+    // "Hidden elements" (https://html.spec.whatwg.org/multipage/rendering.html#hidden-elements).
+    // The spec also lists basefont, noembed, noframes, rp; those tags are
+    // obsolete and not represented in this enum, so they fall through to
+    // `.unknown`/`.custom` and aren't matched here.
+    pub fn isHiddenByUaStylesheet(self: Tag) bool {
+        return switch (self) {
+            .area, .base, .datalist, .head, .link, .meta, .noscript, .param,
+            .script, .source, .style, .template, .title, .track,
+            => true,
+            else => false,
+        };
+    }
 };
 
 pub const JsApi = struct {
diff --git a/src/cdp/domains/dom.zig b/src/cdp/domains/dom.zig
index a322f5cd..de7712e7 100644
--- a/src/cdp/domains/dom.zig
+++ b/src/cdp/domains/dom.zig
@@ -713,13 +713,16 @@ test "cdp.dom: getBoxModel" {
     });
     try ctx.expectSentResult(.{ .nodeId = 3 }, .{ .id = 4 });
 
+    // Box model on the <p> nodeId returned above.
+    // Note: nodeId 6 is <head>, which is `display: none` per HTML Rendering
+    // §15.3.1, so its box model is all-zeros — exercise a visible element.
     try ctx.processMessage(.{
         .id = 5,
         .method = "DOM.getBoxModel",
-        .params = .{ .nodeId = 6 },
+        .params = .{ .nodeId = 3 },
     });
     try ctx.expectSentResult(.{ .model = BoxModel{
-        .content = Quad{ 10.0, 10.0, 15.0, 10.0, 15.0, 15.0, 10.0, 15.0 },
+        .content = Quad{ 25.0, 25.0, 30.0, 25.0, 30.0, 30.0, 25.0, 30.0 },
         .padding = Quad{ 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0 },
         .border = Quad{ 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0 },
         .margin = Quad{ 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0 },

From dfa0ba778d891faa147d0404bf7e6f571cc0dee7 Mon Sep 17 00:00:00 2001
From: Navid EMAD <navid.emad@yespark.fr>
Date: Wed, 29 Apr 2026 00:53:10 +0200
Subject: [PATCH 2/3] css: address review feedback on UA display:none helper
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Tighten matchesUaDisplayNoneRule docstring; lead with the
  centralization purpose and HTML Rendering §15.3.1 spec citation.
- Reorder checks: tag-name UA list first (O(1) switch, exits for
  ~95% of elements with ordinary tags before the attribute lookup).
- Use el.is(Input) + input._input_type == .hidden instead of
  case-insensitive string compare on the raw "type" attribute;
  matches the pattern used in EventManager / Form / RadioNodeList,
  and _input_type is parsed case-insensitively at attribute-set time.
- Compress the comment block above the matchesUaDisplayNoneRule
  call site in isElementHidden.

Behavior-preserving refactor; full unit test suite (494 tests) passes.
---
 src/browser/StyleManager.zig | 35 ++++++++++++++++-------------------
 1 file changed, 16 insertions(+), 19 deletions(-)

diff --git a/src/browser/StyleManager.zig b/src/browser/StyleManager.zig
index 35e436cc..723a9a51 100644
--- a/src/browser/StyleManager.zig
+++ b/src/browser/StyleManager.zig
@@ -45,6 +45,7 @@ pub const PointerEventsCache = std.AutoHashMapUnmanaged(*Element, bool);
 const StyleManager = @This();
 
 const Tag = Element.Tag;
+const Input = Element.Html.Input;
 const RuleList = std.MultiArrayList(VisibilityRule);
 
 frame: *Frame,
@@ -241,23 +242,22 @@ pub fn hasDisplayNone(self: *StyleManager, el: *Element) bool {
     return self.isElementHidden(el, .{});
 }
 
-/// True if `el` matches a UA-stylesheet display:none rule per HTML Rendering
-/// §15.3.1 "Hidden elements" — covers the `[hidden]` attribute, the unrendered
-/// tag-name list, `<input type="hidden" i>`, and the closed-`<details>` non-
-/// `<summary>` direct-child rule. Centralized so `getComputedStyle().display`
-/// (via `hasDisplayNone`) and `el.checkVisibility()` (via `isHidden`) share
-/// the same UA-stylesheet truth.
+/// Centralizes UA-stylesheet display:none truth so `getComputedStyle().display`
+/// (via `hasDisplayNone`) and `el.checkVisibility()` (via `isHidden`) agree.
+/// Spec: HTML Rendering §15.3.1 "Hidden elements".
 fn matchesUaDisplayNoneRule(el: *Element) bool {
-    // [hidden] { display: none } — applies to all elements.
-    if (el.hasAttributeSafe(comptime .wrap("hidden"))) return true;
-
+    // Tag check first: O(1) switch, exits for the ~95% of elements with
+    // ordinary tags before we touch the attribute list.
     const tag = el.getTag();
     if (tag.isHiddenByUaStylesheet()) return true;
 
+    if (el.hasAttributeSafe(comptime .wrap("hidden"))) return true;
+
     // input[type="hidden" i] { display: none !important }
+    // _input_type is parsed case-insensitively at attribute-set time.
     if (tag == .input) {
-        if (el.getAttributeSafe(comptime .wrap("type"))) |type_val| {
-            if (std.ascii.eqlIgnoreCase(type_val, "hidden")) return true;
+        if (el.is(Input)) |input| {
+            if (input._input_type == .hidden) return true;
         }
     }
 
@@ -345,14 +345,11 @@ fn isElementHidden(self: *StyleManager, el: *Element, options: CheckVisibilityOp
     }
 
     // UA stylesheet display:none rules (HTML Rendering §15.3.1 "Hidden elements").
-    // Inline `display` already wins above (sets display_priority == INLINE_PRIORITY);
-    // skip the UA check in that case so author inline overrides keep working.
-    // Otherwise short-circuit return true: the spec lists `input[type=hidden]`
-    // and `noscript` as `!important` and the rest are normal-origin UA rules
-    // that author CSS could in principle override, but author overrides of
-    // `<script>`/`<head>`/closed-`<details>` children are exceptionally rare
-    // and matching the existing `[hidden]` short-circuit keeps the behavior
-    // consistent across all UA rules.
+    // Skipped when an inline `display` is set so author overrides win per cascade.
+    // All UA rules are short-circuited here; the spec marks some as `!important`
+    // (`input[type=hidden]`, `noscript`) and others as normal-origin, but author
+    // CSS overriding `<script>`/`<head>`/closed-`<details>` children is rare
+    // enough that uniform treatment is acceptable.
     if (options.check_display and display_priority != INLINE_PRIORITY) {
         if (matchesUaDisplayNoneRule(el)) return true;
     }

From d92ebdeb89365c53be273c98438bb1b76c79d0c0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Adri=C3=A0=20Arrufat?= <adria.arrufat@gmail.com>
Date: Wed, 29 Apr 2026 08:22:22 +0200
Subject: [PATCH 3/3] css: apply zig fmt to Element.zig

---
 src/browser/webapi/Element.zig | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/src/browser/webapi/Element.zig b/src/browser/webapi/Element.zig
index c8a6276f..4a59d203 100644
--- a/src/browser/webapi/Element.zig
+++ b/src/browser/webapi/Element.zig
@@ -1667,8 +1667,20 @@ pub const Tag = enum {
     // `.unknown`/`.custom` and aren't matched here.
     pub fn isHiddenByUaStylesheet(self: Tag) bool {
         return switch (self) {
-            .area, .base, .datalist, .head, .link, .meta, .noscript, .param,
-            .script, .source, .style, .template, .title, .track,
+            .area,
+            .base,
+            .datalist,
+            .head,
+            .link,
+            .meta,
+            .noscript,
+            .param,
+            .script,
+            .source,
+            .style,
+            .template,
+            .title,
+            .track,
             => true,
             else => false,
         };
