From 9eb177185574dc7a063ad0d6a03014ae2816d5c5 Mon Sep 17 00:00:00 2001 From: Filip Kis Date: Sat, 16 Mar 2019 00:05:43 +0100 Subject: [PATCH 1/2] Fixes #46 --- angular-legacy-sortable.js | 2 ++ e2e/conf.js | 2 +- e2e/nested-drag-drop.e2e.js | 21 ++++++++++++++++ example/nested.html | 18 ++++++++++++++ example/nestedApp.js | 48 +++++++++++++++++++++++++++++++++++++ 5 files changed, 90 insertions(+), 1 deletion(-) create mode 100644 e2e/nested-drag-drop.e2e.js create mode 100644 example/nested.html create mode 100644 example/nestedApp.js diff --git a/angular-legacy-sortable.js b/angular-legacy-sortable.js index ba8f868..7b40199 100644 --- a/angular-legacy-sortable.js +++ b/angular-legacy-sortable.js @@ -155,6 +155,7 @@ watchers = null; sortable = null; nextSibling = null; + removed = null; } @@ -171,6 +172,7 @@ onEnd: function (/**Event*/evt) { _emitEvent(evt, removed); scope.$apply(); + removed = null; }, onAdd: function (/**Event*/evt) { _sync(evt); diff --git a/e2e/conf.js b/e2e/conf.js index f469e30..ec0f6c1 100644 --- a/e2e/conf.js +++ b/e2e/conf.js @@ -1,4 +1,4 @@ exports.config = { seleniumAddress: 'http://localhost:4444/wd/hub', - specs: ['./basic-drag-drop.e2e.js'], + specs: ['./basic-drag-drop.e2e.js', './nested-drag-drop.e2e.js'], } diff --git a/e2e/nested-drag-drop.e2e.js b/e2e/nested-drag-drop.e2e.js new file mode 100644 index 0000000..f599ed5 --- /dev/null +++ b/e2e/nested-drag-drop.e2e.js @@ -0,0 +1,21 @@ +describe('nested drag and drop', () => { + it('should have correct model after moving between lists', () => { + browser.get('http://localhost:8080/nested.html') + browser.executeScript('$("#item2").simulate("drag-n-drop", { dragTarget: $("#item3"), interpolation: {stepWidth: 2, stepDelay: 30}});') + browser.sleep(1000) + element(by.id('main-list')).evaluate('$ctrl.lastDragged.name').then(function(value){ + expect(value).toBe('item2'); + }) + browser.executeScript('$("#item3").simulate("drag-n-drop", { dragTarget: $("#subitem1"), interpolation: {stepWidth: 2, stepDelay: 30}});') + browser.sleep(1000) + element(by.id('main-list')).evaluate('$ctrl.lastDragged.name').then(function(value){ + expect(value).toBe('item3'); + }) + browser.executeScript('$("#item1").simulate("drag-n-drop", { dragTarget: $("#item2"), interpolation: {stepWidth: 2, stepDelay: 30}});') + browser.sleep(1000) + element(by.id('main-list')).evaluate('$ctrl.lastDragged.name').then(function(value){ + expect(value).toBe('item1'); + }) + }) +}) + \ No newline at end of file diff --git a/example/nested.html b/example/nested.html new file mode 100644 index 0000000..b7612fd --- /dev/null +++ b/example/nested.html @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/example/nestedApp.js b/example/nestedApp.js new file mode 100644 index 0000000..361a79b --- /dev/null +++ b/example/nestedApp.js @@ -0,0 +1,48 @@ +angular.module('nestedApp', ['ng-sortable']) +.component('nestedDragAndDropExample', { + template: ``, + controller: class ExampleAppController { + constructor() { + var _this = this; + this.items = [{ + name: 'item1', + items: [ + { + name: 'subitem1', + } + ] + }, + { + name: 'item2', + }, + { + name: 'item3' + }] + this.onEnd = function(event) { + _this.lastDragged = event.model; + } + + this.sortableConf = { + group: 'all', + forceFallback: true, + onEnd: this.onEnd + } + this.nestedSortableConf = { + group: 'all', + forceFallback: true, + onEnd: this.onEnd + } + } + }, +}) From f63b6c0beebe6745b5510d4683ab105904faa9da Mon Sep 17 00:00:00 2001 From: Filip Kis Date: Sat, 16 Mar 2019 01:34:55 +0100 Subject: [PATCH 2/2] Fixes #44 --- angular-legacy-sortable.js | 3 --- e2e/conf.js | 2 +- e2e/nested-drag-drop.e2e.js | 11 ++++++++ example/nested.html | 18 +++++++++++++ example/nestedApp.js | 53 +++++++++++++++++++++++++++++++++++++ 5 files changed, 83 insertions(+), 4 deletions(-) create mode 100644 e2e/nested-drag-drop.e2e.js create mode 100644 example/nested.html create mode 100644 example/nestedApp.js diff --git a/angular-legacy-sortable.js b/angular-legacy-sortable.js index ba8f868..f93497c 100644 --- a/angular-legacy-sortable.js +++ b/angular-legacy-sortable.js @@ -137,8 +137,6 @@ evt.from.insertBefore(nextSibling, evt.item.nextSibling); } } - - scope.$apply(); } function _destroy() { @@ -175,7 +173,6 @@ onAdd: function (/**Event*/evt) { _sync(evt); _emitEvent(evt, removed); - scope.$apply(); }, onUpdate: function (/**Event*/evt) { _sync(evt); diff --git a/e2e/conf.js b/e2e/conf.js index f469e30..ec0f6c1 100644 --- a/e2e/conf.js +++ b/e2e/conf.js @@ -1,4 +1,4 @@ exports.config = { seleniumAddress: 'http://localhost:4444/wd/hub', - specs: ['./basic-drag-drop.e2e.js'], + specs: ['./basic-drag-drop.e2e.js', './nested-drag-drop.e2e.js'], } diff --git a/e2e/nested-drag-drop.e2e.js b/e2e/nested-drag-drop.e2e.js new file mode 100644 index 0000000..4f04c71 --- /dev/null +++ b/e2e/nested-drag-drop.e2e.js @@ -0,0 +1,11 @@ +describe('nested drag and drop', () => { + + it('should allow list with nested list to be dropped in a nested list', () => { + browser.get('http://localhost:8080/nested.html') + browser.executeAsyncScript('var done = arguments[0]; window.onerror = done; $("#item2").simulate("drag-n-drop", { dragTarget: $("#subitem1"), interpolation: {stepWidth: 2, stepDelay: 30}}); setTimeout(done, 1000)').then(response =>{ + expect(response).toBeFalsy() + }) + browser.sleep(1000) + }) +}) + \ No newline at end of file diff --git a/example/nested.html b/example/nested.html new file mode 100644 index 0000000..b7612fd --- /dev/null +++ b/example/nested.html @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/example/nestedApp.js b/example/nestedApp.js new file mode 100644 index 0000000..c79e4b5 --- /dev/null +++ b/example/nestedApp.js @@ -0,0 +1,53 @@ +angular.module('nestedApp', ['ng-sortable']) +.component('nestedDragAndDropExample', { + template: ``, + controller: class ExampleAppController { + constructor() { + var _this = this; + this.items = [{ + name: 'item1', + items: [ + { + name: 'subitem1', + } + ] + }, + { + name: 'item2', + items: [ + { + name: 'subitem2', + } + ] + }, + { + name: 'item3' + }] + this.onEnd = function(event) { + _this.lastDragged = event.model; + } + + this.sortableConf = { + group: 'all', + forceFallback: true, + onEnd: this.onEnd + } + this.nestedSortableConf = { + group: 'all', + forceFallback: true, + onEnd: this.onEnd + } + } + }, +})