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

@@ -11,7 +11,7 @@ return;
     }
     h3.dispatch("error/clear");
     h3.dispatch("todos/add", {
-      key: `todo_${Date.now()}__${newTodo.value}`, // Make todos "unique-enough" to ensure they are processed correctly
+      key: `todo_${Date.now()}__${btoa(newTodo.value)}`, // Make todos "unique-enough" to ensure they are processed correctly
       text: newTodo.value,
     });
     newTodo.value = "";

M example/assets/js/modules.js → example/assets/js/modules.js

@@ -30,7 +30,7 @@ store.on("$init", () => ({ todos: [], filteredTodos: [], filter: "" }));
   store.on("todos/add", (state, data) => {
     let todos = state.todos;
     todos.unshift({
-      key: `todo_${Date.now()}__${data.text}`, // Make todos "unique-enough" to ensure they are processed correctly
+      key: data.key, // Make todos "unique-enough" to ensure they are processed correctly
       text: data.text,
     });
     return { todos };

M h3.js → h3.js

@@ -102,7 +102,10 @@ } else {
         this.attributes = args[1] || {};
         this.children = typeof args[2] === "string" ? [args[2]] : args[2] || [];
       }
-      const selectorRegex = /^([a-z0-9:_-]+)(#[a-z0-9:_-]+)?(\..+)?$/i;
+      const selectorRegex = /^([a-z0-9:_=-]+)(#[a-z0-9:_=-]+)?(\..+)?$/i;
+      if (!elSelector.match(selectorRegex)) {
+        throw new Error(`[VNode] Invalid selector: ${elSelector}`);
+      }
       const [, element, id, classes] = elSelector.match(selectorRegex);
       this.element = element;
       this.id = id && id.slice(1);
@@ -423,7 +426,6 @@ };
 
 let store = null;
 let router = null;
-let updateFn = null;
 
 h3.init = ({ element, routes, modules, onInit }) => {
   if (!(element instanceof Element)) {