Added new section for callbacks testing.

Author: thgreasi

test/sortable.spec.js

@@ -5,7 +5,7 @@ describe('uiSortable', function() {
 
   var EXTRA_DY_PERCENTAGE = 0.25;
 
-  describe('simple use', function() {
+  describe('Simple use', function() {
 
     it('should have a ui-sortable class', function() {
       inject(function($compile, $rootScope) {
@@ -30,6 +30,7 @@ describe('uiSortable', function() {
     });
 
   });
+  
 
   describe('Drag & Drop simulation', function() {
 
@@ -69,49 +70,12 @@ describe('uiSortable', function() {
       });
     });
 
-    it('should cancel sorting of node "Two"', function() {
-      inject(function($compile, $rootScope) {
-        var element;
-        element = $compile('<ul ui-sortable="opts" ng-model="items"><li ng-repeat="item in items" id="s-{{$index}}">{{ item }}</li></ul>')($rootScope);
-        $rootScope.$apply(function() {
-          $rootScope.opts ={
-            update: function(e, ui) {
-              if (ui.item.scope().item === "Two") {
-                ui.item.parent().sortable('cancel');
-              }
-            }
-          };
-          $rootScope.items = ["One", "Two", "Three"];
-        });
-
-        host.append(element);
-
-        var li = element.find(':eq(1)');
-        var dy = (1 + EXTRA_DY_PERCENTAGE) * li.outerHeight();
-        li.simulate('drag', { dy: dy });
-        expect($rootScope.items).toEqual(["One", "Two", "Three"]);
-
-        li = element.find(':eq(0)');
-        dy = (2 + EXTRA_DY_PERCENTAGE) * li.outerHeight();
-        li.simulate('drag', { dy: dy });
-        expect($rootScope.items).toEqual(["Two", "Three", "One"]);
-
-        $(element).remove();
-      });
-    });
-
-    it('should update model from stop() callback', function() {
-      inject(function($compile, $rootScope) {
-        // TODO
-      });
-    });
-
     it('should not allow sorting of "locked" nodes', function() {
       inject(function($compile, $rootScope) {
         var element;
         element = $compile('<ul ui-sortable="opts" ng-model="items"><li ng-repeat="item in items" id="s-{{$index}}" ng-class="{ sortable: item.sortable }">{{ item.text }}</li></ul>')($rootScope);
         $rootScope.$apply(function() {
-          $rootScope.opts ={
+          $rootScope.opts = {
             items:'> .sortable'
           };
           $rootScope.items = [
@@ -188,4 +152,111 @@ describe('uiSortable', function() {
 
   });
 
+
+  describe('Callbacks related', function() {
+
+    var host;
+
+    beforeEach(inject(function() {
+      host = $('<div id="test-host"></div>');
+      $('body').append(host);
+    }));
+
+    afterEach(function() {
+      host.remove();
+      host = null;
+    });
+
+    it('should cancel sorting of node "Two"', function() {
+      inject(function($compile, $rootScope) {
+        var element;
+        element = $compile('<ul ui-sortable="opts" ng-model="items"><li ng-repeat="item in items" id="s-{{$index}}">{{ item }}</li></ul>')($rootScope);
+        $rootScope.$apply(function() {
+          $rootScope.opts = {
+            update: function(e, ui) {
+              if (ui.item.scope().item === "Two") {
+                ui.item.parent().sortable('cancel');
+              }
+            }
+          };
+          $rootScope.items = ["One", "Two", "Three"];
+        });
+
+        host.append(element);
+
+        var li = element.find(':eq(1)');
+        var dy = (1 + EXTRA_DY_PERCENTAGE) * li.outerHeight();
+        li.simulate('drag', { dy: dy });
+        expect($rootScope.items).toEqual(["One", "Two", "Three"]);
+
+        li = element.find(':eq(0)');
+        dy = (2 + EXTRA_DY_PERCENTAGE) * li.outerHeight();
+        li.simulate('drag', { dy: dy });
+        expect($rootScope.items).toEqual(["Two", "Three", "One"]);
+
+        $(element).remove();
+      });
+    });
+
+    it('should update model from update() callback', function() {
+      inject(function($compile, $rootScope) {
+        var element, logsElement;
+        element = $compile('<ul ui-sortable="opts" ng-model="items"><li ng-repeat="item in items" id="s-{{$index}}">{{ item }}</li></ul>')($rootScope);
+        logsElement = $compile('<ul ng-model="logs"><li ng-repeat="log in logs" id="l-{{$index}}">{{ log }}</li></ul>')($rootScope);
+        $rootScope.$apply(function() {
+          $rootScope.opts = {
+            update: function(e, ui) {
+              $rootScope.logs.push("Moved element " + ui.item.scope().item);
+            }
+          };
+          $rootScope.items = ["One", "Two", "Three"];
+          $rootScope.logs = [];
+        });
+
+        host.append(element).append(logsElement);
+
+        var li = element.find(':eq(1)');
+        var dy = (1 + EXTRA_DY_PERCENTAGE) * li.outerHeight();
+        li.simulate('drag', { dy: dy });
+        expect($rootScope.items).toEqual(["One", "Three", "Two"]);
+        expect($rootScope.logs).toEqual(["Moved element Two"]);
+        expect(logsElement.find('li').html()).toEqual("Moved element Two");
+
+        $(element).remove();
+        $(logsElement).remove();
+      });
+    });
+
+    // ensure scope.apply() is called after a stop() callback
+    it('should update model from stop() callback', function() {
+      inject(function($compile, $rootScope) {
+        var element, logsElement;
+        element = $compile('<ul ui-sortable="opts" ng-model="items"><li ng-repeat="item in items" id="s-{{$index}}">{{ item }}</li></ul>')($rootScope);
+        logsElement = $compile('<ul ng-model="logs"><li ng-repeat="log in logs" id="l-{{$index}}">{{ log }}</li></ul>')($rootScope);
+        $rootScope.$apply(function() {
+          $rootScope.opts = {
+            stop: function(e, ui) {
+              $rootScope.logs.push("Moved element " + ui.item.scope().item);
+            }
+          };
+          $rootScope.items = ["One", "Two", "Three"];
+          $rootScope.logs = [];
+        });
+
+        host.append(element).append(logsElement);
+
+        var li = element.find(':eq(1)');
+        var dy = (1 + EXTRA_DY_PERCENTAGE) * li.outerHeight();
+        li.simulate('drag', { dy: dy });
+        expect($rootScope.items).toEqual(["One", "Three", "Two"]);
+        expect($rootScope.logs).toEqual(["Moved element Two"]);
+        expect(logsElement.find('li').html()).toEqual("Moved element Two");
+
+        $(element).remove();
+        $(logsElement).remove();
+      });
+    });
+
+  });
+
 });