Merge pull request #10 from uzairfarooq/dev

Merge dev branch into master

README.md

@@ -2,7 +2,7 @@
 
 arrive.js provides events to watch for DOM elements creation and removal. It makes use of [Mutation Observers](https://developer.mozilla.org/en/docs/Web/API/MutationObserver) internally.
 
-[Download arrive-1.1.2.min.js](https://raw.githubusercontent.com/uzairfarooq/arrive/master/releases/arrive-1.1.2.min.js) (latest)
+[Download arrive-2.0.0.min.js](https://raw.githubusercontent.com/uzairfarooq/arrive/master/releases/arrive-2.0.0.min.js) (latest)
 
 ## Usage
 **The library does not depend on jQuery, you can replace jQuery elements in the examples below with pure javascript elements and it would work fine.**

src/arrive.js

@@ -2,7 +2,7 @@
 
 /*
  * arrive.js
- * v1.1.2
+ * v2.0.0
  * https://github.com/uzairfarooq/arrive
  * MIT licensed
  *
@@ -45,10 +45,11 @@
       this._beforeRemoving  = null;
     };
 
-    EventsBucket.prototype.addEvent = function(target, selector, callback) {
+    EventsBucket.prototype.addEvent = function(target, selector, options, callback) {
       var newEvent = {
         target:             target, 
         selector:           selector, 
+        options:            options, 
         callback:           callback, 
         firedElems:         []
       };
@@ -85,7 +86,7 @@
 
 
   // General class for binding/unbinding arrive and leave events
-  var MutationEvents = function(config, onMutation) {
+  var MutationEvents = function(getObserverConfig, defaultOptions, onMutation) {
     var eventsBucket  = new EventsBucket(), 
         me            = this;
 
@@ -105,6 +106,8 @@
       observer = new MutationObserver(function(e) {
         onMutation.call(this, e, registrationData);
       });
+
+      var config = getObserverConfig(registrationData.options);
 
       observer.observe(target, config);
 
@@ -123,10 +126,15 @@
       return elements;
     }
 
-    this.bindEvent = function(selector, callback) {
+    this.bindEvent = function(selector, options, callback) {
+      if (typeof callback === "undefined") {
+        callback = options;
+        options = defaultOptions;
+      }
+
       var elements = toArray(this);
       for (var i = 0; i < elements.length; i++) {
-        eventsBucket.addEvent(elements[i], selector, callback);
+        eventsBucket.addEvent(elements[i], selector, options, callback);
       }
     };
 
@@ -247,19 +255,37 @@
     });
   }
 
-  // Configuration of observers
-  var arriveConfig = { 
-        attributes: true, 
-        childList: true, 
-        subtree: true
+  function getArriveObserverConfig(options) {
+    var config = { 
+          attributes: false, 
+          childList: true, 
+          subtree: true
+        };
+
+    if (options.fireOnAttributesModification) {
+      config.attributes = true;
+    }
+
+    return config;
+  }
+  function getLeaveObserverConfig(options) {
+    var config = {
+          childList: true, 
+          subtree: true
+        };
+
+    return config;
+  }
+
+
+  // Default options
+  var arriveDefaultOptions = {
+        fireOnAttributesModification: false
       }, 
-      leaveConfig = {
-        childList: true, 
-        subtree: true
-      };
+      leaveDefaultOptions = {};
 
-  var arriveEvents = new MutationEvents(arriveConfig, onArriveMutation), 
-      leaveEvents  = new MutationEvents(leaveConfig, onLeaveMutation);
+  var arriveEvents = new MutationEvents(getArriveObserverConfig, arriveDefaultOptions, onArriveMutation), 
+      leaveEvents  = new MutationEvents(getLeaveObserverConfig, leaveDefaultOptions, onLeaveMutation);
 
 
   /*** expose APIs ***/
@@ -286,4 +312,4 @@
   exposeApi(HTMLDocument.prototype);
   exposeApi(Window.prototype);
 
-})(this, jQuery);
+})(this, typeof jQuery === 'undefined' ? null : jQuery);

tests/spec/arriveSpec.js

@@ -60,7 +60,7 @@ describe("Arrive", function() {
 
             it("Event should be fired when a class is added to an element and the element starts to satisfies event selector", function(done) {
                 j(document).unbindArrive();
-                j(document).arrive(".container5 .btn.red", function() {
+                j(document).arrive(".container5 .btn.red", { fireOnAttributesModification: true }, function() {
                     expect(this).toBe($btn[0]);
                     done();
                 });
@@ -69,12 +69,42 @@ describe("Arrive", function() {
 
             it("Event should be fired when tooltip is added to an element and the element starts to satisfies event selector", function(done) {
                 j(document).unbindArrive();
-                j(document).arrive(".container5 .btn[title='it works!']", function() {
+                j(document).arrive(".container5 .btn[title='it works!']", { fireOnAttributesModification: true } , function() {
                     expect(this).toBe($btn[0]);
                     done(); 
                 });
                 $btn.attr("title", "it works!");
             });
+
+            it("Event should be not fired when a class is added to an element and the element starts to satisfies event selector but fireOnAttributesModification option is false", function(done) {
+                j(document).unbindArrive();
+
+                var eventFired = false;
+                j(document).arrive(".container5 .btn.red", function() {
+                    eventFired = true;
+                });
+                $btn.addClass("red");
+
+                setTimeout(function() {
+                    expect(eventFired).not.toBeTruthy();
+                    done();
+                }, 400);
+            });
+
+            it("Event should be not fired when tooltip is added to an element and the element starts to satisfies event selector but fireOnAttributesModification option is false", function(done) {
+                j(document).unbindArrive();
+
+                var eventFired = false;
+                j(document).arrive(".container5 .btn[title='it works!']", function() {
+                    eventFired = true;
+                });
+                $btn.attr("title", "it works!");
+
+                setTimeout(function() {
+                    expect(eventFired).not.toBeTruthy();
+                    done();
+                }, 400);
+            });
         });
 
         describe("Event unbinding tests", function() {

tests/withoutjQuery.js

@@ -7,7 +7,7 @@ function getParameterByName(name) {
 
 if (getParameterByName("withoutjQuery") == "true") {
   // run tests without jQuery
-  jQuery = undefined;
+  delete jQuery;
   j = function(selector) {
     return $(selector)[0];
   };