123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421 |
- describe('manualRowMove', function () {
- var id = 'testContainer';
- 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' }];
- beforeEach(function () {
- this.$container = $('<div id="' + id + '"></div>').appendTo('body');
- });
- afterEach(function () {
- if (this.$container) {
- destroy();
- this.$container.remove();
- }
- });
- describe('init', function () {
- it('should change row order at init', function () {
- handsontable({
- data: arrayOfObjects,
- manualRowMove: [1, 2, 0]
- });
- expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('2');
- expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('3');
- expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('1');
- });
- });
- describe('updateSettings', function () {
- it('should be enabled after specifying it in updateSettings config', function () {
- handsontable({
- data: arrayOfObjects,
- rowHeaders: true
- });
- updateSettings({
- manualRowMove: true
- });
- this.$container.find('tbody tr:eq(0) th:eq(0)').simulate('mousedown');
- this.$container.find('tbody tr:eq(0) th:eq(0)').simulate('mouseup');
- expect(this.$container.hasClass('after-selection--rows')).toBeGreaterThan(0);
- });
- it('should change the default row order with updateSettings', function () {
- handsontable({
- data: arrayOfObjects,
- manualRowMove: true
- });
- expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('1');
- expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('2');
- expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('3');
- updateSettings({
- manualRowMove: [2, 1, 0]
- });
- expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('3');
- expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('2');
- expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('1');
- });
- it('should change row order with updateSettings', function () {
- handsontable({
- data: arrayOfObjects,
- manualRowMove: [1, 2, 0]
- });
- expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('2');
- expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('3');
- expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('1');
- updateSettings({
- manualRowMove: [2, 1, 0]
- });
- expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('3');
- expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('2');
- expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('1');
- });
- it('should reset row order with updateSettings when undefined is passed', function () {
- handsontable({
- data: arrayOfObjects,
- manualRowMove: [1, 2, 0]
- });
- expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('2');
- expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('3');
- expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('1');
- updateSettings({
- manualRowMove: void 0
- });
- expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('1');
- expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('2');
- expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('3');
- });
- it('should not change row order with updateSettings when `true` is passed', function () {
- handsontable({
- data: arrayOfObjects,
- manualRowMove: [1, 2, 0]
- });
- expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('2');
- expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('3');
- expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('1');
- updateSettings({
- manualRowMove: true
- });
- expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('2');
- expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('3');
- expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('1');
- });
- });
- describe('loadData', function () {
- it('should increase numbers of rows if it is necessary', function () {
- var hot = handsontable({
- data: Handsontable.helper.createSpreadsheetData(5, 5),
- manualRowMove: true
- });
- hot.loadData(Handsontable.helper.createSpreadsheetData(10, 10));
- expect(countRows()).toEqual(10);
- expect(hot.getPlugin('manualRowMove').rowsMapper.__arrayMap.length).toEqual(10);
- });
- it('should decrease numbers of rows if it is necessary', function () {
- var hot = handsontable({
- data: Handsontable.helper.createSpreadsheetData(5, 5),
- manualRowMove: true
- });
- hot.loadData(Handsontable.helper.createSpreadsheetData(2, 2));
- expect(countRows()).toEqual(2);
- expect(hot.getPlugin('manualRowMove').rowsMapper.__arrayMap.length).toEqual(2);
- });
- });
- describe('moving', function () {
- it('should move row by API', function () {
- var hot = handsontable({
- data: arrayOfObjects,
- rowHeaders: true,
- manualRowMove: true
- });
- expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('1');
- expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('2');
- expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('3');
- hot.getPlugin('manualRowMove').moveRow(2, 0);
- hot.render();
- expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('3');
- expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('1');
- expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('2');
- });
- it('should move many rows by API', function () {
- var hot = handsontable({
- data: arrayOfObjects,
- rowHeaders: true,
- manualRowMove: true
- });
- expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('1');
- expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('2');
- expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('3');
- hot.getPlugin('manualRowMove').moveRows([7, 9, 8], 0);
- hot.render();
- expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('8');
- expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('10');
- expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('9');
- });
- it('should trigger an beforeRowMove event before row move', function () {
- var beforeMoveRowCallback = jasmine.createSpy('beforeMoveRowCallback');
- var hot = handsontable({
- data: arrayOfObjects,
- rowHeaders: true,
- manualRowMove: true,
- beforeRowMove: beforeMoveRowCallback
- });
- expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('1');
- expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('2');
- expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('3');
- hot.getPlugin('manualRowMove').moveRows([8, 9, 7], 0);
- hot.render();
- expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('9');
- expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('10');
- expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('8');
- expect(beforeMoveRowCallback).toHaveBeenCalledWith([8, 9, 7], 0, void 0, void 0, void 0, void 0);
- });
- it('should trigger an afterRowMove event after row move', function () {
- var afterMoveRowCallback = jasmine.createSpy('afterMoveRowCallback');
- this.$container.height(150);
- var hot = handsontable({
- data: arrayOfObjects,
- rowHeaders: true,
- manualRowMove: true,
- afterRowMove: afterMoveRowCallback
- });
- expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('1');
- expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('2');
- expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('3');
- hot.getPlugin('manualRowMove').moveRows([8, 9, 7], 0);
- hot.render();
- expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('9');
- expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('10');
- expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('8');
- expect(afterMoveRowCallback).toHaveBeenCalledWith([8, 9, 7], 0, void 0, void 0, void 0, void 0);
- });
- it('should move the second row to the first row', function () {
- var hot = handsontable({
- data: arrayOfObjects,
- rowHeaders: true,
- manualRowMove: true
- });
- expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('1');
- expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('2');
- expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('3');
- var $rowsHeaders = this.$container.find('.ht_clone_left tr th');
- $rowsHeaders.eq(1).simulate('mousedown');
- $rowsHeaders.eq(1).simulate('mouseup');
- $rowsHeaders.eq(1).simulate('mousedown');
- $rowsHeaders.eq(0).simulate('mouseover');
- $rowsHeaders.eq(0).simulate('mousemove');
- $rowsHeaders.eq(0).simulate('mouseup');
- expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('2');
- expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('1');
- expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('3');
- });
- it('should move the second row to the third row', function () {
- handsontable({
- data: arrayOfObjects,
- rowHeaders: true,
- manualRowMove: true
- });
- expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('1');
- expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('2');
- expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('3');
- var $rowsHeaders = this.$container.find('.ht_clone_left tr th');
- $rowsHeaders.eq(1).simulate('mousedown');
- $rowsHeaders.eq(1).simulate('mouseup');
- $rowsHeaders.eq(1).simulate('mousedown');
- $rowsHeaders.eq(3).simulate('mouseover');
- $rowsHeaders.eq(3).simulate('mousemove');
- $rowsHeaders.eq(3).simulate('mouseup');
- expect(this.$container.find('tbody tr:eq(0) td:eq(0)').text()).toEqual('1');
- expect(this.$container.find('tbody tr:eq(1) td:eq(0)').text()).toEqual('3');
- expect(this.$container.find('tbody tr:eq(2) td:eq(0)').text()).toEqual('2');
- });
- it('should not move row if it\'s not needed', function () {
- var cache = [];
- handsontable({
- data: arrayOfObjects,
- rowHeaders: true,
- manualRowMove: true,
- afterRowMove: function afterRowMove(rows, target) {
- cache.push(rows);
- }
- });
- var $rowsHeaders = this.$container.find('.ht_clone_left tr th');
- $rowsHeaders.eq(1).simulate('mousedown');
- $rowsHeaders.eq(1).simulate('mouseup');
- $rowsHeaders.eq(1).simulate('mousedown');
- $rowsHeaders.eq(3).simulate('mouseup');
- expect(cache.length).toEqual(0);
- });
- it('should properly scrolling viewport if mouse is over part-visible cell', function (done) {
- var hot = handsontable({
- data: Handsontable.helper.createSpreadsheetData(20, 20),
- colHeaders: true,
- rowHeaders: true,
- manualRowMove: true,
- width: 600,
- height: 600,
- rowHeights: 47
- });
- var ev = {};
- hot.selectCell(19, 0);
- setTimeout(function () {
- expect(hot.view.wt.wtTable.getFirstVisibleRow()).toBeGreaterThan(8);
- var $rowsHeaders = spec().$container.find('.ht_clone_left tr th');
- $rowsHeaders.eq(10).simulate('mousedown');
- $rowsHeaders.eq(10).simulate('mouseup');
- $rowsHeaders.eq(10).simulate('mousedown');
- $rowsHeaders.eq(8).simulate('mouseover');
- $rowsHeaders.eq(8).simulate('mousemove');
- $rowsHeaders.eq(8).simulate('mouseup');
- }, 50);
- setTimeout(function () {
- expect(hot.view.wt.wtTable.getFirstVisibleRow()).toBeLessThan(8);
- done();
- }, 150);
- });
- it('moving row should keep cell meta created using cells function', function () {
- var hot = handsontable({
- data: arrayOfObjects,
- rowHeaders: true,
- manualRowMove: true,
- cells: function cells(row, col) {
- if (row == 1 && col == 0) {
- this.readOnly = true;
- }
- }
- });
- var htCore = getHtCore();
- expect(htCore.find('tbody tr:eq(1) td:eq(0)')[0].className.indexOf('htDimmed')).toBeGreaterThan(-1);
- hot.getPlugin('manualRowMove').moveRow(1, 3);
- hot.render();
- expect(htCore.find('tbody tr:eq(2) td:eq(0)')[0].className.indexOf('htDimmed')).toBeGreaterThan(-1);
- });
- it('moving row should keep cell meta created using cell array', function () {
- var hot = handsontable({
- data: arrayOfObjects,
- rowHeaders: true,
- manualRowMove: true,
- cell: [{ row: 1, col: 0, readOnly: true }]
- });
- var htCore = getHtCore();
- expect(htCore.find('tbody tr:eq(1) td:eq(0)')[0].className.indexOf('htDimmed')).toBeGreaterThan(-1);
- hot.getPlugin('manualRowMove').moveRow(3, 1);
- hot.render();
- expect(htCore.find('tbody tr:eq(2) td:eq(0)')[0].className.indexOf('htDimmed')).toBeGreaterThan(-1);
- });
- });
- describe('undoRedo', function () {
- it('should back changes', function () {
- var hot = handsontable({
- data: Handsontable.helper.createSpreadsheetData(10, 10),
- rowHeaders: true,
- manualRowMove: true
- });
- hot.getPlugin('manualRowMove').moveRow(1, 4);
- hot.render();
- expect(hot.getDataAtCell(3, 0)).toBe('A2');
- hot.undo();
- expect(hot.getDataAtCell(1, 0)).toBe('A2');
- });
- it('should revert changes', function () {
- var hot = handsontable({
- data: Handsontable.helper.createSpreadsheetData(10, 10),
- rowHeaders: true,
- manualRowMove: true
- });
- hot.getPlugin('manualRowMove').moveRow(1, 4);
- hot.render();
- expect(hot.getDataAtCell(3, 0)).toBe('A2');
- hot.undo();
- expect(hot.getDataAtCell(1, 0)).toBe('A2');
- hot.redo();
- expect(hot.getDataAtCell(3, 0)).toBe('A2');
- });
- });
- });
|