From 4f5a9f683327ae0450e48a5f8c1fa00a3358cdd2 Mon Sep 17 00:00:00 2001
From: Pierre Tachoire <pierre@lightpanda.io>
Date: Fri, 8 Dec 2023 12:11:11 +0100
Subject: [PATCH 1/6] dom: implement some element getters

---
 src/dom/element.zig | 23 ++++++++++++++++++++++-
 src/netsurf.zig     | 21 ++++++++++++++++-----
 2 files changed, 38 insertions(+), 6 deletions(-)

diff --git a/src/dom/element.zig b/src/dom/element.zig
index e7380e3d..b6b4138a 100644
--- a/src/dom/element.zig
+++ b/src/dom/element.zig
@@ -25,8 +25,20 @@ pub const Element = struct {
     // JS funcs
     // --------
 
+    pub fn get_namespaceURI(self: *parser.Element) !?[]const u8 {
+        return try parser.nodeGetNamespace(parser.elementToNode(self));
+    }
+
+    pub fn get_prefix(self: *parser.Element) !?[]const u8 {
+        return try parser.nodeGetPrefix(parser.elementToNode(self));
+    }
+
     pub fn get_localName(self: *parser.Element) ![]const u8 {
-        return try parser.elementLocalName(self);
+        return try parser.nodeLocalName(parser.elementToNode(self));
+    }
+
+    pub fn get_tagName(self: *parser.Element) ![]const u8 {
+        return try parser.nodeName(parser.elementToNode(self));
     }
 
     pub fn get_attributes(self: *parser.Element) !*parser.NamedNodeMap {
@@ -92,6 +104,15 @@ pub fn testExecFn(
     js_env: *jsruntime.Env,
     comptime _: []jsruntime.API,
 ) !void {
+    var getters = [_]Case{
+        .{ .src = "let g = document.getElementById('content')", .ex = "undefined" },
+        .{ .src = "g.namespaceURI", .ex = "http://www.w3.org/1999/xhtml" },
+        .{ .src = "g.prefix", .ex = "null" },
+        .{ .src = "g.localName", .ex = "div" },
+        .{ .src = "g.tagName", .ex = "DIV" },
+    };
+    try checkCases(js_env, &getters);
+
     var attribute = [_]Case{
         .{ .src = "let a = document.getElementById('content')", .ex = "undefined" },
         .{ .src = "a.hasAttributes()", .ex = "true" },
diff --git a/src/netsurf.zig b/src/netsurf.zig
index d32b2cee..ec2c60f0 100644
--- a/src/netsurf.zig
+++ b/src/netsurf.zig
@@ -725,6 +725,22 @@ pub fn nodeGetAttributes(node: *Node) !*NamedNodeMap {
     return res.?;
 }
 
+pub fn nodeGetNamespace(node: *Node) !?[]const u8 {
+    var s: ?*String = undefined;
+    const err = nodeVtable(node).dom_node_get_namespace.?(node, &s);
+    try DOMErr(err);
+    if (s == null) return null;
+    return strToData(s.?);
+}
+
+pub fn nodeGetPrefix(node: *Node) !?[]const u8 {
+    var s: ?*String = undefined;
+    const err = nodeVtable(node).dom_node_get_prefix.?(node, &s);
+    try DOMErr(err);
+    if (s == null) return null;
+    return strToData(s.?);
+}
+
 // nodeToElement is an helper to convert a node to an element.
 pub inline fn nodeToElement(node: *Node) *Element {
     return @as(*Element, @ptrCast(node));
@@ -831,11 +847,6 @@ fn elementVtable(elem: *Element) c.dom_element_vtable {
     return getVtable(c.dom_element_vtable, Element, elem);
 }
 
-pub fn elementLocalName(elem: *Element) ![]const u8 {
-    const node = @as(*Node, @ptrCast(elem));
-    return try nodeLocalName(node);
-}
-
 pub fn elementGetAttribute(elem: *Element, name: []const u8) !?[]const u8 {
     var s: ?*String = undefined;
     const err = elementVtable(elem).dom_element_get_attribute.?(elem, try strFromData(name), &s);

From 99caa1c4957fb1788c95d6db27587959db1eab92 Mon Sep 17 00:00:00 2001
From: Pierre Tachoire <pierre@lightpanda.io>
Date: Fri, 8 Dec 2023 15:58:04 +0100
Subject: [PATCH 2/6] dom: implement element.id

---
 src/dom/element.zig | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/src/dom/element.zig b/src/dom/element.zig
index b6b4138a..517d56dd 100644
--- a/src/dom/element.zig
+++ b/src/dom/element.zig
@@ -41,6 +41,14 @@ pub const Element = struct {
         return try parser.nodeName(parser.elementToNode(self));
     }
 
+    pub fn get_id(self: *parser.Element) ![]const u8 {
+        return try parser.elementGetAttribute(self, "id") orelse "";
+    }
+
+    pub fn set_id(self: *parser.Element, id: []const u8) !void {
+        return try parser.elementSetAttribute(self, "id", id);
+    }
+
     pub fn get_attributes(self: *parser.Element) !*parser.NamedNodeMap {
         return try parser.nodeGetAttributes(parser.elementToNode(self));
     }
@@ -113,6 +121,15 @@ pub fn testExecFn(
     };
     try checkCases(js_env, &getters);
 
+    var gettersetters = [_]Case{
+        .{ .src = "let gs = document.getElementById('content')", .ex = "undefined" },
+        .{ .src = "gs.id", .ex = "content" },
+        .{ .src = "gs.id = 'foo'", .ex = "foo" },
+        .{ .src = "gs.id", .ex = "foo" },
+        .{ .src = "gs.id = 'content'", .ex = "content" },
+    };
+    try checkCases(js_env, &gettersetters);
+
     var attribute = [_]Case{
         .{ .src = "let a = document.getElementById('content')", .ex = "undefined" },
         .{ .src = "a.hasAttributes()", .ex = "true" },

From 3d5155bf2bad242f6e22670039e8f24d1d232213 Mon Sep 17 00:00:00 2001
From: Pierre Tachoire <pierre@lightpanda.io>
Date: Fri, 8 Dec 2023 16:03:22 +0100
Subject: [PATCH 3/6] dom: implement element.className

---
 src/dom/element.zig | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/src/dom/element.zig b/src/dom/element.zig
index 517d56dd..2b0b1267 100644
--- a/src/dom/element.zig
+++ b/src/dom/element.zig
@@ -49,6 +49,14 @@ pub const Element = struct {
         return try parser.elementSetAttribute(self, "id", id);
     }
 
+    pub fn get_className(self: *parser.Element) ![]const u8 {
+        return try parser.elementGetAttribute(self, "class") orelse "";
+    }
+
+    pub fn set_className(self: *parser.Element, class: []const u8) !void {
+        return try parser.elementSetAttribute(self, "class", class);
+    }
+
     pub fn get_attributes(self: *parser.Element) !*parser.NamedNodeMap {
         return try parser.nodeGetAttributes(parser.elementToNode(self));
     }
@@ -127,6 +135,12 @@ pub fn testExecFn(
         .{ .src = "gs.id = 'foo'", .ex = "foo" },
         .{ .src = "gs.id", .ex = "foo" },
         .{ .src = "gs.id = 'content'", .ex = "content" },
+        .{ .src = "gs.className", .ex = "" },
+        .{ .src = "let gs2 = document.getElementById('para-empty')", .ex = "undefined" },
+        .{ .src = "gs2.className", .ex = "ok empty" },
+        .{ .src = "gs2.className = 'foo bar baz'", .ex = "foo bar baz" },
+        .{ .src = "gs2.className", .ex = "foo bar baz" },
+        .{ .src = "gs2.className = 'ok empty'", .ex = "ok empty" },
     };
     try checkCases(js_env, &gettersetters);
 

From bd6f3faf9a34d5cd94b1cdf59bfa9877f6a360c7 Mon Sep 17 00:00:00 2001
From: Pierre Tachoire <pierre@lightpanda.io>
Date: Fri, 8 Dec 2023 16:04:40 +0100
Subject: [PATCH 4/6] dom: implement element.slot

---
 src/dom/element.zig | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/src/dom/element.zig b/src/dom/element.zig
index 2b0b1267..0be21b99 100644
--- a/src/dom/element.zig
+++ b/src/dom/element.zig
@@ -57,6 +57,14 @@ pub const Element = struct {
         return try parser.elementSetAttribute(self, "class", class);
     }
 
+    pub fn get_slot(self: *parser.Element) ![]const u8 {
+        return try parser.elementGetAttribute(self, "slot") orelse "";
+    }
+
+    pub fn set_slot(self: *parser.Element, slot: []const u8) !void {
+        return try parser.elementSetAttribute(self, "slot", slot);
+    }
+
     pub fn get_attributes(self: *parser.Element) !*parser.NamedNodeMap {
         return try parser.nodeGetAttributes(parser.elementToNode(self));
     }

From 5c8d3eba3112b8626233c9513ac11c72b9c65f17 Mon Sep 17 00:00:00 2001
From: Pierre Tachoire <pierre@lightpanda.io>
Date: Sat, 9 Dec 2023 10:47:40 +0100
Subject: [PATCH 5/6] dom: implement elemnt.classList

and DOMTokenList
---
 src/dom/dom.zig                            |   2 +
 src/dom/element.zig                        |   6 +
 src/dom/token_list.zig                     | 147 +++++++
 src/netsurf.zig                            |  50 +++
 src/run_tests.zig                          |   2 +
 tests/wpt/dom/nodes/Element-classlist.html | 478 +++++++++++++++++++++
 6 files changed, 685 insertions(+)
 create mode 100644 src/dom/token_list.zig
 create mode 100644 tests/wpt/dom/nodes/Element-classlist.html

diff --git a/src/dom/dom.zig b/src/dom/dom.zig
index 564dc7ca..9c5c269f 100644
--- a/src/dom/dom.zig
+++ b/src/dom/dom.zig
@@ -4,6 +4,7 @@ const DOMException = @import("exceptions.zig").DOMException;
 const EventTarget = @import("event_target.zig").EventTarget;
 const DOMImplementation = @import("implementation.zig").DOMImplementation;
 const NamedNodeMap = @import("namednodemap.zig").NamedNodeMap;
+const DOMTokenList = @import("token_list.zig").DOMTokenList;
 const Nod = @import("node.zig");
 
 pub const Interfaces = generate.Tuple(.{
@@ -11,6 +12,7 @@ pub const Interfaces = generate.Tuple(.{
     EventTarget,
     DOMImplementation,
     NamedNodeMap,
+    DOMTokenList,
     Nod.Node,
     Nod.Interfaces,
 });
diff --git a/src/dom/element.zig b/src/dom/element.zig
index 0be21b99..aa8bc2f5 100644
--- a/src/dom/element.zig
+++ b/src/dom/element.zig
@@ -65,6 +65,10 @@ pub const Element = struct {
         return try parser.elementSetAttribute(self, "slot", slot);
     }
 
+    pub fn get_classList(self: *parser.Element) !*parser.TokenList {
+        return try parser.tokenListCreate(self, "class");
+    }
+
     pub fn get_attributes(self: *parser.Element) !*parser.NamedNodeMap {
         return try parser.nodeGetAttributes(parser.elementToNode(self));
     }
@@ -149,6 +153,8 @@ pub fn testExecFn(
         .{ .src = "gs2.className = 'foo bar baz'", .ex = "foo bar baz" },
         .{ .src = "gs2.className", .ex = "foo bar baz" },
         .{ .src = "gs2.className = 'ok empty'", .ex = "ok empty" },
+        .{ .src = "let cl = gs2.classList", .ex = "undefined" },
+        .{ .src = "cl.length", .ex = "2" },
     };
     try checkCases(js_env, &gettersetters);
 
diff --git a/src/dom/token_list.zig b/src/dom/token_list.zig
new file mode 100644
index 00000000..42e1c73a
--- /dev/null
+++ b/src/dom/token_list.zig
@@ -0,0 +1,147 @@
+const std = @import("std");
+
+const parser = @import("../netsurf.zig");
+
+const jsruntime = @import("jsruntime");
+const Case = jsruntime.test_utils.Case;
+const checkCases = jsruntime.test_utils.checkCases;
+const Variadic = jsruntime.Variadic;
+
+const DOMException = @import("exceptions.zig").DOMException;
+
+// https://dom.spec.whatwg.org/#domtokenlist
+pub const DOMTokenList = struct {
+    pub const Self = parser.TokenList;
+    pub const Exception = DOMException;
+    pub const mem_guarantied = true;
+
+    pub fn get_length(self: *parser.TokenList) !u32 {
+        return parser.tokenListGetLength(self);
+    }
+
+    pub fn _item(self: *parser.TokenList, index: u32) !?[]const u8 {
+        return parser.tokenListItem(self, index);
+    }
+
+    pub fn _contains(self: *parser.TokenList, token: []const u8) !bool {
+        return parser.tokenListContains(self, token);
+    }
+
+    pub fn _add(self: *parser.TokenList, tokens: ?Variadic([]const u8)) !void {
+        if (tokens == null) return;
+        for (tokens.?.slice) |token| {
+            try parser.tokenListAdd(self, token);
+        }
+    }
+
+    pub fn _remove(self: *parser.TokenList, tokens: ?Variadic([]const u8)) !void {
+        if (tokens == null) return;
+        for (tokens.?.slice) |token| {
+            try parser.tokenListRemove(self, token);
+        }
+    }
+
+    /// If token is the empty string, then throw a "SyntaxError" DOMException.
+    /// If token contains any ASCII whitespace, then throw an
+    /// "InvalidCharacterError" DOMException.
+    fn validateToken(token: []const u8) !void {
+        if (token.len == 0) {
+            return parser.DOMError.Syntax;
+        }
+        for (token) |c| {
+            if (std.ascii.isWhitespace(c)) return error.InvalidCharacter;
+        }
+    }
+
+    pub fn _toggle(self: *parser.TokenList, token: []const u8, force: ?bool) !bool {
+        try validateToken(token);
+        const exists = try parser.tokenListContains(self, token);
+        if (exists) {
+            if (force == null or force.? == false) {
+                try parser.tokenListRemove(self, token);
+                return false;
+            }
+            return true;
+        }
+
+        if (force == null or force.? == true) {
+            try parser.tokenListAdd(self, token);
+            return true;
+        }
+        return false;
+    }
+
+    pub fn _replace(self: *parser.TokenList, token: []const u8, new: []const u8) !bool {
+        try validateToken(token);
+        try validateToken(new);
+        const exists = try parser.tokenListContains(self, token);
+        if (!exists) return false;
+        try parser.tokenListRemove(self, token);
+        try parser.tokenListAdd(self, new);
+        return true;
+    }
+
+    // TODO to implement.
+    pub fn _supports(_: *parser.TokenList, token: []const u8) !bool {
+        try validateToken(token);
+        return error.TypeError;
+    }
+
+    pub fn get_value(self: *parser.TokenList) !?[]const u8 {
+        return try parser.tokenListGetValue(self);
+    }
+};
+
+// Tests
+// -----
+
+pub fn testExecFn(
+    _: std.mem.Allocator,
+    js_env: *jsruntime.Env,
+    comptime _: []jsruntime.API,
+) !void {
+    var dynamiclist = [_]Case{
+        .{ .src = "let gs = document.getElementById('para-empty')", .ex = "undefined" },
+        .{ .src = "let cl = gs.classList", .ex = "undefined" },
+        .{ .src = "gs.className", .ex = "ok empty" },
+        .{ .src = "cl.value", .ex = "ok empty" },
+        .{ .src = "cl.length", .ex = "2" },
+        .{ .src = "gs.className = 'foo bar baz'", .ex = "foo bar baz" },
+        .{ .src = "gs.className", .ex = "foo bar baz" },
+        .{ .src = "cl.length", .ex = "3" },
+        .{ .src = "gs.className = 'ok empty'", .ex = "ok empty" },
+        .{ .src = "cl.length", .ex = "2" },
+    };
+    try checkCases(js_env, &dynamiclist);
+
+    var testcases = [_]Case{
+        .{ .src = "let cl2 = gs.classList", .ex = "undefined" },
+        .{ .src = "cl2.length", .ex = "2" },
+        .{ .src = "cl2.item(0)", .ex = "ok" },
+        .{ .src = "cl2.item(1)", .ex = "empty" },
+        .{ .src = "cl2.contains('ok')", .ex = "true" },
+        .{ .src = "cl2.contains('nok')", .ex = "false" },
+        .{ .src = "cl2.add('foo', 'bar', 'baz')", .ex = "undefined" },
+        .{ .src = "cl2.length", .ex = "5" },
+        .{ .src = "cl2.remove('foo', 'bar', 'baz')", .ex = "undefined" },
+        .{ .src = "cl2.length", .ex = "2" },
+    };
+    try checkCases(js_env, &testcases);
+
+    var toogle = [_]Case{
+        .{ .src = "let cl3 = gs.classList", .ex = "undefined" },
+        .{ .src = "cl3.toggle('ok')", .ex = "false" },
+        .{ .src = "cl3.toggle('ok')", .ex = "true" },
+        .{ .src = "cl3.length", .ex = "2" },
+    };
+    try checkCases(js_env, &toogle);
+
+    var replace = [_]Case{
+        .{ .src = "let cl4 = gs.classList", .ex = "undefined" },
+        .{ .src = "cl4.replace('ok', 'nok')", .ex = "true" },
+        .{ .src = "cl4.value", .ex = "empty nok" },
+        .{ .src = "cl4.replace('nok', 'ok')", .ex = "true" },
+        .{ .src = "cl4.value", .ex = "empty ok" },
+    };
+    try checkCases(js_env, &replace);
+}
diff --git a/src/netsurf.zig b/src/netsurf.zig
index ec2c60f0..3f8336ff 100644
--- a/src/netsurf.zig
+++ b/src/netsurf.zig
@@ -893,6 +893,56 @@ pub inline fn elementToNode(e: *Element) *Node {
     return @as(*Node, @ptrCast(e));
 }
 
+// TokenList
+pub const TokenList = c.dom_tokenlist;
+
+pub fn tokenListCreate(elt: *Element, attr: []const u8) !*TokenList {
+    var list: ?*TokenList = undefined;
+    const err = c.dom_tokenlist_create(elt, try strFromData(attr), &list);
+    try DOMErr(err);
+    return list.?;
+}
+
+pub fn tokenListGetLength(l: *TokenList) !u32 {
+    var res: u32 = undefined;
+    const err = c.dom_tokenlist_get_length(l, &res);
+    try DOMErr(err);
+    return res;
+}
+
+pub fn tokenListItem(l: *TokenList, index: u32) !?[]const u8 {
+    var res: ?*String = undefined;
+    const err = c._dom_tokenlist_item(l, index, &res);
+    try DOMErr(err);
+    if (res == null) return null;
+    return strToData(res.?);
+}
+
+pub fn tokenListContains(l: *TokenList, token: []const u8) !bool {
+    var res: bool = undefined;
+    const err = c.dom_tokenlist_contains(l, try strFromData(token), &res);
+    try DOMErr(err);
+    return res;
+}
+
+pub fn tokenListAdd(l: *TokenList, token: []const u8) !void {
+    const err = c.dom_tokenlist_add(l, try strFromData(token));
+    try DOMErr(err);
+}
+
+pub fn tokenListRemove(l: *TokenList, token: []const u8) !void {
+    const err = c.dom_tokenlist_remove(l, try strFromData(token));
+    try DOMErr(err);
+}
+
+pub fn tokenListGetValue(l: *TokenList) !?[]const u8 {
+    var res: ?*String = undefined;
+    const err = c.dom_tokenlist_get_value(l, &res);
+    try DOMErr(err);
+    if (res == null) return null;
+    return strToData(res.?);
+}
+
 // ElementHTML
 pub const ElementHTML = c.dom_html_element;
 
diff --git a/src/run_tests.zig b/src/run_tests.zig
index 58520055..681e96c0 100644
--- a/src/run_tests.zig
+++ b/src/run_tests.zig
@@ -16,6 +16,7 @@ const HTMLCollectionTestExecFn = @import("dom/html_collection.zig").testExecFn;
 const DOMExceptionTestExecFn = @import("dom/exceptions.zig").testExecFn;
 const DOMImplementationExecFn = @import("dom/implementation.zig").testExecFn;
 const NamedNodeMapExecFn = @import("dom/namednodemap.zig").testExecFn;
+const DOMTokenListExecFn = @import("dom/token_list.zig").testExecFn;
 
 var doc: *parser.DocumentHTML = undefined;
 
@@ -63,6 +64,7 @@ fn testsAllExecFn(
         DOMExceptionTestExecFn,
         DOMImplementationExecFn,
         NamedNodeMapExecFn,
+        DOMTokenListExecFn,
     };
 
     inline for (testFns) |testFn| {
diff --git a/tests/wpt/dom/nodes/Element-classlist.html b/tests/wpt/dom/nodes/Element-classlist.html
new file mode 100644
index 00000000..2b5a271b
--- /dev/null
+++ b/tests/wpt/dom/nodes/Element-classlist.html
@@ -0,0 +1,478 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>Test for the classList element attribute</title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<div id="content"></div>
+<script>
+const SVG_NS = "http://www.w3.org/2000/svg";
+const XHTML_NS = "http://www.w3.org/1999/xhtml"
+const MATHML_NS = "http://www.w3.org/1998/Math/MathML";
+
+function setClass(e, newVal) {
+  if (newVal === null) {
+    e.removeAttribute("class");
+  } else {
+    e.setAttribute("class", newVal);
+  }
+}
+
+function checkModification(e, funcName, args, expectedRes, before, after,
+                           expectedException, desc) {
+  if (!Array.isArray(args)) {
+    args = [args];
+  }
+
+  test(function() {
+    var shouldThrow = typeof(expectedException) === "string";
+    if (shouldThrow) {
+      // If an exception is thrown, the class attribute shouldn't change.
+      after = before;
+    }
+    setClass(e, before);
+
+    var obs;
+    // If we have MutationObservers available,  do some checks to make
+    // sure attribute sets are happening at sane times.
+    if (self.MutationObserver) {
+      obs = new MutationObserver(() => {});
+      obs.observe(e, { attributes: true });
+    }
+    if (shouldThrow) {
+      assert_throws_dom(expectedException, function() {
+        var list = e.classList;
+        var res = list[funcName].apply(list, args);
+      });
+    } else {
+      var list = e.classList;
+      var res = list[funcName].apply(list, args);
+    }
+    if (obs) {
+      var mutationRecords = obs.takeRecords();
+      obs.disconnect();
+      if (shouldThrow) {
+        assert_equals(mutationRecords.length, 0,
+                      "There should have been no mutation");
+      } else if (funcName == "replace") {
+        assert_equals(mutationRecords.length == 1,
+                      expectedRes,
+                      "Should have a mutation exactly when replace() returns true");
+      } else {
+        // For other functions, would need to check when exactly
+        // mutations are supposed to happen.
+      }
+    }
+    if (!shouldThrow) {
+      assert_equals(res, expectedRes, "wrong return value");
+    }
+
+    var expectedAfter = after;
+
+    assert_equals(e.getAttribute("class"), expectedAfter,
+                  "wrong class after modification");
+  }, "classList." + funcName + "(" + args.map(format_value).join(", ") +
+  ") with attribute value " + format_value(before) + desc);
+}
+
+function assignToClassListStrict(e) {
+  "use strict";
+  e.classList = "foo";
+  e.removeAttribute("class");
+}
+
+function assignToClassList(e) {
+  var expect = e.classList;
+  e.classList = "foo";
+  assert_equals(e.classList, expect,
+                "classList should be unchanged after assignment");
+  e.removeAttribute("class");
+}
+
+function testClassList(e, desc) {
+
+  // assignment
+
+  test(function() {
+    assignToClassListStrict(e);
+    assignToClassList(e);
+  }, "Assigning to classList" + desc);
+
+  // supports
+  test(function() {
+    assert_throws_js(TypeError, function() {
+      e.classList.supports("a");
+    })
+  }, ".supports() must throw TypeError" + desc);
+
+  // length attribute
+
+  function checkLength(value, length) {
+    test(function() {
+      setClass(e, value);
+      assert_equals(e.classList.length, length);
+    }, "classList.length when " +
+    (value === null ? "removed" : "set to " + format_value(value)) + desc);
+  }
+
+  checkLength(null, 0);
+  checkLength("", 0);
+  checkLength("   \t  \f", 0);
+  checkLength("a", 1);
+  checkLength("a A", 2);
+  checkLength("\r\na\t\f", 1);
+  checkLength("a a", 1);
+  checkLength("a a a a a a", 1);
+  checkLength("a a b b", 2);
+  checkLength("a A B b", 4);
+  checkLength("a b c c b a a b c c", 3);
+  checkLength("   a  a b", 2);
+  checkLength("a\tb\nc\fd\re f", 6);
+
+  // [Stringifies]
+
+  function checkStringifier(value, expected) {
+    test(function() {
+      setClass(e, value);
+      assert_equals(e.classList.toString(), expected);
+    }, "classList.toString() when " +
+    (value === null ? "removed" : "set to " + format_value(value)) + desc);
+  }
+
+  checkStringifier(null, "");
+  checkStringifier("foo", "foo");
+  checkStringifier("   a  a b", "   a  a b");
+
+  // item() method
+
+  function checkItems(attributeValue, expectedValues) {
+    function checkItemFunction(index, expected) {
+      assert_equals(e.classList.item(index), expected,
+                    "classList.item(" + index + ")");
+    }
+
+    function checkItemArray(index, expected) {
+      assert_equals(e.classList[index], expected, "classList[" + index + "]");
+    }
+
+    test(function() {
+      setClass(e, attributeValue);
+
+      checkItemFunction(-1, null);
+      checkItemArray(-1, undefined);
+
+      var i = 0;
+      while (i < expectedValues.length) {
+        checkItemFunction(i, expectedValues[i]);
+        checkItemArray(i, expectedValues[i]);
+        i++;
+      }
+
+      checkItemFunction(i, null);
+      checkItemArray(i, undefined);
+
+      checkItemFunction(0xffffffff, null);
+      checkItemArray(0xffffffff, undefined);
+
+      checkItemFunction(0xfffffffe, null);
+      checkItemArray(0xfffffffe, undefined);
+    }, "classList.item() when set to " + format_value(attributeValue) + desc);
+  }
+
+  checkItems(null, []);
+  checkItems("a", ["a"]);
+  checkItems("aa AA aa", ["aa", "AA"]);
+  checkItems("a b", ["a", "b"]);
+  checkItems("   a  a b", ["a", "b"]);
+  checkItems("\t\n\f\r a\t\n\f\r b\t\n\f\r ", ["a", "b"]);
+
+  // contains() method
+
+  function checkContains(attributeValue, args, expectedRes) {
+    if (!Array.isArray(expectedRes)) {
+      expectedRes = Array(args.length).fill(expectedRes);
+    }
+    setClass(e, attributeValue);
+    for (var i = 0; i < args.length; i++) {
+      test(function() {
+        assert_equals(e.classList.contains(args[i]), expectedRes[i],
+                      "classList.contains(\"" + args[i] + "\")");
+      }, "classList.contains(" + format_value(args[i]) + ") when set to " +
+      format_value(attributeValue) + desc);
+    }
+  }
+
+  checkContains(null, ["a", "", "  "], false);
+  checkContains("", ["a"], false);
+
+  checkContains("a", ["a"], true);
+  checkContains("a", ["aa", "b", "A", "a.", "a)",, "a'", 'a"', "a$", "a~",
+                      "a?", "a\\"], false);
+
+  // All "ASCII whitespace" per spec, before and after
+  checkContains("a", ["a\t", "\ta", "a\n", "\na", "a\f", "\fa", "a\r", "\ra",
+                      "a ", " a"], false);
+
+  checkContains("aa AA", ["aa", "AA", "aA"], [true, true, false]);
+  checkContains("a a a", ["a", "aa", "b"], [true, false, false]);
+  checkContains("a b c", ["a", "b"], true);
+
+  checkContains("null undefined", [null, undefined], true);
+  checkContains("\t\n\f\r a\t\n\f\r b\t\n\f\r ", ["a", "b"], true);
+
+  // add() method
+
+  function checkAdd(before, argument, after, param) {
+    var expectedException = undefined;
+    var noop = false;
+    if (param == "noop") {
+      noop = true;
+    } else {
+      expectedException = param;
+    }
+    checkModification(e, "add", argument, undefined, before, after,
+                      expectedException, desc);
+    // Also check force toggle.  The only difference is that it doesn't run the
+    // update steps for a no-op.
+    if (!Array.isArray(argument)) {
+      checkModification(e, "toggle", [argument, true], true, before,
+                        noop ? before : after, expectedException, desc);
+    }
+  }
+
+  checkAdd(null, "", null, "SyntaxError");
+  checkAdd(null, ["a", ""], null, "SyntaxError");
+  checkAdd(null, " ", null, "InvalidCharacterError");
+  checkAdd(null, "\ta", null, "InvalidCharacterError");
+  checkAdd(null, "a\t", null, "InvalidCharacterError");
+  checkAdd(null, "\na", null, "InvalidCharacterError");
+  checkAdd(null, "a\n", null, "InvalidCharacterError");
+  checkAdd(null, "\fa", null, "InvalidCharacterError");
+  checkAdd(null, "a\f", null, "InvalidCharacterError");
+  checkAdd(null, "\ra", null, "InvalidCharacterError");
+  checkAdd(null, "a\r", null, "InvalidCharacterError");
+  checkAdd(null, " a", null, "InvalidCharacterError");
+  checkAdd(null, "a ", null, "InvalidCharacterError");
+  checkAdd(null, ["a", " "], null, "InvalidCharacterError");
+  checkAdd(null, ["a", "aa "], null, "InvalidCharacterError");
+
+  checkAdd("a", "a", "a");
+  checkAdd("aa", "AA", "aa AA");
+  checkAdd("a b c", "a", "a b c");
+  checkAdd("a a a  b", "a", "a b", "noop");
+  checkAdd(null, "a", "a");
+  checkAdd("", "a", "a");
+  checkAdd(" ", "a", "a");
+  checkAdd("   \f", "a", "a");
+  checkAdd("a", "b", "a b");
+  checkAdd("a b c", "d", "a b c d");
+  checkAdd("a b c ", "d", "a b c d");
+  checkAdd("   a  a b", "c", "a b c");
+  checkAdd("   a  a b", "a", "a b", "noop");
+  checkAdd("\t\n\f\r a\t\n\f\r b\t\n\f\r ", "c", "a b c");
+
+  // multiple add
+  checkAdd("a b c ", ["d", "e"], "a b c d e");
+  checkAdd("a b c ", ["a", "a"], "a b c");
+  checkAdd("a b c ", ["d", "d"], "a b c d");
+  checkAdd("a b c a ", [], "a b c");
+  checkAdd(null, ["a", "b"], "a b");
+  checkAdd("", ["a", "b"], "a b");
+
+  checkAdd(null, null, "null");
+  checkAdd(null, undefined, "undefined");
+
+  // remove() method
+
+  function checkRemove(before, argument, after, param) {
+    var expectedException = undefined;
+    var noop = false;
+    if (param == "noop") {
+      noop = true;
+    } else {
+      expectedException = param;
+    }
+    checkModification(e, "remove", argument, undefined, before, after,
+                      expectedException, desc);
+    // Also check force toggle.  The only difference is that it doesn't run the
+    // update steps for a no-op.
+    if (!Array.isArray(argument)) {
+      checkModification(e, "toggle", [argument, false], false, before,
+                        noop ? before : after, expectedException, desc);
+    }
+  }
+
+  checkRemove(null, "", null, "SyntaxError");
+  checkRemove(null, " ", null, "InvalidCharacterError");
+  checkRemove("\ta", "\ta", "\ta", "InvalidCharacterError");
+  checkRemove("a\t", "a\t", "a\t", "InvalidCharacterError");
+  checkRemove("\na", "\na", "\na", "InvalidCharacterError");
+  checkRemove("a\n", "a\n", "a\n", "InvalidCharacterError");
+  checkRemove("\fa", "\fa", "\fa", "InvalidCharacterError");
+  checkRemove("a\f", "a\f", "a\f", "InvalidCharacterError");
+  checkRemove("\ra", "\ra", "\ra", "InvalidCharacterError");
+  checkRemove("a\r", "a\r", "a\r", "InvalidCharacterError");
+  checkRemove(" a", " a", " a", "InvalidCharacterError");
+  checkRemove("a ", "a ", "a ", "InvalidCharacterError");
+  checkRemove("aa ", "aa ", null, "InvalidCharacterError");
+
+  checkRemove(null, "a", null);
+  checkRemove("", "a", "");
+  checkRemove("a b  c", "d", "a b c", "noop");
+  checkRemove("a b  c", "A", "a b c", "noop");
+  checkRemove(" a a a ", "a", "");
+  checkRemove("a  b", "a", "b");
+  checkRemove("a  b  ", "a", "b");
+  checkRemove("a a b", "a", "b");
+  checkRemove("aa aa bb", "aa", "bb");
+  checkRemove("a a b a a c a a", "a", "b c");
+
+  checkRemove("a  b  c", "b", "a c");
+  checkRemove("aaa  bbb  ccc", "bbb", "aaa ccc");
+  checkRemove(" a  b  c ", "b", "a c");
+  checkRemove("a b b b c", "b", "a c");
+
+  checkRemove("a  b  c", "c", "a b");
+  checkRemove(" a  b  c ", "c", "a b");
+  checkRemove("a b c c c", "c", "a b");
+
+  checkRemove("a b a c a d a", "a", "b c d");
+  checkRemove("AA BB aa CC AA dd aa", "AA", "BB aa CC dd");
+
+  checkRemove("\ra\na\ta\f", "a", "");
+  checkRemove("\t\n\f\r a\t\n\f\r b\t\n\f\r ", "a", "b");
+
+  // multiple remove
+  checkRemove("a b c ", ["d", "e"], "a b c");
+  checkRemove("a b c ", ["a", "b"], "c");
+  checkRemove("a b c ", ["a", "c"], "b");
+  checkRemove("a b c ", ["a", "a"], "b c");
+  checkRemove("a b c ", ["d", "d"], "a b c");
+  checkRemove("a b c ", [], "a b c");
+  checkRemove(null, ["a", "b"], null);
+  checkRemove("", ["a", "b"], "");
+  checkRemove("a a", [], "a");
+
+  checkRemove("null", null, "");
+  checkRemove("undefined", undefined, "");
+
+  // toggle() method
+
+  function checkToggle(before, argument, expectedRes, after, expectedException) {
+    checkModification(e, "toggle", argument, expectedRes, before, after,
+                      expectedException, desc);
+  }
+
+  checkToggle(null, "", null, null, "SyntaxError");
+  checkToggle(null, "aa ", null, null, "InvalidCharacterError");
+
+  checkToggle(null, "a", true, "a");
+  checkToggle("", "a", true, "a");
+  checkToggle(" ", "a", true, "a");
+  checkToggle("   \f", "a", true, "a");
+  checkToggle("a", "b", true, "a b");
+  checkToggle("a", "A", true, "a A");
+  checkToggle("a b c", "d", true, "a b c d");
+  checkToggle("   a  a b", "d", true, "a b d");
+
+  checkToggle("a", "a", false, "");
+  checkToggle(" a a a ", "a", false, "");
+  checkToggle(" A A A ", "a", true, "A a");
+  checkToggle(" a b c ", "b", false, "a c");
+  checkToggle(" a b c b b", "b", false, "a c");
+  checkToggle(" a b  c  ", "c", false, "a b");
+  checkToggle(" a b c ", "a", false, "b c");
+  checkToggle("   a  a b", "b", false, "a");
+  checkToggle("\t\n\f\r a\t\n\f\r b\t\n\f\r ", "a", false, "b");
+  checkToggle("\t\n\f\r a\t\n\f\r b\t\n\f\r ", "c", true, "a b c");
+
+  checkToggle("null", null, false, "");
+  checkToggle("", null, true, "null");
+  checkToggle("undefined", undefined, false, "");
+  checkToggle("", undefined, true, "undefined");
+
+
+  // replace() method
+  function checkReplace(before, token, newToken, expectedRes, after, expectedException) {
+    checkModification(e, "replace", [token, newToken], expectedRes, before,
+                      after, expectedException, desc);
+  }
+
+  checkReplace(null, "", "a", null, null, "SyntaxError");
+  checkReplace(null, "", " ", null, null, "SyntaxError");
+  checkReplace(null, " ", "a", null, null, "InvalidCharacterError");
+  checkReplace(null, "\ta", "b", null, null, "InvalidCharacterError");
+  checkReplace(null, "a\t", "b", null, null, "InvalidCharacterError");
+  checkReplace(null, "\na", "b", null, null, "InvalidCharacterError");
+  checkReplace(null, "a\n", "b", null, null, "InvalidCharacterError");
+  checkReplace(null, "\fa", "b", null, null, "InvalidCharacterError");
+  checkReplace(null, "a\f", "b", null, null, "InvalidCharacterError");
+  checkReplace(null, "\ra", "b", null, null, "InvalidCharacterError");
+  checkReplace(null, "a\r", "b", null, null, "InvalidCharacterError");
+  checkReplace(null, " a", "b", null, null, "InvalidCharacterError");
+  checkReplace(null, "a ", "b", null, null, "InvalidCharacterError");
+
+  checkReplace(null, "a", "", null, null, "SyntaxError");
+  checkReplace(null, " ", "", null, null, "SyntaxError");
+  checkReplace(null, "a", " ", null, null, "InvalidCharacterError");
+  checkReplace(null, "b", "\ta", null, null, "InvalidCharacterError");
+  checkReplace(null, "b", "a\t", null, null, "InvalidCharacterError");
+  checkReplace(null, "b", "\na", null, null, "InvalidCharacterError");
+  checkReplace(null, "b", "a\n", null, null, "InvalidCharacterError");
+  checkReplace(null, "b", "\fa", null, null, "InvalidCharacterError");
+  checkReplace(null, "b", "a\f", null, null, "InvalidCharacterError");
+  checkReplace(null, "b", "\ra", null, null, "InvalidCharacterError");
+  checkReplace(null, "b", "a\r", null, null, "InvalidCharacterError");
+  checkReplace(null, "b", " a", null, null, "InvalidCharacterError");
+  checkReplace(null, "b", "a ", null, null, "InvalidCharacterError");
+
+  checkReplace("a", "a", "a", true, "a");
+  checkReplace("a", "a", "b", true, "b");
+  checkReplace("a", "A", "b", false, "a");
+  checkReplace("a b", "b", "A", true, "a A");
+  checkReplace("a b", "c", "a", false, "a b");
+  checkReplace("a b c", "d", "e", false, "a b c");
+  // https://github.com/whatwg/dom/issues/443
+  checkReplace("a a a  b", "a", "a", true, "a b");
+  checkReplace("a a a  b", "c", "d", false, "a a a  b");
+  checkReplace(null, "a", "b", false, null);
+  checkReplace("", "a", "b", false, "");
+  checkReplace(" ", "a", "b", false, " ");
+  checkReplace(" a  \f", "a", "b", true, "b");
+  checkReplace("a b c", "b", "d", true, "a d c");
+  checkReplace("a b c", "c", "a", true, "a b");
+  checkReplace("c b a", "c", "a", true, "a b");
+  checkReplace("a b a", "a", "c", true, "c b");
+  checkReplace("a b a", "b", "c", true, "a c");
+  checkReplace("   a  a b", "a", "c", true, "c b");
+  checkReplace("   a  a b", "b", "c", true, "a c");
+  checkReplace("\t\n\f\r a\t\n\f\r b\t\n\f\r ", "a", "c", true, "c b");
+  checkReplace("\t\n\f\r a\t\n\f\r b\t\n\f\r ", "b", "c", true, "a c");
+
+  checkReplace("a null", null, "b", true, "a b");
+  checkReplace("a b", "a", null, true, "null b");
+  checkReplace("a undefined", undefined, "b", true, "a b");
+  checkReplace("a b", "a", undefined, true, "undefined b");
+}
+
+var content = document.getElementById("content");
+
+var htmlNode = document.createElement("div");
+content.appendChild(htmlNode);
+testClassList(htmlNode, " (HTML node)");
+
+var xhtmlNode = document.createElementNS(XHTML_NS, "div");
+content.appendChild(xhtmlNode);
+testClassList(xhtmlNode, " (XHTML node)");
+
+var mathMLNode = document.createElementNS(MATHML_NS, "math");
+content.appendChild(mathMLNode);
+testClassList(mathMLNode, " (MathML node)");
+
+var xmlNode = document.createElementNS(null, "foo");
+content.appendChild(xmlNode);
+testClassList(xmlNode, " (XML node with null namespace)");
+
+var fooNode = document.createElementNS("http://example.org/foo", "foo");
+content.appendChild(fooNode);
+testClassList(fooNode, " (foo node)");
+</script>

From dde13c42cf3ecf159affb940fb9545752731e582 Mon Sep 17 00:00:00 2001
From: Pierre Tachoire <pierre@lightpanda.io>
Date: Tue, 12 Dec 2023 16:41:38 +0100
Subject: [PATCH 6/6] dom: use DOMError.InvalidCharacter

---
 src/dom/token_list.zig | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/dom/token_list.zig b/src/dom/token_list.zig
index 42e1c73a..4dae7b67 100644
--- a/src/dom/token_list.zig
+++ b/src/dom/token_list.zig
@@ -49,7 +49,7 @@ pub const DOMTokenList = struct {
             return parser.DOMError.Syntax;
         }
         for (token) |c| {
-            if (std.ascii.isWhitespace(c)) return error.InvalidCharacter;
+            if (std.ascii.isWhitespace(c)) return parser.DOMError.InvalidCharacter;
         }
     }