feat(core dom): Add "delete_data" to remove a previously set variable on a DOM element.

Author: thet

src/core/dom.js

@@ -279,6 +279,18 @@ const set_data = (el, name, value) => {
     el[`${DATA_PREFIX}${name}`] = value;
 };
 
+/**
+ * Delete a variable from the node instance.
+ * We are using a prefix to make sure the data doesn't collide with other attributes.
+ *
+ * @param el {Node} - The DOM node which we want to delete the variable from.
+ * @param name {String} - The name of the variable. Note - this is stored on
+ *                        the DOM node prefixed with the DATA_PREFIX.
+ */
+const delete_data = (el, name) => {
+    delete el[`${DATA_PREFIX}${name}`];
+};
+
 /**
  * Simple template engine, based on JS template literal
  *
@@ -315,6 +327,7 @@ const dom = {
     find_scroll_container: find_scroll_container,
     get_data: get_data,
     set_data: set_data,
+    delete_data: delete_data,
     template: template,
     add_event_listener: events.add_event_listener, // BBB export. TODO: Remove in an upcoming version.
     remove_event_listener: events.remove_event_listener, // BBB export. TODO: Remove in an upcoming version.

src/core/dom.test.js

@@ -696,7 +696,7 @@ describe("core.dom tests", () => {
         });
     });
 
-    describe("set_data, get_data", function () {
+    describe("set_data, get_data, delete_data", function () {
         it("can be used to store and retrieve data on DOM nodes.", function () {
             const el = document.createElement("div");
             dom.set_data(el, "test_data", "hello.");
@@ -715,6 +715,13 @@ describe("core.dom tests", () => {
             expect(dom.get_data(el, "test_data", null)).toBe(null);
             expect(dom.get_data(el, "test_data")).toBe(undefined);
         });
+        it("can also delete the data from dom nodes.", function () {
+            const el = document.createElement("div");
+            dom.set_data(el, "test_data", "hello.");
+            expect(dom.get_data(el, "test_data")).toBe("hello.");
+            dom.delete_data(el, "test_data");
+            expect(dom.get_data(el, "test_data")).toBe(undefined);
+        });
     });
 
     describe("template", () => {