M example/assets/js/components/SettingsView.js → example/assets/js/components/SettingsView.js

@@ -6,17 +6,14 @@ const value = document.getElementById("options-logging").checked;
     h3.dispatch("settings/set", { logging: value });
     h3.dispatch("app/save");
   };
-  const attrs = {
-    type: "checkbox",
-    onclick: toggleLogging,
-  };
-  if (h3.state.settings.logging) {
-    attrs.checked = true;
-  }
   return h3("div.settings.container", [
     h3("h1", "Settings"),
     h3("div.options", [
-      h3("input#options-logging", attrs),
+      h3("input#options-logging", {
+        type: "checkbox",
+        onclick: toggleLogging,
+        checked: h3.state.settings.logging,
+      }),
       h3(
         "label#options-logging-label",
         {
@@ -31,6 +28,6 @@ {
         onclick: () => h3.navigateTo("/"),
       },
       "← Go Back"
-    )
+    ),
   ]);
 }

M h3.js → h3.js

@@ -160,10 +160,12 @@ node.addEventListener(event, this.attributes[attr]);
       } else if (attr === "value") {
         node.value = this.attributes[attr];
       } else {
-        // Standard attributes
-        const a = document.createAttribute(attr);
-        a.value = this.attributes[attr];
-        node.setAttributeNode(a);
+        // Standard attributes (unless falsy)
+        if (this.attributes[attr]) {
+          const a = document.createAttribute(attr);
+          a.value = this.attributes[attr];
+          node.setAttributeNode(a);
+        }
       }
     });
     // Style
@@ -246,12 +248,12 @@ if (!equal(oldvnode.attributes, newvnode.attributes)) {
       Object.keys(oldvnode.attributes).forEach((a) => {
         if (!newvnode.attributes[a]) {
           node.removeAttribute(a);
-        } else if (newvnode.attributes[a] !== oldvnode.attributes[a]) {
+        } else if (newvnode.attributes[a] && newvnode.attributes[a] !== oldvnode.attributes[a]) {
           node.setAttribute(a, newvnode.attributes[a]);
         }
       });
       Object.keys(newvnode.attributes).forEach((a) => {
-        if (!oldvnode.attributes[a]) {
+        if (!oldvnode.attributes[a] && newvnode.attributes[a]) {
           node.setAttribute(a, newvnode.attributes[a]);
         }
       });