fix(draggable): Remove the z-index from events once they aren't being…

… dragged
mattlewis92 · Nov 30, 2015 · 26087c4 · 26087c4
1 parent af7e26b
commit 26087c4
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 2 deletions.
diff --git a/src/directives/mwlDraggable.js b/src/directives/mwlDraggable.js
@@ -110,6 +110,7 @@ angular
 
           $timeout(function() {
             translateElement(elm, '')
+              .css('z-index', 'auto')
               .removeAttr('data-x')
               .removeAttr('data-y')
               .removeClass('dragging-active');

diff --git a/test/unit/directives/mwlDraggable.spec.js b/test/unit/directives/mwlDraggable.spec.js
@@ -12,6 +12,7 @@ describe('mwlDraggable directive', function() {
     elementTarget,
     $window,
     $compile,
+    $timeout,
     template =
       '<div ' +
       'mwl-draggable="draggable" ' +
@@ -40,10 +41,11 @@ describe('mwlDraggable directive', function() {
     $provide.constant('interact', interact);
   }));
 
-  beforeEach(angular.mock.inject(function(_$compile_, _$rootScope_, _$window_) {
+  beforeEach(angular.mock.inject(function(_$compile_, _$rootScope_, _$window_, _$timeout_) {
     $window = _$window_;
     $compile = _$compile_;
     $rootScope = _$rootScope_;
+    $timeout = _$timeout_;
     scope = $rootScope.$new();
     prepareScope(scope);
 
@@ -104,11 +106,13 @@ describe('mwlDraggable directive', function() {
     draggableOptions.onstart(event);
     draggableOptions.onmove(event);
     draggableOptions.onend(event);
+    $timeout.flush();
     expect(angular.element(event.target).hasClass('dragging-active')).to.be.false;
     expect(angular.element(event.target).css('pointerEvents')).to.equal('auto');
     expect(angular.element(event.target).css('transform')).to.equal('');
     expect(angular.element(event.target).css('-webkit-transform')).to.equal('');
     expect(angular.element(event.target).css('-ms-transform')).to.equal('');
+    expect(angular.element(event.target).css('z-index')).to.equal('auto');
     expect(scope.onDragEnd).to.have.been.calledWith(0, 6);
   });
 

diff --git a/test/unit/directives/mwlResizable.spec.js b/test/unit/directives/mwlResizable.spec.js
@@ -10,6 +10,7 @@ describe('mwlresizable directive', function() {
     interactInstance,
     resizableOptions,
     $compile,
+    $timeout,
     template =
       '<div ' +
       'mwl-resizable="resizable" ' +
@@ -37,9 +38,10 @@ describe('mwlresizable directive', function() {
     $provide.constant('interact', interact);
   }));
 
-  beforeEach(angular.mock.inject(function(_$compile_, _$rootScope_) {
+  beforeEach(angular.mock.inject(function(_$compile_, _$rootScope_, _$timeout_) {
     $compile = _$compile_;
     $rootScope = _$rootScope_;
+    $timeout = _$timeout_;
     scope = $rootScope.$new();
     prepareScope(scope);
 
@@ -119,6 +121,7 @@ describe('mwlresizable directive', function() {
     resizableOptions.onstart(event);
     resizableOptions.onmove(event);
     resizableOptions.onend(event);
+    $timeout.flush();
     expect(scope.onResizeEnd).to.have.been.calledWith(0, 4);
     expect(angular.element(event.target).css('transform')).to.eql('');
     expect(angular.element(event.target).css('width')).to.eql('30px');