Add async abilities to onBeforeTagRemove

fix #59
okcoker · Aug 2, 2016 · 55b0345 · 55b0345
1 parent 851e645
commit 55b0345
Show file tree

Hide file tree

Showing 2 changed files with 75 additions and 10 deletions.
diff --git a/src/taggle.js b/src/taggle.js
@@ -14,6 +14,9 @@
     /////////////////////
 
     var noop = function() {};
+    var retTrue = function() {
+        return true;
+    };
 
     var DEFAULTS = {
         /**
@@ -146,7 +149,7 @@
          * to prevent tag from being removed
          * @param  {String} tag The tag to be removed
          */
-        onBeforeTagRemove: noop,
+        onBeforeTagRemove: retTrue,
 
         /**
          * Function hook called when a tag is removed
@@ -713,6 +716,7 @@
      * @param  {Event} e
      */
     Taggle.prototype._remove = function(li, e) {
+        var self = this;
         var text;
         var elem;
         var index;
@@ -726,19 +730,29 @@
 
         text = this.tag.values[index];
 
-        if (this.settings.onBeforeTagRemove(e, text) === false) {
-            return;
-        }
+        function done(error) {
+            if (error) {
+                return;
+            }
 
-        li.parentNode.removeChild(li);
+            li.parentNode.removeChild(li);
 
-        // Going to assume the indicies match for now
-        this.tag.elements.splice(index, 1);
-        this.tag.values.splice(index, 1);
+            // Going to assume the indicies match for now
+            self.tag.elements.splice(index, 1);
+            self.tag.values.splice(index, 1);
 
-        this.settings.onTagRemove(e, text);
+            self.settings.onTagRemove(e, text);
+
+            self._focusInput();
+        }
+
+        var ret = this.settings.onBeforeTagRemove(e, text, done);
+
+        if (!ret) {
+            return;
+        }
 
-        this._focusInput();
+        done();
     };
 
     /**

diff --git a/test/taggle-test.js b/test/taggle-test.js
@@ -354,6 +354,57 @@ describe('Taggle', function() {
                 container.parentNode.removeChild(container);
             });
 
+            it('should be async and remove the tag if using the callback with no truthy value', function(done) {
+                var container = createContainer(300, 400);
+                var tag = 'tag';
+                var tags = ['some', 'tags', tag];
+                var length = tags.length;
+
+                document.body.appendChild(container);
+
+                var taggle = new Taggle(container, {
+                    tags: tags,
+                    onBeforeTagRemove: function(e, text, callback) {
+                        setTimeout(function() {
+                            callback();
+
+                            expect(taggle.getTagValues().length).to.eq(length - 1);
+
+                            container.parentNode.removeChild(container);
+                            done();
+                        }, 200);
+                    }
+                });
+
+                taggle.remove(tag);
+            });
+
+            it('should be async and not remove the tag if using the callback a truthy value', function(done) {
+                var container = createContainer(300, 400);
+                var tag = 'tag';
+                var tags = ['some', 'tags', tag];
+                var length = tags.length;
+
+                document.body.appendChild(container);
+
+                var taggle = new Taggle(container, {
+                    tags: tags,
+                    onBeforeTagRemove: function(e, text, callback) {
+                        setTimeout(function() {
+                            var error = 'someTruthyValue';
+                            callback(error);
+
+                            expect(taggle.getTagValues().length).to.eq(length);
+
+                            container.parentNode.removeChild(container);
+                            done();
+                        }, 200);
+                    }
+                });
+
+                taggle.remove(tag);
+            });
+
             it('should remove the tag if the function returns something other than false', function() {
                 var container = createContainer(300, 400);
                 var tag = 'tag';