From aca651885021829de4ddbbcdfdd8f65b7b5b95ae Mon Sep 17 00:00:00 2001
From: Navid EMAD <navid.emad@yespark.fr>
Date: Wed, 29 Apr 2026 05:50:54 +0200
Subject: [PATCH] selector: gate :disabled / :enabled on the HTML "disabled
 concept"

Per HTML "concept-fe-disabled", only listed elements (button, input,
select, textarea, optgroup, option, fieldset) participate in the
disabled concept. Anything else (e.g. <div disabled>) has no disabled
state and never matches :disabled / :enabled.

Add Element.hasDisabledConcept() and gate isDisabled() on it. Update
the :enabled selector arm so non-form-controls no longer match.
---
 .../tests/element/disabled_inheritance.html    | 18 ++++++++++++++++++
 src/browser/webapi/Element.zig                 | 14 ++++++++++++++
 src/browser/webapi/selector/List.zig           |  2 +-
 3 files changed, 33 insertions(+), 1 deletion(-)

diff --git a/src/browser/tests/element/disabled_inheritance.html b/src/browser/tests/element/disabled_inheritance.html
index 1fe41e73..e7857dfa 100644
--- a/src/browser/tests/element/disabled_inheritance.html
+++ b/src/browser/tests/element/disabled_inheritance.html
@@ -33,6 +33,10 @@
   <input id="own_enabled" type="text">
 </form>
 
+<div id="div_plain">x</div>
+<div id="div_with_disabled_attr" disabled>y</div>
+<span id="span_plain">z</span>
+
 <script id="fieldset_inheritance">
 {
   // Form controls inside <fieldset disabled> match :disabled.
@@ -93,6 +97,20 @@
 }
 </script>
 
+<script id="concept_gate">
+{
+  // Per HTML "concept-fe-disabled", only listed elements (button, input,
+  // select, textarea, optgroup, option, fieldset) participate in the
+  // disabled concept. Anything else never matches :disabled / :enabled,
+  // even with an own [disabled] attribute.
+  testing.expectFalse($('#div_plain').matches(':disabled'));
+  testing.expectFalse($('#div_plain').matches(':enabled'));
+  testing.expectFalse($('#span_plain').matches(':enabled'));
+  testing.expectFalse($('#div_with_disabled_attr').matches(':disabled'));
+  testing.expectFalse($('#div_with_disabled_attr').matches(':enabled'));
+}
+</script>
+
 <script id="querySelectorAll">
 {
   // querySelectorAll(':disabled') should find every disabled element.
diff --git a/src/browser/webapi/Element.zig b/src/browser/webapi/Element.zig
index 707f8a7f..b6983727 100644
--- a/src/browser/webapi/Element.zig
+++ b/src/browser/webapi/Element.zig
@@ -600,7 +600,21 @@ pub fn hasAttributeSafe(self: *const Element, name: String) bool {
     return attributes.hasSafe(name);
 }
 
+// Per HTML "concept-fe-disabled", only listed elements participate in the
+// disabled concept. Anything else (e.g. <div disabled>) has no disabled
+// state and never matches :disabled / :enabled.
+pub fn hasDisabledConcept(self: *const Element) bool {
+    return switch (self.getTag()) {
+        .button, .input, .select, .textarea, .optgroup, .option, .fieldset => true,
+        else => false,
+    };
+}
+
 pub fn isDisabled(self: *Element) bool {
+    if (!self.hasDisabledConcept()) {
+        return false;
+    }
+
     if (self.getAttributeSafe(comptime .wrap("disabled")) != null) {
         return true;
     }
diff --git a/src/browser/webapi/selector/List.zig b/src/browser/webapi/selector/List.zig
index 3b1d3ffa..c8274e42 100644
--- a/src/browser/webapi/selector/List.zig
+++ b/src/browser/webapi/selector/List.zig
@@ -538,7 +538,7 @@ fn matchesPseudoClass(el: *Node.Element, pseudo: Selector.PseudoClass, scope: *N
             return el.isDisabled();
         },
         .enabled => {
-            return !el.isDisabled();
+            return el.hasDisabledConcept() and !el.isDisabled();
         },
         .indeterminate => {
             const input = el.is(Node.Element.Html.Input) orelse return false;