fix: datasets -> dataset (#1020)

src/tovnode.ts

@@ -11,7 +11,7 @@ export function toVNode(node: Node, domApi?: DOMAPI): VNode {
     const c = cn ? "." + cn.split(" ").join(".") : "";
     const sel = api.tagName(node).toLowerCase() + id + c;
     const attrs: any = {};
-    const datasets: Record<string, string> = {};
+    const dataset: Record<string, string> = {};
     const data: Record<string, any> = {};
 
     const children: VNode[] = [];
@@ -28,7 +28,7 @@ export function toVNode(node: Node, domApi?: DOMAPI): VNode {
         name[3] === "a" &&
         name[4] === "-"
       ) {
-        datasets[name.slice(5)] = elmAttrs[i].nodeValue || "";
+        dataset[name.slice(5)] = elmAttrs[i].nodeValue || "";
       } else if (name !== "id" && name !== "class") {
         attrs[name] = elmAttrs[i].nodeValue;
       }
@@ -38,7 +38,7 @@ export function toVNode(node: Node, domApi?: DOMAPI): VNode {
     }
 
     if (Object.keys(attrs).length > 0) data.attrs = attrs;
-    if (Object.keys(datasets).length > 0) data.datasets = datasets;
+    if (Object.keys(dataset).length > 0) data.dataset = dataset;
 
     if (
       sel[0] === "s" &&

test/unit/core.ts

@@ -549,23 +549,23 @@ describe("snabbdom", function () {
         assert.deepEqual(vnode.data, { attrs: { data: "value" } });
         const children = vnode.children as [VNode, VNode];
         assert.strictEqual(children[0].sel, "x-h2#hx");
-        assert.deepEqual(children[0].data, { datasets: { env: "xyz" } });
+        assert.deepEqual(children[0].data, { dataset: { env: "xyz" } });
         assert.strictEqual(children[1].text, "Foobar");
       });
 
-      it("can parsing datasets and attrs", function () {
+      it("can parsing dataset and attrs", function () {
         const onlyAttrs = document.createElement("div");
         onlyAttrs.setAttribute("foo", "bar");
         assert.deepEqual(toVNode(onlyAttrs).data, { attrs: { foo: "bar" } });
-        const onlyDatasets = document.createElement("div");
-        onlyDatasets.setAttribute("data-foo", "bar");
-        assert.deepEqual(toVNode(onlyDatasets).data, {
-          datasets: { foo: "bar" },
+        const onlyDataset = document.createElement("div");
+        onlyDataset.setAttribute("data-foo", "bar");
+        assert.deepEqual(toVNode(onlyDataset).data, {
+          dataset: { foo: "bar" },
         });
         const onlyDatasets2 = document.createElement("div");
         onlyDatasets2.dataset.foo = "bar";
         assert.deepEqual(toVNode(onlyDatasets2).data, {
-          datasets: { foo: "bar" },
+          dataset: { foo: "bar" },
         });
         const bothAttrsAndDatasets = document.createElement("div");
         bothAttrsAndDatasets.setAttribute("foo", "bar");
@@ -573,7 +573,7 @@ describe("snabbdom", function () {
         bothAttrsAndDatasets.dataset.again = "again";
         assert.deepEqual(toVNode(bothAttrsAndDatasets).data, {
           attrs: { foo: "bar" },
-          datasets: { foo: "bar", again: "again" },
+          dataset: { foo: "bar", again: "again" },
         });
       });
     });

test/unit/dataset.ts

@@ -1,6 +1,6 @@
 import { assert } from "chai";
 
-import { datasetModule, init, h } from "../../src/index";
+import { datasetModule, init, h, toVNode } from "../../src/index";
 
 const patch = init([datasetModule]);
 
@@ -20,6 +20,16 @@ describe("dataset", function () {
     elm = patch(vnode0, h("div", { dataset: { foo: "foo" } })).elm;
     assert.strictEqual(elm.dataset.foo, "foo");
   });
+  it("toVNode & dataset", function () {
+    const elem1 = document.createElement("div");
+    elem1.innerHTML = '<div data-foo="foo"></div>';
+    const elem2 = document.createElement("div");
+    elem2.innerHTML = '<div data-foo="foo-new"></div>';
+    const oldNode = toVNode(elem1);
+    const newNode = toVNode(elem2);
+    patch(oldNode, newNode);
+    assert.strictEqual(elem1.innerHTML, '<div data-foo="foo-new"></div>');
+  });
   it("updates dataset", function () {
     const vnode1 = h("i", { dataset: { foo: "foo", bar: "bar" } });
     const vnode2 = h("i", { dataset: { baz: "baz" } });