From fdd52c17d7889d5180dd1a8306504944027ea1e8 Mon Sep 17 00:00:00 2001
From: Pierre Tachoire <pierre@lightpanda.io>
Date: Thu, 19 Feb 2026 09:52:05 +0100
Subject: [PATCH] add CSSStyleProperties array set support

---
 .../tests/element/css_style_properties.html   | 23 +++++++++++++++++++
 src/browser/webapi/css/CSSStyleProperties.zig | 13 ++++++++++-
 2 files changed, 35 insertions(+), 1 deletion(-)

diff --git a/src/browser/tests/element/css_style_properties.html b/src/browser/tests/element/css_style_properties.html
index 4bbce5e6..ab582132 100644
--- a/src/browser/tests/element/css_style_properties.html
+++ b/src/browser/tests/element/css_style_properties.html
@@ -121,6 +121,29 @@
 }
 </script>
 
+<script id="propertyAssignment">
+{
+  const div = $('#test-div');
+  div.style.cssText = '';
+
+  // camelCase assignment
+  div.style.opacity = '0.5';
+  testing.expectEqual('0.5', div.style.opacity);
+
+  // bracket notation assignment
+  div.style['filter'] = 'blur(5px)';
+  testing.expectEqual('blur(5px)', div.style.filter);
+
+  // numeric value coerced to string
+  div.style.opacity = 1;
+  testing.expectEqual('1', div.style.opacity);
+
+  // assigning method names should be ignored (not intercepted)
+  div.style.setProperty('color', 'blue');
+  testing.expectEqual('blue', div.style.color);
+}
+</script>
+
 <script id="prototypeChainCheck">
 {
   const div = $('#test-div');
diff --git a/src/browser/webapi/css/CSSStyleProperties.zig b/src/browser/webapi/css/CSSStyleProperties.zig
index f5d3a641..1bd51a4a 100644
--- a/src/browser/webapi/css/CSSStyleProperties.zig
+++ b/src/browser/webapi/css/CSSStyleProperties.zig
@@ -37,6 +37,14 @@ pub fn asCSSStyleDeclaration(self: *CSSStyleProperties) *CSSStyleDeclaration {
     return self._proto;
 }
 
+pub fn setNamed(self: *CSSStyleProperties, name: []const u8, value: []const u8, page: *Page) !void {
+    if (method_names.has(name)) {
+        return error.NotHandled;
+    }
+    const dash_case = camelCaseToDashCase(name, &page.buf);
+    try self._proto.setProperty(dash_case, value, null, page);
+}
+
 pub fn getNamed(self: *CSSStyleProperties, name: []const u8, page: *Page) ![]const u8 {
     if (method_names.has(name)) {
         return error.NotHandled;
@@ -108,6 +116,9 @@ fn isKnownCSSProperty(dash_case: []const u8) bool {
         .{ "display", {} },
         .{ "visibility", {} },
         .{ "opacity", {} },
+        .{ "filter", {} },
+        .{ "transform", {} },
+        .{ "transition", {} },
         .{ "position", {} },
         .{ "top", {} },
         .{ "bottom", {} },
@@ -201,5 +212,5 @@ pub const JsApi = struct {
         pub var class_id: bridge.ClassId = undefined;
     };
 
-    pub const @"[]" = bridge.namedIndexed(CSSStyleProperties.getNamed, null, null, .{});
+    pub const @"[]" = bridge.namedIndexed(CSSStyleProperties.getNamed, CSSStyleProperties.setNamed, null, .{});
 };