handsontable 0.34.1 → 0.34.5

package/src/plugins/copyPaste/test/copyPaste.e2e.js

@@ -12,6 +12,25 @@ describe('CopyPaste', () => {
     }
   });
 
+  class DataTransferObject {
+    constructor() {
+      this.data = '';
+    }
+    getData() {
+      return this.data;
+    }
+    setData(type, value) {
+      this.data = value;
+    }
+  };
+
+  function getClipboardEvent() {
+    let event = {};
+    event.clipboardData = new DataTransferObject();
+    event.preventDefault = () => {};
+    return event;
+  }
+
   const arrayOfArrays = function() {
     return [
       ['', 'Kia', 'Nissan', 'Toyota', 'Honda'],
@@ -81,67 +100,7 @@ describe('CopyPaste', () => {
     });
   });
 
-  describe('setting values copyable', () => {
-    it('should set copyable text when selecting a single cell and hitting ctrl', () => {
-      handsontable({
-        data: Handsontable.helper.createSpreadsheetData(2, 2)
-      });
-
-      const copyPasteTextarea = $('#HandsontableCopyPaste')[0];
-
-      expect(copyPasteTextarea.value.length).toEqual(0);
-
-      selectCell(0, 0);
-      keyDownUp(Handsontable.helper.KEY_CODES.CONTROL_LEFT);
-
-      expect(copyPasteTextarea.value).toEqual('A1');
-    });
-
-    it('should set copyable text when selecting a single cell and hitting left command', () => {
-      handsontable({
-        data: Handsontable.helper.createSpreadsheetData(2, 2)
-      });
-
-      const copyPasteTextarea = $('#HandsontableCopyPaste')[0];
-
-      expect(copyPasteTextarea.value.length).toEqual(0);
-
-      selectCell(0, 0);
-      keyDownUp(Handsontable.helper.KEY_CODES.COMMAND_LEFT);
-
-      expect(copyPasteTextarea.value).toEqual('A1');
-    });
-
-    it('should set copyable text when selecting a single cell and hitting right command', () => {
-      handsontable({
-        data: Handsontable.helper.createSpreadsheetData(2, 2)
-      });
-
-      const copyPasteTextarea = $('#HandsontableCopyPaste')[0];
-
-      expect(copyPasteTextarea.value.length).toEqual(0);
-
-      selectCell(0, 0);
-      keyDownUp(Handsontable.helper.KEY_CODES.COMMAND_RIGHT);
-
-      expect(copyPasteTextarea.value).toEqual('A1');
-    });
-
-    it('should set copyable text when selecting multiple cells and hitting ctrl', () => {
-      handsontable({
-        data: Handsontable.helper.createSpreadsheetData(2, 2)
-      });
-
-      const copyPasteTextarea = $('#HandsontableCopyPaste')[0];
-
-      expect(copyPasteTextarea.value.length).toEqual(0);
-
-      selectCell(0, 0, 1, 0);
-      keyDownUp(Handsontable.helper.KEY_CODES.CONTROL_LEFT);
-
-      expect(copyPasteTextarea.value).toEqual('A1\nA2');
-    });
-
+  xdescribe('setting values copyable', () => {
     it('should set copyable text when selecting all cells with CTRL+A', (done) => {
       handsontable({
         data: Handsontable.helper.createSpreadsheetData(2, 2)
@@ -162,24 +121,6 @@ describe('CopyPaste', () => {
       }, 10);
     });
 
-    it('should not throw error when no cell is selected (#1221)', () => {
-      handsontable({
-        data: Handsontable.helper.createSpreadsheetData(2, 2)
-      });
-
-      selectCell(0, 0);
-      deselectCell();
-
-      function keydownCtrl() {
-        $(document).simulate('keydown', {
-          keyCode: Handsontable.helper.KEY_CODES.COMMAND_LEFT
-        });
-      }
-
-      // expect no to throw any exception
-      expect(keydownCtrl).not.toThrow();
-    });
-
     it('should not throw error when no cell is selected and contextmenu options was clicked', () => {
       // This is ugly trick to check problematic thing (#4390).
       // Unfortunately we cannot open the context menu, when event.target is not an TD element.
@@ -211,25 +152,6 @@ describe('CopyPaste', () => {
       expect(copyPasteTextarea.value).toEqual('A\t1\nB\t2');
     });
 
-    it('should set copyable text when selecting a single cell with editor type as false (#2574)', () => {
-      handsontable({
-        data: [['A', 1], ['B', 2]],
-        columns: [
-          { type: 'text' },
-          { editor: false }
-        ]
-      });
-
-      const copyPasteTextarea = $('#HandsontableCopyPaste')[0];
-
-      expect(copyPasteTextarea.value.length).toEqual(0);
-
-      selectCell(1, 1, 1, 1);
-      keyDownUp(Handsontable.helper.KEY_CODES.CONTROL_LEFT);
-
-      expect(copyPasteTextarea.value).toEqual('2');
-    });
-
     it('should set copyable text until copyRowsLimit is reached', () => {
       handsontable({
         data: arrayOfArrays(),
@@ -281,67 +203,46 @@ describe('CopyPaste', () => {
   });
 
   describe('copy', () => {
-    it('should be possible to copy data by keyboard shortcut', () => {
-      handsontable({
-        data: Handsontable.helper.createSpreadsheetData(2, 2),
-      });
-
-      selectCell(1, 1);
-      keyDown('ctrl');
-      keyDown('ctrl+c');
+    xit('should be possible to copy data by keyboard shortcut', () => {
+      // simulated keyboard shortcuts doesn't run the true events
+    });
 
-      expect($('#HandsontableCopyPaste')[0]).toBe(document.activeElement);
-      // unfortunately we have not access to read data from the system clipboard
+    xit('should be possible to copy data by contextMenu option', () => {
+      // simulated mouse events doesn't run the true browser event
     });
 
     it('should be possible to copy data by API', () => {
       const hot = handsontable({
         data: Handsontable.helper.createSpreadsheetData(2, 2),
       });
+      const copyEvent = getClipboardEvent('copy');
+      const plugin = hot.getPlugin('CopyPaste');
 
       selectCell(1, 0);
 
-      hot.getPlugin('CopyPaste').setCopyableText();
-      // below line is cause of console warning in FF about execCommand
-      hot.getPlugin('CopyPaste').copy(true);
+      plugin.setCopyableText();
+      plugin.onCopy(copyEvent);
 
-      expect($('#HandsontableCopyPaste')[0]).toBe(document.activeElement);
-      // unfortunately we have not access to read data from the system clipboard
-    });
-
-    it('should be possible to copy data by contextMenu option', () => {
-      const beforeCopySpy = jasmine.createSpy('beforeCopy');
-
-      handsontable({
-        data: Handsontable.helper.createSpreadsheetData(2, 2),
-        beforeCopy: beforeCopySpy,
-        contextMenu: ['copy']
-      });
-
-      selectCell(0, 1);
-      contextMenu();
-
-      const items = $('.htContextMenu tbody td');
-      const actions = items.not('.htSeparator');
-
-      actions.simulate('mousedown');
-
-      expect(beforeCopySpy).toHaveBeenCalledTimes(1);
+      expect(copyEvent.clipboardData.getData()).toBe('A2');
     });
 
     it('should call beforeCopy and afterCopy during copying operation', () => {
       const beforeCopySpy = jasmine.createSpy('beforeCopy');
       const afterCopySpy = jasmine.createSpy('afterCopy');
 
-      handsontable({
+      const hot = handsontable({
         data: Handsontable.helper.createSpreadsheetData(2, 2),
         beforeCopy: beforeCopySpy,
-        afterCopy: afterCopySpy
+        afterCopy: afterCopySpy,
       });
 
+      const copyEvent = getClipboardEvent('copy');
+      const plugin = hot.getPlugin('CopyPaste');
+
       selectCell(0, 0);
-      keyDown('ctrl');
-      keyDown('ctrl+c');
+
+      plugin.setCopyableText();
+      plugin.onCopy(copyEvent);
 
       expect(beforeCopySpy.calls.count()).toEqual(1);
       expect(beforeCopySpy).toHaveBeenCalledWith([['A1']], [{startRow: 0, startCol: 0, endRow: 0, endCol: 0}], void 0, void 0, void 0, void 0);
@@ -350,111 +251,92 @@ describe('CopyPaste', () => {
     });
 
     it('should be possible to block copying', () => {
+      const beforeCopySpy = jasmine.createSpy('beforeCopy');
       const afterCopySpy = jasmine.createSpy('afterCopy');
 
-      handsontable({
+      const hot = handsontable({
         data: Handsontable.helper.createSpreadsheetData(2, 2),
         beforeCopy() {
+          beforeCopySpy();
           return false;
         },
-        afterCopy: afterCopySpy
+        afterCopy: afterCopySpy,
       });
 
+      const copyEvent = getClipboardEvent('copy');
+      const plugin = hot.getPlugin('CopyPaste');
+
       selectCell(0, 0);
-      keyDown('ctrl');
-      keyDown('ctrl+c');
 
+      plugin.setCopyableText();
+      plugin.onCopy(copyEvent);
+
+      expect(beforeCopySpy.calls.count()).toEqual(1);
       expect(afterCopySpy.calls.count()).toEqual(0);
     });
 
-    it('should be possible modification of changes during copying', async () => {
-      handsontable({
+    it('should be possible modification of changes during copying', () => {
+      const hot = handsontable({
         data: Handsontable.helper.createSpreadsheetData(2, 2),
         beforeCopy(changes) {
           changes.splice(0, 1);
-        }
+        },
       });
 
+      const copyEvent = getClipboardEvent('copy');
+      const plugin = hot.getPlugin('CopyPaste');
       selectCell(0, 0, 1, 0);
-      keyDown('ctrl');
-      keyDown('ctrl+c');
 
-      await sleep(60);
+      plugin.setCopyableText();
+      plugin.onCopy(copyEvent);
 
-      expect($('#HandsontableCopyPaste')[0].value).toEqual('A2');
+      expect(copyEvent.clipboardData.getData()).toEqual('A2');
     });
   });
 
   describe('cut', () => {
-    it('should be possible to cut data by keyboard shortcut', async () => {
-      const hot = handsontable({
-        data: Handsontable.helper.createSpreadsheetData(2, 2),
-      });
-
-      selectCell(1, 1);
-      keyDown('ctrl');
-      keyDown('ctrl+x');
-
-      expect($('#HandsontableCopyPaste')[0]).toBe(document.activeElement);
-
-      await sleep(100);
+    xit('should be possible to cut data by keyboard shortcut', () => {
+      // simulated keyboard shortcuts doesn't run the true events
+    });
 
-      expect(hot.getDataAtCell(1, 1)).toBe('');
-      // unfortunately we have not access to read data from the system clipboard
+    xit('should be possible to cut data by contextMenu option', () => {
+      // simulated mouse events doesn't run the true browser event
     });
 
-    it('should be possible to cut data by API', async () => {
+    it('should be possible to cut data by API', () => {
       const hot = handsontable({
         data: Handsontable.helper.createSpreadsheetData(2, 2),
       });
+      const cutEvent = getClipboardEvent('cut');
+      const plugin = hot.getPlugin('CopyPaste');
 
       selectCell(1, 0);
 
-      hot.getPlugin('CopyPaste').setCopyableText();
-      // below line is cause of console warning in FF about execCommand
-      hot.getPlugin('CopyPaste').cut(true);
+      plugin.setCopyableText();
+      plugin.onCut(cutEvent);
 
-      expect($('#HandsontableCopyPaste')[0]).toBe(document.activeElement);
-
-      await sleep(100);
+      expect(cutEvent.clipboardData.getData()).toBe('A2');
 
+      // await sleep(100);
       expect(hot.getDataAtCell(1, 0)).toBe('');
-      // unfortunately we have not access to read data from the system clipboard
-    });
-
-    it('should be possible to cut data by contextMenu option', () => {
-      const beforeCutSpy = jasmine.createSpy('beforeCopy');
-
-      handsontable({
-        data: Handsontable.helper.createSpreadsheetData(2, 2),
-        beforeCut: beforeCutSpy,
-        contextMenu: ['cut']
-      });
-
-      selectCell(0, 1);
-      contextMenu();
-
-      const items = $('.htContextMenu tbody td');
-      const actions = items.not('.htSeparator');
-
-      actions.simulate('mousedown');
-
-      expect(beforeCutSpy).toHaveBeenCalledTimes(1);
     });
 
     it('should call beforeCut and afterCut during cutting out operation', () => {
       const beforeCutSpy = jasmine.createSpy('beforeCut');
       const afterCutSpy = jasmine.createSpy('afterCut');
 
-      handsontable({
+      const hot = handsontable({
         data: Handsontable.helper.createSpreadsheetData(2, 2),
         beforeCut: beforeCutSpy,
         afterCut: afterCutSpy
       });
+      const cutEvent = getClipboardEvent('cut');
+      const plugin = hot.getPlugin('CopyPaste');
 
       selectCell(0, 0);
-      keyDown('ctrl');
-      keyDown('ctrl+x');
+
+      plugin.setCopyableText();
+      plugin.onCut(cutEvent);
 
       expect(beforeCutSpy.calls.count()).toEqual(1);
       expect(beforeCutSpy).toHaveBeenCalledWith([['A1']], [{startRow: 0, startCol: 0, endRow: 0, endCol: 0}], void 0, void 0, void 0, void 0);

package/src/plugins/copyPaste/test/textarea.unit.js

@@ -56,7 +56,7 @@ describe('CopyPaste', () => {
       const textarea = Textarea.getSingleton();
       const newValue = 'zxcvb';
 
-      expect(textarea.element.value.length).toBe(0);
+      expect(textarea.element.value.length).toBe(1);
 
       textarea.setValue(newValue);
 
@@ -69,7 +69,7 @@ describe('CopyPaste', () => {
       const textarea = Textarea.getSingleton();
       const newValue = 'zxcvb';
 
-      expect(textarea.getValue().length).toBe(0);
+      expect(textarea.getValue().length).toBe(1);
 
       textarea.setValue(newValue);
 

package/src/plugins/copyPaste/textarea.js

@@ -58,7 +58,8 @@ class Textarea {
     this.element.className = 'copyPaste';
     this.element.tabIndex = -1;
     this.element.autocomplete = 'off';
-    this.element.wrap = 'off';
+    this.element.wrap = 'hard';
+    this.element.value = ' ';
   }
 
   /**

package/src/plugins/manualColumnMove/manualColumnMove.js

@@ -116,9 +116,9 @@ class ManualColumnMove extends BasePlugin {
     this.addHook('afterScrollVertically', () => this.onAfterScrollVertically());
     this.addHook('modifyCol', (row, source) => this.onModifyCol(row, source));
     this.addHook('beforeRemoveCol', (index, amount) => this.onBeforeRemoveCol(index, amount));
-    this.addHook('afterRemoveCol', (index, amount) => this.onAfterRemoveCol(index, amount));
+    this.addHook('afterRemoveCol', () => this.onAfterRemoveCol());
     this.addHook('afterCreateCol', (index, amount) => this.onAfterCreateCol(index, amount));
-    this.addHook('afterLoadData', (firstTime) => this.onAfterLoadData(firstTime));
+    this.addHook('afterLoadData', () => this.onAfterLoadData());
     this.addHook('unmodifyCol', (column) => this.onUnmodifyCol(column));
 
     this.registerEvents();
@@ -235,7 +235,7 @@ class ManualColumnMove extends BasePlugin {
       let columnWidth = 0;
 
       if (i < 0) {
-        columnWidth = this.hot.view.wt.wtTable.getColumnWidth(i) || 0;
+        columnWidth = this.hot.view.wt.wtViewport.getRowHeaderWidth() || 0;
       } else {
         columnWidth = this.hot.view.wt.wtTable.getStretchedColumnWidth(i) || 0;
       }
@@ -428,7 +428,7 @@ class ManualColumnMove extends BasePlugin {
       let maxIndex = countCols - 1;
       let columnsToRemove = [];
 
-      arrayEach(this.columnsMapper._arrayMap, (value, index, array) => {
+      arrayEach(this.columnsMapper._arrayMap, (value, index) => {
         if (value > maxIndex) {
           columnsToRemove.push(index);
         }
@@ -668,10 +668,8 @@ class ManualColumnMove extends BasePlugin {
    * `afterRemoveCol` hook callback.
    *
    * @private
-   * @param {Number} index Visual column index of the removed column.
-   * @param {Number} amount Amount of removed columns.
    */
-  onAfterRemoveCol(index, amount) {
+  onAfterRemoveCol() {
     this.columnsMapper.unshiftItems(this.removedColumns);
   }
 
@@ -679,9 +677,8 @@ class ManualColumnMove extends BasePlugin {
    * `afterLoadData` hook callback.
    *
    * @private
-   * @param {Boolean} firstTime True if that was loading data during the initialization.
    */
-  onAfterLoadData(firstTime) {
+  onAfterLoadData() {
     this.updateColumnsMapper();
   }
 

package/src/plugins/manualColumnMove/test/manualColumnMoveUI.e2e.js

@@ -116,6 +116,41 @@ describe('manualColumnMove', () => {
       expect(this.$container.find('.ht__manualColumnMove--backlight')[0].offsetWidth).toBe($headerTH[0].offsetWidth);
     });
 
+    it('should set proper left position of the backlight element when colWidths is undefined', () => {
+      handsontable({
+        data: Handsontable.helper.createSpreadsheetData(10, 10),
+        manualColumnMove: true,
+        rowHeaders: true,
+        colHeaders: true,
+      });
+
+      let header = spec().$container.find('thead tr:eq(0) th:eq(2)');
+
+      header.simulate('mousedown');
+      header.simulate('mouseup');
+      header.simulate('mousedown');
+
+      expect(spec().$container.find('.ht__manualColumnMove--backlight')[0].offsetLeft).toBe(100);
+    });
+
+    it('should set proper left position of the backlight element when colWidths is defined', () => {
+      handsontable({
+        data: Handsontable.helper.createSpreadsheetData(10, 10),
+        manualColumnMove: true,
+        rowHeaders: true,
+        colWidths: 100,
+        colHeaders: true,
+      });
+
+      let header = spec().$container.find('thead tr:eq(0) th:eq(2)');
+
+      header.simulate('mousedown');
+      header.simulate('mouseup');
+      header.simulate('mousedown');
+
+      expect(spec().$container.find('.ht__manualColumnMove--backlight')[0].offsetLeft).toBe(150);
+    });
+
     it('should not run moving ui if mousedown was fired on sorting element', function() {
       var hot = handsontable({
         data: arrayOfArrays.slice(),

package/src/plugins/manualRowMove/manualRowMove.js

@@ -114,9 +114,9 @@ class ManualRowMove extends BasePlugin {
     this.addHook('afterScrollHorizontally', () => this.onAfterScrollHorizontally());
     this.addHook('modifyRow', (row, source) => this.onModifyRow(row, source));
     this.addHook('beforeRemoveRow', (index, amount) => this.onBeforeRemoveRow(index, amount));
-    this.addHook('afterRemoveRow', (index, amount) => this.onAfterRemoveRow(index, amount));
+    this.addHook('afterRemoveRow', () => this.onAfterRemoveRow());
     this.addHook('afterCreateRow', (index, amount) => this.onAfterCreateRow(index, amount));
-    this.addHook('afterLoadData', (firstTime) => this.onAfterLoadData(firstTime));
+    this.addHook('afterLoadData', () => this.onAfterLoadData());
     this.addHook('beforeColumnSort', (column, order) => this.onBeforeColumnSort(column, order));
     this.addHook('unmodifyRow', (row) => this.onUnmodifyRow(row));
 
@@ -434,7 +434,7 @@ class ManualRowMove extends BasePlugin {
       let maxIndex = countRows - 1;
       let rowsToRemove = [];
 
-      arrayEach(this.rowsMapper._arrayMap, (value, index, array) => {
+      arrayEach(this.rowsMapper._arrayMap, (value, index) => {
         if (value > maxIndex) {
           rowsToRemove.push(index);
         }
@@ -518,7 +518,7 @@ class ManualRowMove extends BasePlugin {
       priv.target.TD = TD;
       priv.rowsToMove = this.prepareRowsToMoving();
 
-      let leftPos = wtTable.holder.scrollLeft + wtTable.getColumnWidth(-1);
+      let leftPos = wtTable.holder.scrollLeft + this.hot.view.wt.wtViewport.getRowHeaderWidth();
 
       this.backlight.setPosition(null, leftPos);
       this.backlight.setSize(wtTable.hider.offsetWidth - leftPos, this.getRowsHeight(start, end + 1));
@@ -638,7 +638,7 @@ class ManualRowMove extends BasePlugin {
    */
   onAfterScrollHorizontally() {
     let wtTable = this.hot.view.wt.wtTable;
-    let headerWidth = wtTable.getColumnWidth(-1);
+    let headerWidth = this.hot.view.wt.wtViewport.getRowHeaderWidth();
     let scrollLeft = wtTable.holder.scrollLeft;
     let posLeft = headerWidth + scrollLeft;
 
@@ -679,10 +679,8 @@ class ManualRowMove extends BasePlugin {
    * `afterRemoveRow` hook callback.
    *
    * @private
-   * @param {Number} index Visual index of the removed row.
-   * @param {Number} amount Amount of removed rows.
    */
-  onAfterRemoveRow(index, amount) {
+  onAfterRemoveRow() {
     this.rowsMapper.unshiftItems(this.removedRows);
   }
 
@@ -690,9 +688,8 @@ class ManualRowMove extends BasePlugin {
    * `afterLoadData` hook callback.
    *
    * @private
-   * @param {Boolean} firstTime True if that was loading data during the initialization.
    */
-  onAfterLoadData(firstTime) {
+  onAfterLoadData() {
     this.updateRowsMapper();
   }