e61fd5b4515a0c83e0311e5045e6ef4a9da62164b708b4ea583346a46d6d10ffb274ad330e651b419fbcfe2ad4a6003a2d4901426156928d368f261b11bf6e 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423
  1. 'use strict';
  2. describe('manualRowMove', function () {
  3. var id = 'testContainer';
  4. var arrayOfObjects = [{ id: 1, name: 'Ted', lastName: 'Right' }, { id: 2, name: 'Frank', lastName: 'Honest' }, { id: 3, name: 'Joan', lastName: 'Well' }, { id: 4, name: 'Sid', lastName: 'Strong' }, { id: 5, name: 'Jane', lastName: 'Neat' }, { id: 6, name: 'Chuck', lastName: 'Jackson' }, { id: 7, name: 'Meg', lastName: 'Jansen' }, { id: 8, name: 'Rob', lastName: 'Norris' }, { id: 9, name: 'Sean', lastName: 'O\'Hara' }, { id: 10, name: 'Eve', lastName: 'Branson' }];
  5. beforeEach(function () {
  6. this.$container = $('<div id="' + id + '"></div>').appendTo('body');
  7. });
  8. afterEach(function () {
  9. if (this.$container) {
  10. destroy();
  11. this.$container.remove();
  12. }
  13. });
  14. describe('init', function () {
  15. it('should change row order at init', function () {
  16. handsontable({
  17. data: arrayOfObjects,
  18. manualRowMove: [1, 2, 0]
  19. });
  20. expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('2');
  21. expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('3');
  22. expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('1');
  23. });
  24. });
  25. describe('updateSettings', function () {
  26. it('should be enabled after specifying it in updateSettings config', function () {
  27. handsontable({
  28. data: arrayOfObjects,
  29. rowHeaders: true
  30. });
  31. updateSettings({
  32. manualRowMove: true
  33. });
  34. this.$container.find('tbody tr:eq(0) th:eq(0)').simulate('mousedown');
  35. this.$container.find('tbody tr:eq(0) th:eq(0)').simulate('mouseup');
  36. expect(this.$container.hasClass('after-selection--rows')).toBeGreaterThan(0);
  37. });
  38. it('should change the default row order with updateSettings', function () {
  39. handsontable({
  40. data: arrayOfObjects,
  41. manualRowMove: true
  42. });
  43. expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('1');
  44. expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('2');
  45. expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('3');
  46. updateSettings({
  47. manualRowMove: [2, 1, 0]
  48. });
  49. expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('3');
  50. expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('2');
  51. expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('1');
  52. });
  53. it('should change row order with updateSettings', function () {
  54. handsontable({
  55. data: arrayOfObjects,
  56. manualRowMove: [1, 2, 0]
  57. });
  58. expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('2');
  59. expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('3');
  60. expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('1');
  61. updateSettings({
  62. manualRowMove: [2, 1, 0]
  63. });
  64. expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('3');
  65. expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('2');
  66. expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('1');
  67. });
  68. it('should reset row order with updateSettings when undefined is passed', function () {
  69. handsontable({
  70. data: arrayOfObjects,
  71. manualRowMove: [1, 2, 0]
  72. });
  73. expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('2');
  74. expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('3');
  75. expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('1');
  76. updateSettings({
  77. manualRowMove: void 0
  78. });
  79. expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('1');
  80. expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('2');
  81. expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('3');
  82. });
  83. it('should not change row order with updateSettings when `true` is passed', function () {
  84. handsontable({
  85. data: arrayOfObjects,
  86. manualRowMove: [1, 2, 0]
  87. });
  88. expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('2');
  89. expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('3');
  90. expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('1');
  91. updateSettings({
  92. manualRowMove: true
  93. });
  94. expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('2');
  95. expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('3');
  96. expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('1');
  97. });
  98. });
  99. describe('loadData', function () {
  100. it('should increase numbers of rows if it is necessary', function () {
  101. var hot = handsontable({
  102. data: Handsontable.helper.createSpreadsheetData(5, 5),
  103. manualRowMove: true
  104. });
  105. hot.loadData(Handsontable.helper.createSpreadsheetData(10, 10));
  106. expect(countRows()).toEqual(10);
  107. expect(hot.getPlugin('manualRowMove').rowsMapper.__arrayMap.length).toEqual(10);
  108. });
  109. it('should decrease numbers of rows if it is necessary', function () {
  110. var hot = handsontable({
  111. data: Handsontable.helper.createSpreadsheetData(5, 5),
  112. manualRowMove: true
  113. });
  114. hot.loadData(Handsontable.helper.createSpreadsheetData(2, 2));
  115. expect(countRows()).toEqual(2);
  116. expect(hot.getPlugin('manualRowMove').rowsMapper.__arrayMap.length).toEqual(2);
  117. });
  118. });
  119. describe('moving', function () {
  120. it('should move row by API', function () {
  121. var hot = handsontable({
  122. data: arrayOfObjects,
  123. rowHeaders: true,
  124. manualRowMove: true
  125. });
  126. expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('1');
  127. expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('2');
  128. expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('3');
  129. hot.getPlugin('manualRowMove').moveRow(2, 0);
  130. hot.render();
  131. expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('3');
  132. expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('1');
  133. expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('2');
  134. });
  135. it('should move many rows by API', function () {
  136. var hot = handsontable({
  137. data: arrayOfObjects,
  138. rowHeaders: true,
  139. manualRowMove: true
  140. });
  141. expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('1');
  142. expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('2');
  143. expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('3');
  144. hot.getPlugin('manualRowMove').moveRows([7, 9, 8], 0);
  145. hot.render();
  146. expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('8');
  147. expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('10');
  148. expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('9');
  149. });
  150. it('should trigger an beforeRowMove event before row move', function () {
  151. var beforeMoveRowCallback = jasmine.createSpy('beforeMoveRowCallback');
  152. var hot = handsontable({
  153. data: arrayOfObjects,
  154. rowHeaders: true,
  155. manualRowMove: true,
  156. beforeRowMove: beforeMoveRowCallback
  157. });
  158. expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('1');
  159. expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('2');
  160. expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('3');
  161. hot.getPlugin('manualRowMove').moveRows([8, 9, 7], 0);
  162. hot.render();
  163. expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('9');
  164. expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('10');
  165. expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('8');
  166. expect(beforeMoveRowCallback).toHaveBeenCalledWith([8, 9, 7], 0, void 0, void 0, void 0, void 0);
  167. });
  168. it('should trigger an afterRowMove event after row move', function () {
  169. var afterMoveRowCallback = jasmine.createSpy('afterMoveRowCallback');
  170. this.$container.height(150);
  171. var hot = handsontable({
  172. data: arrayOfObjects,
  173. rowHeaders: true,
  174. manualRowMove: true,
  175. afterRowMove: afterMoveRowCallback
  176. });
  177. expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('1');
  178. expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('2');
  179. expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('3');
  180. hot.getPlugin('manualRowMove').moveRows([8, 9, 7], 0);
  181. hot.render();
  182. expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('9');
  183. expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('10');
  184. expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('8');
  185. expect(afterMoveRowCallback).toHaveBeenCalledWith([8, 9, 7], 0, void 0, void 0, void 0, void 0);
  186. });
  187. it('should move the second row to the first row', function () {
  188. var hot = handsontable({
  189. data: arrayOfObjects,
  190. rowHeaders: true,
  191. manualRowMove: true
  192. });
  193. expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('1');
  194. expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('2');
  195. expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('3');
  196. var $rowsHeaders = this.$container.find('.ht_clone_left tr th');
  197. $rowsHeaders.eq(1).simulate('mousedown');
  198. $rowsHeaders.eq(1).simulate('mouseup');
  199. $rowsHeaders.eq(1).simulate('mousedown');
  200. $rowsHeaders.eq(0).simulate('mouseover');
  201. $rowsHeaders.eq(0).simulate('mousemove');
  202. $rowsHeaders.eq(0).simulate('mouseup');
  203. expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('2');
  204. expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('1');
  205. expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('3');
  206. });
  207. it('should move the second row to the third row', function () {
  208. handsontable({
  209. data: arrayOfObjects,
  210. rowHeaders: true,
  211. manualRowMove: true
  212. });
  213. expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('1');
  214. expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('2');
  215. expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('3');
  216. var $rowsHeaders = this.$container.find('.ht_clone_left tr th');
  217. $rowsHeaders.eq(1).simulate('mousedown');
  218. $rowsHeaders.eq(1).simulate('mouseup');
  219. $rowsHeaders.eq(1).simulate('mousedown');
  220. $rowsHeaders.eq(3).simulate('mouseover');
  221. $rowsHeaders.eq(3).simulate('mousemove');
  222. $rowsHeaders.eq(3).simulate('mouseup');
  223. expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('1');
  224. expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('3');
  225. expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('2');
  226. });
  227. it('should not move row if it\'s not needed', function () {
  228. var cache = [];
  229. handsontable({
  230. data: arrayOfObjects,
  231. rowHeaders: true,
  232. manualRowMove: true,
  233. afterRowMove: function afterRowMove(rows, target) {
  234. cache.push(rows);
  235. }
  236. });
  237. var $rowsHeaders = this.$container.find('.ht_clone_left tr th');
  238. $rowsHeaders.eq(1).simulate('mousedown');
  239. $rowsHeaders.eq(1).simulate('mouseup');
  240. $rowsHeaders.eq(1).simulate('mousedown');
  241. $rowsHeaders.eq(3).simulate('mouseup');
  242. expect(cache.length).toEqual(0);
  243. });
  244. it('should properly scrolling viewport if mouse is over part-visible cell', function (done) {
  245. var hot = handsontable({
  246. data: Handsontable.helper.createSpreadsheetData(20, 20),
  247. colHeaders: true,
  248. rowHeaders: true,
  249. manualRowMove: true,
  250. width: 600,
  251. height: 600,
  252. rowHeights: 47
  253. });
  254. var ev = {};
  255. hot.selectCell(19, 0);
  256. setTimeout(function () {
  257. expect(hot.view.wt.wtTable.getFirstVisibleRow()).toBeGreaterThan(8);
  258. var $rowsHeaders = spec().$container.find('.ht_clone_left tr th');
  259. $rowsHeaders.eq(10).simulate('mousedown');
  260. $rowsHeaders.eq(10).simulate('mouseup');
  261. $rowsHeaders.eq(10).simulate('mousedown');
  262. $rowsHeaders.eq(8).simulate('mouseover');
  263. $rowsHeaders.eq(8).simulate('mousemove');
  264. $rowsHeaders.eq(8).simulate('mouseup');
  265. }, 50);
  266. setTimeout(function () {
  267. expect(hot.view.wt.wtTable.getFirstVisibleRow()).toBeLessThan(8);
  268. done();
  269. }, 150);
  270. });
  271. it('moving row should keep cell meta created using cells function', function () {
  272. var hot = handsontable({
  273. data: arrayOfObjects,
  274. rowHeaders: true,
  275. manualRowMove: true,
  276. cells: function cells(row, col) {
  277. if (row == 1 && col == 0) {
  278. this.readOnly = true;
  279. }
  280. }
  281. });
  282. var htCore = getHtCore();
  283. expect(htCore.find('tbody tr:eq(1) td:eq(0)')[0].className.indexOf('htDimmed')).toBeGreaterThan(-1);
  284. hot.getPlugin('manualRowMove').moveRow(1, 3);
  285. hot.render();
  286. expect(htCore.find('tbody tr:eq(2) td:eq(0)')[0].className.indexOf('htDimmed')).toBeGreaterThan(-1);
  287. });
  288. it('moving row should keep cell meta created using cell array', function () {
  289. var hot = handsontable({
  290. data: arrayOfObjects,
  291. rowHeaders: true,
  292. manualRowMove: true,
  293. cell: [{ row: 1, col: 0, readOnly: true }]
  294. });
  295. var htCore = getHtCore();
  296. expect(htCore.find('tbody tr:eq(1) td:eq(0)')[0].className.indexOf('htDimmed')).toBeGreaterThan(-1);
  297. hot.getPlugin('manualRowMove').moveRow(3, 1);
  298. hot.render();
  299. expect(htCore.find('tbody tr:eq(2) td:eq(0)')[0].className.indexOf('htDimmed')).toBeGreaterThan(-1);
  300. });
  301. });
  302. describe('undoRedo', function () {
  303. it('should back changes', function () {
  304. var hot = handsontable({
  305. data: Handsontable.helper.createSpreadsheetData(10, 10),
  306. rowHeaders: true,
  307. manualRowMove: true
  308. });
  309. hot.getPlugin('manualRowMove').moveRow(1, 4);
  310. hot.render();
  311. expect(hot.getDataAtCell(3, 0)).toBe('A2');
  312. hot.undo();
  313. expect(hot.getDataAtCell(1, 0)).toBe('A2');
  314. });
  315. it('should revert changes', function () {
  316. var hot = handsontable({
  317. data: Handsontable.helper.createSpreadsheetData(10, 10),
  318. rowHeaders: true,
  319. manualRowMove: true
  320. });
  321. hot.getPlugin('manualRowMove').moveRow(1, 4);
  322. hot.render();
  323. expect(hot.getDataAtCell(3, 0)).toBe('A2');
  324. hot.undo();
  325. expect(hot.getDataAtCell(1, 0)).toBe('A2');
  326. hot.redo();
  327. expect(hot.getDataAtCell(3, 0)).toBe('A2');
  328. });
  329. });
  330. });