From 1bcedead560769e33056ba76c778388023e4bda5 Mon Sep 17 00:00:00 2001 From: Pierre Tachoire Date: Fri, 1 Dec 2023 14:43:06 +0100 Subject: [PATCH 1/2] dom: implement document.createDocumentFragment --- src/dom/document.zig | 10 +++ src/dom/document_fragment.zig | 21 +++++++ src/dom/node.zig | 3 + src/netsurf.zig | 10 +++ .../nodes/DocumentFragment-constructor.html | 22 +++++++ .../DocumentFragment-getElementById.html | 62 +++++++++++++++++++ ...t-querySelectorAll-after-modification.html | 24 +++++++ 7 files changed, 152 insertions(+) create mode 100644 src/dom/document_fragment.zig create mode 100644 tests/wpt/dom/nodes/DocumentFragment-constructor.html create mode 100644 tests/wpt/dom/nodes/DocumentFragment-getElementById.html create mode 100644 tests/wpt/dom/nodes/DocumentFragment-querySelectorAll-after-modification.html diff --git a/src/dom/document.zig b/src/dom/document.zig index cb07715c..adf34d35 100644 --- a/src/dom/document.zig +++ b/src/dom/document.zig @@ -14,6 +14,7 @@ const Element = @import("element.zig").Element; const ElementUnion = @import("element.zig").Union; const DocumentType = @import("document_type.zig").DocumentType; +const DocumentFragment = @import("document_fragment.zig").DocumentFragment; const DOMImplementation = @import("implementation.zig").DOMImplementation; // WEB IDL https://dom.spec.whatwg.org/#document @@ -124,6 +125,10 @@ pub const Document = struct { ); } + pub fn _createDocumentFragment(self: *parser.Document) !*parser.DocumentFragment { + return try parser.documentCreateDocumentFragment(self); + } + pub fn deinit(_: *parser.Document, _: std.mem.Allocator) void {} }; @@ -216,6 +221,11 @@ pub fn testExecFn( }; try checkCases(js_env, &new); + var createDocumentFragment = [_]Case{ + .{ .src = "document.createDocumentFragment()", .ex = "[object DocumentFragment]" }, + }; + try checkCases(js_env, &createDocumentFragment); + const tags = comptime parser.Tag.all(); comptime var createElements: [(tags.len) * 2]Case = undefined; inline for (tags, 0..) |tag, i| { diff --git a/src/dom/document_fragment.zig b/src/dom/document_fragment.zig new file mode 100644 index 00000000..dea6ade1 --- /dev/null +++ b/src/dom/document_fragment.zig @@ -0,0 +1,21 @@ +const std = @import("std"); + +const parser = @import("../netsurf.zig"); + +const Node = @import("node.zig").Node; + +// WEB IDL https://dom.spec.whatwg.org/#documentfragment +pub const DocumentFragment = struct { + pub const Self = parser.DocumentFragment; + pub const prototype = *Node; + pub const mem_guarantied = true; + + // TODO add constructor, but I need to associate the new DocumentFragment + // with the current document global object... + // > The new DocumentFragment() constructor steps are to set this’s node + // > document to current global object’s associated Document. + // https://dom.spec.whatwg.org/#dom-documentfragment-documentfragment + pub fn constructor() !*parser.DocumentFragment { + return error.NotImplemented; + } +}; diff --git a/src/dom/node.zig b/src/dom/node.zig index 4f5c1672..022aa9c7 100644 --- a/src/dom/node.zig +++ b/src/dom/node.zig @@ -16,6 +16,7 @@ const CData = @import("character_data.zig"); const Element = @import("element.zig").Element; const Document = @import("document.zig").Document; const DocumentType = @import("document_type.zig").DocumentType; +const DocumentFragment = @import("document_fragment.zig").DocumentFragment; const HTMLCollection = @import("html_collection.zig").HTMLCollection; // HTML @@ -30,6 +31,7 @@ pub const Interfaces = generate.Tuple(.{ Element, Document, DocumentType, + DocumentFragment, HTMLCollection, HTML.Interfaces, @@ -55,6 +57,7 @@ pub const Node = struct { .document => .{ .HTMLDocument = @as(*parser.DocumentHTML, @ptrCast(node)) }, .document_type => .{ .DocumentType = @as(*parser.DocumentType, @ptrCast(node)) }, .attribute => .{ .Attr = @as(*parser.Attribute, @ptrCast(node)) }, + .document_fragment => .{ .DocumentFragment = @as(*parser.DocumentFragment, @ptrCast(node)) }, else => @panic("node type not handled"), // TODO }; } diff --git a/src/netsurf.zig b/src/netsurf.zig index d0fee760..81da35c3 100644 --- a/src/netsurf.zig +++ b/src/netsurf.zig @@ -998,6 +998,9 @@ pub const Track = struct { base: *c.dom_html_element }; pub const UList = c.dom_html_u_list_element; pub const Video = struct { base: *c.dom_html_element }; +// Document Fragment +pub const DocumentFragment = c.dom_document_fragment; + // Document Position pub const DocumentPosition = enum(u2) { @@ -1177,6 +1180,13 @@ pub inline fn documentGetDoctype(doc: *Document) !?*DocumentType { return dt; } +pub inline fn documentCreateDocumentFragment(doc: *Document) !*DocumentFragment { + var df: ?*DocumentFragment = undefined; + const err = documentVtable(doc).dom_document_create_document_fragment.?(doc, &df); + try DOMErr(err); + return df.?; +} + // DocumentHTML pub const DocumentHTML = c.dom_html_document; diff --git a/tests/wpt/dom/nodes/DocumentFragment-constructor.html b/tests/wpt/dom/nodes/DocumentFragment-constructor.html new file mode 100644 index 00000000..e97a7c48 --- /dev/null +++ b/tests/wpt/dom/nodes/DocumentFragment-constructor.html @@ -0,0 +1,22 @@ + + +DocumentFragment constructor + + + + + diff --git a/tests/wpt/dom/nodes/DocumentFragment-getElementById.html b/tests/wpt/dom/nodes/DocumentFragment-getElementById.html new file mode 100644 index 00000000..ce0d302c --- /dev/null +++ b/tests/wpt/dom/nodes/DocumentFragment-getElementById.html @@ -0,0 +1,62 @@ + + +DocumentFragment.prototype.getElementById + + + + + + + + + diff --git a/tests/wpt/dom/nodes/DocumentFragment-querySelectorAll-after-modification.html b/tests/wpt/dom/nodes/DocumentFragment-querySelectorAll-after-modification.html new file mode 100644 index 00000000..80493638 --- /dev/null +++ b/tests/wpt/dom/nodes/DocumentFragment-querySelectorAll-after-modification.html @@ -0,0 +1,24 @@ + + +querySelectorAll should still work on DocumentFragments after they are modified + + + + + From 46c73777d50e86f08fcb57f1719d5ce6b45536ab Mon Sep 17 00:00:00 2001 From: Pierre Tachoire Date: Fri, 1 Dec 2023 14:45:28 +0100 Subject: [PATCH 2/2] wpt: add missing js files --- .../pre-insertion-validation-hierarchy.js | 86 ++++++++++++++ .../pre-insertion-validation-notfound.js | 108 ++++++++++++++++++ 2 files changed, 194 insertions(+) create mode 100644 tests/wpt/dom/nodes/pre-insertion-validation-hierarchy.js create mode 100644 tests/wpt/dom/nodes/pre-insertion-validation-notfound.js diff --git a/tests/wpt/dom/nodes/pre-insertion-validation-hierarchy.js b/tests/wpt/dom/nodes/pre-insertion-validation-hierarchy.js new file mode 100644 index 00000000..6ef2576d --- /dev/null +++ b/tests/wpt/dom/nodes/pre-insertion-validation-hierarchy.js @@ -0,0 +1,86 @@ +/** + * Validations where `child` argument is irrelevant. + * @param {Function} methodName + */ +function preInsertionValidateHierarchy(methodName) { + function insert(parent, node) { + if (parent[methodName].length > 1) { + // This is for insertBefore(). We can't blindly pass `null` for all methods + // as doing so will move nodes before validation. + parent[methodName](node, null); + } else { + parent[methodName](node); + } + } + + // Step 2 + test(() => { + const doc = document.implementation.createHTMLDocument("title"); + assert_throws_dom("HierarchyRequestError", () => insert(doc.body, doc.body)); + assert_throws_dom("HierarchyRequestError", () => insert(doc.body, doc.documentElement)); + }, "If node is a host-including inclusive ancestor of parent, then throw a HierarchyRequestError DOMException."); + + // Step 4 + test(() => { + const doc = document.implementation.createHTMLDocument("title"); + const doc2 = document.implementation.createHTMLDocument("title2"); + assert_throws_dom("HierarchyRequestError", () => insert(doc, doc2)); + }, "If node is not a DocumentFragment, DocumentType, Element, Text, ProcessingInstruction, or Comment node, then throw a HierarchyRequestError DOMException."); + + // Step 5, in case of inserting a text node into a document + test(() => { + const doc = document.implementation.createHTMLDocument("title"); + assert_throws_dom("HierarchyRequestError", () => insert(doc, doc.createTextNode("text"))); + }, "If node is a Text node and parent is a document, then throw a HierarchyRequestError DOMException."); + + // Step 5, in case of inserting a doctype into a non-document + test(() => { + const doc = document.implementation.createHTMLDocument("title"); + const doctype = doc.childNodes[0]; + assert_throws_dom("HierarchyRequestError", () => insert(doc.createElement("a"), doctype)); + }, "If node is a doctype and parent is not a document, then throw a HierarchyRequestError DOMException.") + + // Step 6, in case of DocumentFragment including multiple elements + test(() => { + const doc = document.implementation.createHTMLDocument("title"); + doc.documentElement.remove(); + const df = doc.createDocumentFragment(); + df.appendChild(doc.createElement("a")); + df.appendChild(doc.createElement("b")); + assert_throws_dom("HierarchyRequestError", () => insert(doc, df)); + }, "If node is a DocumentFragment with multiple elements and parent is a document, then throw a HierarchyRequestError DOMException."); + + // Step 6, in case of DocumentFragment has multiple elements when document already has an element + test(() => { + const doc = document.implementation.createHTMLDocument("title"); + const df = doc.createDocumentFragment(); + df.appendChild(doc.createElement("a")); + assert_throws_dom("HierarchyRequestError", () => insert(doc, df)); + }, "If node is a DocumentFragment with an element and parent is a document with another element, then throw a HierarchyRequestError DOMException."); + + // Step 6, in case of an element + test(() => { + const doc = document.implementation.createHTMLDocument("title"); + const el = doc.createElement("a"); + assert_throws_dom("HierarchyRequestError", () => insert(doc, el)); + }, "If node is an Element and parent is a document with another element, then throw a HierarchyRequestError DOMException."); + + // Step 6, in case of a doctype when document already has another doctype + test(() => { + const doc = document.implementation.createHTMLDocument("title"); + const doctype = doc.childNodes[0].cloneNode(); + doc.documentElement.remove(); + assert_throws_dom("HierarchyRequestError", () => insert(doc, doctype)); + }, "If node is a doctype and parent is a document with another doctype, then throw a HierarchyRequestError DOMException."); + + // Step 6, in case of a doctype when document has an element + if (methodName !== "prepend") { + // Skip `.prepend` as this doesn't throw if `child` is an element + test(() => { + const doc = document.implementation.createHTMLDocument("title"); + const doctype = doc.childNodes[0].cloneNode(); + doc.childNodes[0].remove(); + assert_throws_dom("HierarchyRequestError", () => insert(doc, doctype)); + }, "If node is a doctype and parent is a document with an element, then throw a HierarchyRequestError DOMException."); + } +} diff --git a/tests/wpt/dom/nodes/pre-insertion-validation-notfound.js b/tests/wpt/dom/nodes/pre-insertion-validation-notfound.js new file mode 100644 index 00000000..705283fa --- /dev/null +++ b/tests/wpt/dom/nodes/pre-insertion-validation-notfound.js @@ -0,0 +1,108 @@ +function getNonParentNodes() { + return [ + document.implementation.createDocumentType("html", "", ""), + document.createTextNode("text"), + document.implementation.createDocument(null, "foo", null).createProcessingInstruction("foo", "bar"), + document.createComment("comment"), + document.implementation.createDocument(null, "foo", null).createCDATASection("data"), + ]; +} + +function getNonInsertableNodes() { + return [ + document.implementation.createHTMLDocument("title") + ]; +} + +function getNonDocumentParentNodes() { + return [ + document.createElement("div"), + document.createDocumentFragment(), + ]; +} + +// Test that the steps happen in the right order, to the extent that it's +// observable. The variable names "parent", "child", and "node" match the +// corresponding variables in the replaceChild algorithm in these tests. + +// Step 1 happens before step 3. +test(function() { + var illegalParents = getNonParentNodes(); + var child = document.createElement("div"); + var node = document.createElement("div"); + illegalParents.forEach(function (parent) { + assert_throws_dom("HierarchyRequestError", function() { + insertFunc.call(parent, node, child); + }); + }); +}, "Should check the 'parent' type before checking whether 'child' is a child of 'parent'"); + +// Step 2 happens before step 3. +test(function() { + var parent = document.createElement("div"); + var child = document.createElement("div"); + var node = document.createElement("div"); + + node.appendChild(parent); + assert_throws_dom("HierarchyRequestError", function() { + insertFunc.call(parent, node, child); + }); +}, "Should check that 'node' is not an ancestor of 'parent' before checking whether 'child' is a child of 'parent'"); + +// Step 3 happens before step 4. +test(function() { + var parent = document.createElement("div"); + var child = document.createElement("div"); + + var illegalChildren = getNonInsertableNodes(); + illegalChildren.forEach(function (node) { + assert_throws_dom("NotFoundError", function() { + insertFunc.call(parent, node, child); + }); + }); +}, "Should check whether 'child' is a child of 'parent' before checking whether 'node' is of a type that can have a parent."); + + +// Step 3 happens before step 5. +test(function() { + var child = document.createElement("div"); + + var node = document.createTextNode(""); + var parent = document.implementation.createDocument(null, "foo", null); + assert_throws_dom("NotFoundError", function() { + insertFunc.call(parent, node, child); + }); + + node = document.implementation.createDocumentType("html", "", ""); + getNonDocumentParentNodes().forEach(function (parent) { + assert_throws_dom("NotFoundError", function() { + insertFunc.call(parent, node, child); + }); + }); +}, "Should check whether 'child' is a child of 'parent' before checking whether 'node' is of a type that can have a parent of the type that 'parent' is."); + +// Step 3 happens before step 6. +test(function() { + var child = document.createElement("div"); + var parent = document.implementation.createDocument(null, null, null); + + var node = document.createDocumentFragment(); + node.appendChild(document.createElement("div")); + node.appendChild(document.createElement("div")); + assert_throws_dom("NotFoundError", function() { + insertFunc.call(parent, node, child); + }); + + node = document.createElement("div"); + parent.appendChild(document.createElement("div")); + assert_throws_dom("NotFoundError", function() { + insertFunc.call(parent, node, child); + }); + + parent.firstChild.remove(); + parent.appendChild(document.implementation.createDocumentType("html", "", "")); + node = document.implementation.createDocumentType("html", "", "") + assert_throws_dom("NotFoundError", function() { + insertFunc.call(parent, node, child); + }); +}, "Should check whether 'child' is a child of 'parent' before checking whether 'node' can be inserted into the document given the kids the document has right now.");