Skip to content
This repository was archived by the owner on Sep 8, 2020. It is now read-only.

Commit 5c0e403

Browse files
thgreasithgreasi
committed
test(sortable): add tests for horizontal lists workaround
1 parent 68cd370 commit 5c0e403

File tree

2 files changed

+177
-0
lines changed

2 files changed

+177
-0
lines changed

‎test/sortable.e2e.directiveoptions.spec.js

Lines changed: 172 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,172 @@
1+
'use strict';
2+
3+
describe('uiSortable', function() {
4+
5+
// Ensure the sortable angular module is loaded
6+
beforeEach(module('ui.sortable'));
7+
beforeEach(module('ui.sortable.testHelper'));
8+
9+
var EXTRA_DY_PERCENTAGE, listContent;
10+
11+
beforeEach(inject(function (sortableTestHelper) {
12+
EXTRA_DY_PERCENTAGE = sortableTestHelper.EXTRA_DY_PERCENTAGE;
13+
listContent = sortableTestHelper.listContent;
14+
}));
15+
16+
describe('Custom directive options related', function() {
17+
18+
var host;
19+
20+
beforeEach(inject(function() {
21+
host = $('<div id="test-host"></div>');
22+
$('body').append(host);
23+
}));
24+
25+
afterEach(function() {
26+
host.remove();
27+
host = null;
28+
});
29+
30+
it('should work when "ui-floating: false" option is used', function() {
31+
inject(function($compile, $rootScope) {
32+
var element;
33+
element = $compile('<ul ui-sortable="opts" ng-model="items"><li ng-repeat="item in items" id="s-{{$index}}" class="sortable-item">{{ item }}</li></ul>')($rootScope);
34+
$rootScope.$apply(function() {
35+
$rootScope.opts = {
36+
'ui-floating': false
37+
};
38+
$rootScope.items = ['One', 'Two', 'Three'];
39+
});
40+
41+
host.append(element);
42+
43+
var li = element.find(':eq(0)');
44+
var dy = (1 + EXTRA_DY_PERCENTAGE) * li.outerHeight();
45+
li.simulate('drag', { dy: dy });
46+
expect($rootScope.items).toEqual(['Two', 'One', 'Three']);
47+
expect($rootScope.items).toEqual(listContent(element));
48+
49+
li = element.find(':eq(1)');
50+
dy = (1 + EXTRA_DY_PERCENTAGE) * li.outerHeight();
51+
li.simulate('drag', { dy: dy });
52+
expect($rootScope.items).toEqual(['Two', 'Three', 'One']);
53+
expect($rootScope.items).toEqual(listContent(element));
54+
55+
li = element.find(':eq(1)');
56+
dy = (1 + EXTRA_DY_PERCENTAGE) * li.outerHeight();
57+
li.simulate('drag', { dy: dy });
58+
expect($rootScope.items).toEqual(['Two', 'One', 'Three']);
59+
expect($rootScope.items).toEqual(listContent(element));
60+
61+
$(element).remove();
62+
});
63+
});
64+
65+
it('should work when "ui-floating: true" option is used', function() {
66+
inject(function($compile, $rootScope) {
67+
var element;
68+
element = $compile('<ul ui-sortable="opts" ng-model="items"><li class="floatleft" ng-repeat="item in items" id="s-{{$index}}" class="sortable-item">{{ item }}</li></ul>')($rootScope);
69+
$rootScope.$apply(function() {
70+
$rootScope.opts = {
71+
'ui-floating': true
72+
};
73+
$rootScope.items = ['One', 'Two', 'Three'];
74+
});
75+
76+
host.append(element).append('<div class="clear"></div>');
77+
78+
var li = element.find(':eq(0)');
79+
var dx = (1 + EXTRA_DY_PERCENTAGE) * li.outerWidth();
80+
li.simulate('drag', { dx: dx });
81+
expect($rootScope.items).toEqual(['Two', 'One', 'Three']);
82+
expect($rootScope.items).toEqual(listContent(element));
83+
84+
li = element.find(':eq(1)');
85+
dx = (1 + EXTRA_DY_PERCENTAGE) * li.outerWidth();
86+
li.simulate('drag', { dx: dx });
87+
expect($rootScope.items).toEqual(['Two', 'Three', 'One']);
88+
expect($rootScope.items).toEqual(listContent(element));
89+
90+
li = element.find(':eq(1)');
91+
dx = (1 + EXTRA_DY_PERCENTAGE) * li.outerWidth();
92+
li.simulate('drag', { dx: dx, moves: 5 });
93+
expect($rootScope.items).toEqual(['Two', 'One', 'Three']);
94+
expect($rootScope.items).toEqual(listContent(element));
95+
96+
$(element).remove();
97+
});
98+
});
99+
100+
it('should work when "ui-floating: \'auto\'" option is used and elements are "float"ing', function() {
101+
inject(function($compile, $rootScope) {
102+
var element;
103+
element = $compile('<ul ui-sortable="opts" ng-model="items"><li class="floatleft" ng-repeat="item in items" id="s-{{$index}}" class="sortable-item">{{ item }}</li></ul>')($rootScope);
104+
$rootScope.$apply(function() {
105+
$rootScope.opts = {
106+
'ui-floating': 'auto'
107+
};
108+
$rootScope.items = ['One', 'Two', 'Three'];
109+
});
110+
111+
host.append(element).append('<div class="clear"></div>');
112+
113+
var li = element.find(':eq(0)');
114+
var dx = (1 + EXTRA_DY_PERCENTAGE) * li.outerWidth();
115+
li.simulate('drag', { dx: dx });
116+
expect($rootScope.items).toEqual(['Two', 'One', 'Three']);
117+
expect($rootScope.items).toEqual(listContent(element));
118+
119+
li = element.find(':eq(1)');
120+
dx = (1 + EXTRA_DY_PERCENTAGE) * li.outerWidth();
121+
li.simulate('drag', { dx: dx });
122+
expect($rootScope.items).toEqual(['Two', 'Three', 'One']);
123+
expect($rootScope.items).toEqual(listContent(element));
124+
125+
li = element.find(':eq(1)');
126+
dx = (1 + EXTRA_DY_PERCENTAGE) * li.outerWidth();
127+
li.simulate('drag', { dx: dx, moves: 5 });
128+
expect($rootScope.items).toEqual(['Two', 'One', 'Three']);
129+
expect($rootScope.items).toEqual(listContent(element));
130+
131+
$(element).remove();
132+
});
133+
});
134+
135+
it('should work when "ui-floating: \'auto\'" option is used and elements are "display: inline-block"', function() {
136+
inject(function($compile, $rootScope) {
137+
var element;
138+
element = $compile('<ul ui-sortable="opts" ng-model="items"><li class="inline-block" ng-repeat="item in items" id="s-{{$index}}" class="sortable-item">{{ item }}</li></ul>')($rootScope);
139+
$rootScope.$apply(function() {
140+
$rootScope.opts = {
141+
'ui-floating': 'auto'
142+
};
143+
$rootScope.items = ['One', 'Two', 'Three'];
144+
});
145+
146+
host.append(element);
147+
148+
var li = element.find(':eq(0)');
149+
var dx = (1 + EXTRA_DY_PERCENTAGE) * li.outerWidth();
150+
li.simulate('drag', { dx: dx });
151+
expect($rootScope.items).toEqual(['Two', 'One', 'Three']);
152+
expect($rootScope.items).toEqual(listContent(element));
153+
154+
li = element.find(':eq(1)');
155+
dx = (1 + EXTRA_DY_PERCENTAGE) * li.outerWidth();
156+
li.simulate('drag', { dx: dx });
157+
expect($rootScope.items).toEqual(['Two', 'Three', 'One']);
158+
expect($rootScope.items).toEqual(listContent(element));
159+
160+
li = element.find(':eq(1)');
161+
dx = (1 + EXTRA_DY_PERCENTAGE) * li.outerWidth();
162+
li.simulate('drag', { dx: dx, moves: 5 });
163+
expect($rootScope.items).toEqual(['Two', 'One', 'Three']);
164+
expect($rootScope.items).toEqual(listContent(element));
165+
166+
$(element).remove();
167+
});
168+
});
169+
170+
});
171+
172+
});

‎test/sortable.tests.css

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,8 @@
1+
.inline-block {
2+
display: inline-block;
3+
}
4+
5+
.floatleft,
16
.cross-sortable {
27
float: left;
38
}

0 commit comments

Comments
 (0)