jnpf-web-datareport/node_modules/handsontable/test/e2e/editors/textEditor.spec.js

describe('TextEditor', () => {
  var id = 'testContainer';

  beforeEach(function() {
    this.$container = $(`<div id="${id}" style="width: 300px; height: 200px; overflow: hidden;"></div>`).appendTo('body');
  });

  afterEach(function() {
    if (this.$container) {
      destroy();
      this.$container.remove();
    }
  });

  it('should begin editing when enterBeginsEditing equals true', () => {
    handsontable({
      enterBeginsEditing: true,
      editor: 'text'
    });
    selectCell(2, 2);

    keyDown('enter');

    var selection = getSelected();
    expect(selection).toEqual([2, 2, 2, 2]);
    expect(isEditorVisible()).toEqual(true);
  });

  it('should move down after editing', () => {
    handsontable({
      editor: 'text'
    });
    selectCell(2, 2);

    keyDown('enter');
    keyDown('enter');

    var selection = getSelected();
    expect(selection).toEqual([3, 2, 3, 2]);
  });

  it('should move down when enterBeginsEditing equals false', () => {
    handsontable({
      enterBeginsEditing: false
    });
    selectCell(2, 2);

    keyDown('enter');

    var selection = getSelected();
    expect(selection).toEqual([3, 2, 3, 2]);
    expect(isEditorVisible()).toEqual(false);
  });

  it('should render string in textarea', () => {
    handsontable();
    setDataAtCell(2, 2, 'string');
    selectCell(2, 2);

    keyDown('enter');

    expect(keyProxy().val()).toEqual('string');
  });

  it('should render textarea editor in specified size at cell 0, 0 without headers', (done) => {
    var hot = handsontable();

    selectCell(0, 0);

    keyDown('enter');

    setTimeout(() => {
      expect(hot.getActiveEditor().TEXTAREA.style.height).toBe('23px');
      expect(hot.getActiveEditor().TEXTAREA.style.width).toBe('40px');
      done();
    }, 200);
  });

  it('should render textarea editor in specified size at cell 1, 0 without headers', (done) => {
    var hot = handsontable();

    selectCell(1, 1);

    keyDown('enter');

    setTimeout(() => {
      expect(hot.getActiveEditor().TEXTAREA.style.height).toBe('23px');
      done();
    }, 200);
  });

  it('should render textarea editor in specified size at cell 0, 0 with headers', (done) => {
    const hot = handsontable({
      rowHeaders: true,
      colHeaders: true
    });

    selectCell(0, 0);

    keyDown('enter');

    setTimeout(() => {
      expect(hot.getActiveEditor().TEXTAREA.style.height).toBe('23px');
      expect(hot.getActiveEditor().TEXTAREA.style.width).toBe('40px');
      expect(hot.getActiveEditor().textareaParentStyle.top).toBe('26px');
      done();
    }, 200);
  });

  it('should render textarea editor in specified size at cell 0, 0 with headers defined in columns', (done) => {
    const hot = handsontable({
      data: Handsontable.helper.createSpreadsheetObjectData(10, 10),
      columns: [{
        data: 'prop0',
        title: 'Prop 0'
      }, {
        data: 'prop1',
        title: 'Prop 1'
      }, {
        data: 'prop2',
        title: 'Prop 2'
      }, {
        data: 'prop3',
        title: 'Prop 3'
      }],
    });

    selectCell(0, 0);

    keyDown('enter');

    setTimeout(() => {
      expect(hot.getActiveEditor().TEXTAREA.style.height).toBe('23px');
      expect(parseInt(hot.getActiveEditor().TEXTAREA.style.width, 10)).toBeAroundValue(50, 4);
      expect(hot.getActiveEditor().textareaParentStyle.top).toBe('26px');
      done();
    }, 200);
  });

  it('should hide whole editor when it is higher then header', (done) => {
    const hot = handsontable({
      data: Handsontable.helper.createSpreadsheetData(50, 50),
      rowHeaders: true,
      colHeaders: true
    });

    setDataAtCell(2, 2, 'string\nstring\nstring');
    selectCell(2, 2);

    keyDown('enter');
    keyUp('enter');

    var mainHolder = hot.view.wt.wtTable.holder;

    mainHolder.scrollTop = 150;
    mainHolder.scrollLeft = 150;

    setTimeout(() => {
      expect(parseInt(hot.getActiveEditor().textareaParentStyle.top, 10)).toBeAroundValue(-77);
      expect(parseInt(hot.getActiveEditor().textareaParentStyle.left, 10)).toBeAroundValue(-1);
      done();
    }, 200);
  });

  it('should hide editor when quick navigation by click scrollbar was triggered', (done) => {
    var hot = handsontable({
      data: Handsontable.helper.createSpreadsheetData(50, 50),
      rowHeaders: true,
      colHeaders: true
    });

    setDataAtCell(2, 2, 'string\nstring\nstring');
    selectCell(2, 2);

    keyDown('enter');
    keyUp('enter');
    hot.scrollViewportTo(49);

    setTimeout(() => {
      expect(hot.getActiveEditor().textareaParentStyle.display).toBe('none');
      done();
    }, 100);
  });

  it('should render textarea editor in specified height (single line)', (done) => {
    var hot = handsontable(),
      editorHeight;

    setDataAtCell(2, 2, 'first line');
    selectCell(2, 2);

    keyDown('enter');

    setTimeout(() => {
      expect(hot.getActiveEditor().TEXTAREA.style.height).toBe('23px');
      done();
    }, 200);
  });

  it('should render textarea editor in specified height (multi line)', (done) => {
    var hot = handsontable(),
      editorHeight;

    setDataAtCell(2, 2, 'first line\n second line\n third line...');
    selectCell(2, 2);

    keyDown('enter');

    setTimeout(() => {
      expect(hot.getActiveEditor().TEXTAREA.style.height).toBe('64px');
      done();
    }, 200);
  });

  it('should render number in textarea', () => {
    handsontable();
    setDataAtCell(2, 2, 13);
    selectCell(2, 2);

    keyDown('enter');

    expect(keyProxy().val()).toEqual('13');
  });

  it('should render boolean true in textarea', () => {
    handsontable();
    setDataAtCell(2, 2, true);
    selectCell(2, 2);

    keyDown('enter');

    expect(keyProxy().val()).toEqual('true');
  });

  it('should render boolean false in textarea', () => {
    handsontable();
    setDataAtCell(2, 2, false);
    selectCell(2, 2);

    keyDown('enter');

    expect(keyProxy().val()).toEqual('false');
  });

  it('should render null in textarea', () => {
    handsontable();
    setDataAtCell(2, 2, null);
    selectCell(2, 2);

    keyDown('enter');

    expect(keyProxy().val()).toEqual('');
  });

  it('should render undefined in textarea', () => {
    handsontable();
    setDataAtCell(2, 2, void 0);
    selectCell(2, 2);

    keyDown('enter');

    expect(keyProxy().val()).toEqual('');
  });

  it('should render nested object value in textarea', () => {
    handsontable({
      data: [{
        name: {
          first: 'Tom',
          last: 'Kowalski',
          obj: {}
        }
      }, {
        name: {
          first: 'John',
          last: 'Cage',
          obj: {
            foo: 'bar'
          }
        }
      }],
      columns: [{
        data: 'name.last'
      }, {
        data: 'name.obj.foo'
      }]
    });
    selectCell(0, 0);
    keyDown('enter');

    expect(keyProxy().val()).toEqual('Kowalski');

    selectCell(1, 1);
    keyDown('enter');

    expect(keyProxy().val()).toEqual('bar');
  });

  it('should render nested object value in textarea after change rows order', () => {
    var hot = handsontable({
      data: [{
        name: {
          first: 'Tom',
          last: 'Kowalski',
          obj: {}
        }
      }, {
        name: {
          first: 'John',
          last: 'Cage',
          obj: {
            foo: 'bar'
          }
        }
      }],
      columns: [{
        data: 'name.last'
      }, {
        data: 'name.obj.foo'
      }],
      manualRowMove: true
    });

    hot.getPlugin('manualRowMove').moveRow(1, 0);
    hot.render();

    selectCell(0, 0);
    keyDown('enter');
    expect(keyProxy().val()).toEqual('Cage');
    keyDown('enter');

    expect(hot.getDataAtCell(0, 0)).toEqual('Cage');

    selectCell(1, 1);
    keyDown('enter');
    expect(keyProxy().val()).toEqual('');
    keyDown('enter');

    expect(hot.getDataAtCell(1, 1)).toEqual('');
  });

  it('should render nested object value in textarea after change columns order', () => {
    var hot = handsontable({
      data: [{
        name: {
          first: 'Tom',
          last: 'Kowalski',
          obj: {}
        }
      }, {
        name: {
          first: 'John',
          last: 'Cage',
          obj: {
            foo: 'bar'
          }
        }
      }],
      columns: [{
        data: 'name.last'
      }, {
        data: 'name.obj.foo'
      }],
      manualColumnMove: true
    });

    hot.getPlugin('manualColumnMove').moveColumn(1, 0);
    hot.render();

    selectCell(0, 0);
    keyDown('enter');
    expect(keyProxy().val()).toEqual('');
    keyDown('enter');

    expect(hot.getDataAtCell(0, 0)).toEqual('');

    selectCell(1, 1);
    keyDown('enter');
    expect(keyProxy().val()).toEqual('Cage');
    keyDown('enter');

    expect(hot.getDataAtCell(1, 1)).toEqual('Cage');
  });

  it('should render array value defined by columns settings in textarea', () => {
    handsontable({
      data: [
        ['', 'Kia'],
        ['2012', 10],
        ['2013', 10],
      ],
      columns: [{
        data: '1'
      }, {
        data: '0'
      }],
    });
    selectCell(0, 0);
    keyDown('enter');

    expect(keyProxy().val()).toEqual('Kia');

    selectCell(1, 1);
    keyDown('enter');

    expect(keyProxy().val()).toEqual('2012');
  });

  it('should open editor after hitting F2', () => {
    handsontable();
    selectCell(2, 2);

    var editor = $('.handsontableInput');
    expect(isEditorVisible()).toEqual(false);
    keyDown('f2');
    expect(isEditorVisible()).toEqual(true);
  });

  it('should close editor after hitting ESC', () => {
    handsontable();
    selectCell(2, 2);

    var editor = $('.handsontableInput');
    expect(isEditorVisible()).toEqual(false);
    keyDown('f2');
    expect(isEditorVisible()).toEqual(true);
    keyDown('esc');
    expect(isEditorVisible()).toEqual(false);
  });

  it('should NOT open editor after hitting CapsLock', () => {
    handsontable();
    selectCell(2, 2);

    var editor = $('.handsontableInput');
    expect(isEditorVisible()).toEqual(false);
    keyDown(Handsontable.helper.KEY_CODES.CAPS_LOCK);
    expect(isEditorVisible()).toEqual(false);
  });

  it('should open editor after cancelling edit and beginning it again', () => {
    handsontable();
    selectCell(2, 2);

    expect(isEditorVisible()).toEqual(false);
    keyDown('f2');
    expect(isEditorVisible()).toEqual(true);
    keyDown('esc');
    expect(isEditorVisible()).toEqual(false);
    keyDown('f2');
    expect(isEditorVisible()).toEqual(true);
  });

  it('loadData should not destroy editor', () => {
    handsontable();
    selectCell(2, 2);

    keyDown('f2');
    loadData(getData());

    expect(isEditorVisible()).toEqual(true);
  });

  it('updateSettings should not destroy editor', () => {
    handsontable();
    selectCell(2, 2);

    keyDown('f2');
    updateSettings({
      data: getData()
    });

    expect(isEditorVisible()).toEqual(true);
  });

  it('textarea should have cell dimensions (after render)', () => {
    var data = [
      ['a', 'b'],
      ['c', 'd']
    ];

    var hot = handsontable({
      data,
      minRows: 4,
      minCols: 4,
      minSpareRows: 4,
      minSpareCols: 4,
      enterMoves: false
    });

    selectCell(1, 1);
    var $td = getHtCore().find('tbody tr:eq(1) td:eq(1)');
    var editor = hot.getActiveEditor();
    keyDownUp('enter');
    expect(keyProxy().width()).toEqual($td.width());
    keyDownUp('enter');
    data[1][1] = 'dddddddddddddddddddd';
    render();
    keyDownUp('enter');

    expect(keyProxy().width()).toEqual($td.width());
  });

  it('global shortcuts (like CTRL+A) should be blocked when cell is being edited', () => {
    handsontable();
    selectCell(2, 2);

    keyDownUp('enter');

    keyDown(65, {
      ctrlKey: true
    }); // CTRL+A should NOT select all table when cell is edited

    var selection = getSelected();
    expect(selection).toEqual([2, 2, 2, 2]);
    expect(isEditorVisible()).toEqual(true);
  });

  it('should open editor after double clicking on a cell', (done) => {
    var hot = handsontable({
      data: Handsontable.helper.createSpreadsheetData(5, 2)
    });

    var cell = $(getCell(0, 0));
    var clicks = 0;

    window.scrollTo(0, cell.offset().top);

    setTimeout(() => {
      mouseDown(cell);
      mouseUp(cell);
      clicks++;
    }, 0);

    setTimeout(() => {
      mouseDown(cell);
      mouseUp(cell);
      clicks++;
    }, 100);

    setTimeout(() => {
      var editor = hot.getActiveEditor();

      expect(clicks).toBe(2);
      expect(editor.isOpened()).toBe(true);
      expect(editor.isInFullEditMode()).toBe(true);
      done();
    }, 200);
  });

  it('should call editor focus() method after opening an editor', () => {
    var hot = handsontable();
    selectCell(2, 2);

    var editor = hot.getActiveEditor();

    spyOn(editor, 'focus');

    expect(editor.isOpened()).toEqual(false);
    expect(editor.focus).not.toHaveBeenCalled();
    keyDown('f2');
    expect(editor.isOpened()).toEqual(true);
    expect(editor.focus).toHaveBeenCalled();
  });

  it('editor size should not exceed the viewport after text edit', function() {

    handsontable({
      data: Handsontable.helper.createSpreadsheetData(10, 5),
      width: 200,
      height: 200
    });

    selectCell(2, 2);

    keyDown('enter');

    expect(isEditorVisible()).toEqual(true);

    document.activeElement.value = 'Very very very very very very very very very very very very very very very very very long text';
    keyDownUp(32); // space - trigger textarea resize

    var $textarea = $(document.activeElement);
    var $wtHider = this.$container.find('.wtHider');

    expect($textarea.offset().left + $textarea.outerWidth()).not.toBeGreaterThan($wtHider.offset().left + this.$container.outerWidth());
    expect($textarea.offset().top + $textarea.outerHeight()).not.toBeGreaterThan($wtHider.offset().top + $wtHider.outerHeight());

  });

  it('should open editor after selecting cell in another table and hitting enter', function() {
    this.$container2 = $(`<div id="${id}-2"></div>`).appendTo('body');

    var hot1 = handsontable();
    var hot2 = handsontable2.call(this);

    this.$container.find('tbody tr:eq(0) td:eq(0)').simulate('mousedown');
    this.$container.find('tbody tr:eq(0) td:eq(0)').simulate('mouseup');

    // Open editor in HOT1
    keyDown('enter');
    var editor = $('.handsontableInputHolder');
    expect(editor.is(':visible')).toBe(true);

    // Close editor in HOT1
    keyDown('enter');
    expect(editor.is(':visible')).toBe(false);

    this.$container2.find('tbody tr:eq(0) td:eq(0)').simulate('mousedown');
    this.$container2.find('tbody tr:eq(0) td:eq(0)').simulate('mouseup');

    expect(hot1.getSelected()).toBeUndefined();
    expect(hot2.getSelected()).toEqual([0, 0, 0, 0]);

    // Open editor in HOT2
    keyDown('enter');
    editor = $('.handsontableInputHolder');
    expect(editor.is(':visible')).toBe(true);

    this.$container2.handsontable('destroy');
    this.$container2.remove();

    function handsontable2(options) {
      var container = this.$container2;
      container.handsontable(options);
      container[0].focus(); // otherwise TextEditor tests do not pass in IE8
      return container.data('handsontable');
    }

  });

  it('should open editor after pressing a printable character', function() {
    var hot = handsontable({
      data: Handsontable.helper.createSpreadsheetData(3, 3)
    });

    selectCell(0, 0);

    var editorHolder = $('.handsontableInputHolder');
    //    var editorInput = editorHolder.find('.handsontableInput');

    expect(editorHolder.is(':visible')).toBe(false);

    //    var keyboardEvent = $.Event('keydown', {
    //      keyCode: 'a'.charCodeAt(0)
    //    });

    //    this.$container.trigger(keyboardEvent);

    this.$container.simulate('keydown', {
      keyCode: 'a'.charCodeAt(0)
    });

    expect(editorHolder.is(':visible')).toBe(true);
  });

  it('should open editor after pressing a printable character with shift key', function() {
    var hot = handsontable({
      data: Handsontable.helper.createSpreadsheetData(3, 3)
    });

    selectCell(0, 0);

    var editorHolder = $('.handsontableInputHolder');

    expect(editorHolder.is(':visible')).toBe(false);

    /**
     * To reliably mimic SHIFT+SOME_KEY combination we have to trigger two events.
     * First we need to trigger keydown event with SHIFT keyCode (16)
     * and then trigger a keydown event with keyCode of SOME_KEY and shiftKey property set to true
     */
    //    var shiftKeyboardEvent = $.Event('keydown', {
    //      keyCode: 16, //shift
    //      shiftKey: true
    //    });
    //
    //    var keyboardEvent = $.Event('keydown', {
    //      keyCode: 'a'.charCodeAt(0),
    //      shiftKey: true
    //    });

    this.$container.simulate('keydown', {
      keyCode: 'a'.charCodeAt(0),
      shiftKey: true
    });

    //    this.$container.trigger(shiftKeyboardEvent);
    //    this.$container.trigger(keyboardEvent);

    expect(editorHolder.is(':visible')).toBe(true);
  });

  it('should be able to open editor after clearing cell data with DELETE', function() {
    var hot = handsontable({
      data: Handsontable.helper.createSpreadsheetData(3, 3)
    });

    selectCell(0, 0);

    var editorHolder = $('.handsontableInputHolder');

    expect(editorHolder.is(':visible')).toBe(false);

    this.$container.simulate('keydown', {
      keyCode: 46
    });

    this.$container.simulate('keydown', {
      keyCode: 'a'.charCodeAt(0)
    });
    expect(editorHolder.is(':visible')).toBe(true);
  });

  it('should be able to open editor after clearing cell data with BACKSPACE', function() {
    var hot = handsontable({
      data: Handsontable.helper.createSpreadsheetData(3, 3)
    });

    selectCell(0, 0);

    var editorHolder = $('.handsontableInputHolder');

    expect(editorHolder.is(':visible')).toBe(false);

    this.$container.simulate('keydown', {
      keyCode: 8 // backspace
    });

    this.$container.simulate('keydown', {
      keyCode: 'a'.charCodeAt(0)
    });

    expect(editorHolder.is(':visible')).toBe(true);
  });

  it('should scroll editor to a cell, if trying to edit cell that is outside of the viewport', () => {
    var hot = handsontable({
      data: Handsontable.helper.createSpreadsheetData(20, 20),
      width: 100,
      height: 50
    });

    selectCell(0, 0);

    expect(getCell(0, 0)).not.toBeNull();
    expect(getCell(19, 19)).toBeNull();

    hot.view.scrollViewport({row: 19, col: 19});
    hot.render();

    expect(getCell(0, 0)).toBeNull();
    expect(getCell(19, 19)).not.toBeNull();

    keyDown('enter');

    expect(getCell(0, 0)).not.toBeNull();
    expect(getCell(19, 19)).toBeNull();
  });

  it('should open empty editor after clearing cell value width BACKSPACE', () => {
    var hot = handsontable({
      data: Handsontable.helper.createSpreadsheetData(4, 4)
    });

    expect(getDataAtCell(0, 0)).toEqual('A1');

    selectCell(0, 0);

    keyDown(Handsontable.helper.KEY_CODES.BACKSPACE);

    expect(getDataAtCell(0, 0)).toEqual('');
    expect(hot.getActiveEditor().isOpened()).toBe(false);

    keyDown(Handsontable.helper.KEY_CODES.ENTER);

    expect(hot.getActiveEditor().isOpened()).toBe(true);
    expect(hot.getActiveEditor().getValue()).toEqual('');
  });

  it('should open empty editor after clearing cell value width DELETE', () => {
    var hot = handsontable({
      data: Handsontable.helper.createSpreadsheetData(4, 4)
    });

    expect(getDataAtCell(0, 0)).toEqual('A1');

    selectCell(0, 0);

    keyDown(Handsontable.helper.KEY_CODES.DELETE);

    expect(getDataAtCell(0, 0)).toEqual('');
    expect(hot.getActiveEditor().isOpened()).toBe(false);

    keyDown(Handsontable.helper.KEY_CODES.ENTER);

    expect(hot.getActiveEditor().isOpened()).toBe(true);
    expect(hot.getActiveEditor().getValue()).toEqual('');
  });

  it('should not open editor after hitting ALT (#1239)', () => {
    var hot = handsontable({
      data: Handsontable.helper.createSpreadsheetData(4, 4)
    });

    expect(getDataAtCell(0, 0)).toEqual('A1');

    selectCell(0, 0);

    keyDown(Handsontable.helper.KEY_CODES.ALT);

    expect(hot.getActiveEditor().isOpened()).toBe(false);

  });

  it('should open editor at the same coordinates as the edited cell', () => {
    var hot = handsontable({
      data: Handsontable.helper.createSpreadsheetData(16, 8),
      fixedColumnsLeft: 2,
      fixedRowsTop: 2
    });

    var mainHolder = hot.view.wt.wtTable.holder;

    // corner
    selectCell(1, 1);
    keyDown(Handsontable.helper.KEY_CODES.ENTER);
    var $inputHolder = $('.handsontableInputHolder');
    expect($(getCell(1, 1)).offset().left).toEqual($inputHolder.offset().left + 1);
    expect($(getCell(1, 1)).offset().top).toEqual($inputHolder.offset().top + 1);

    // top
    selectCell(1, 4);
    keyDown(Handsontable.helper.KEY_CODES.ENTER);
    expect($(getCell(1, 4)).offset().left).toEqual($inputHolder.offset().left + 1);
    expect($(getCell(1, 4)).offset().top).toEqual($inputHolder.offset().top + 1);

    // left
    selectCell(4, 1);
    keyDown(Handsontable.helper.KEY_CODES.ENTER);
    expect($(getCell(4, 1)).offset().left).toEqual($inputHolder.offset().left + 1);
    expect($(getCell(4, 1)).offset().top).toEqual($inputHolder.offset().top + 1);

    // non-fixed
    selectCell(4, 4);
    keyDown(Handsontable.helper.KEY_CODES.ENTER);
    expect($(getCell(4, 4)).offset().left).toEqual($inputHolder.offset().left + 1);
    expect($(getCell(4, 4)).offset().top).toEqual($inputHolder.offset().top + 1);

    $(mainHolder).scrollTop(1000);
  });

  it('should open editor at the same coordinates as the edited cell after the table had been scrolled (corner)', () => {
    var hot = handsontable({
      data: Handsontable.helper.createSpreadsheetData(16, 8),
      fixedColumnsLeft: 2,
      fixedRowsTop: 2
    });

    var $holder = $(hot.view.wt.wtTable.holder);

    $holder.scrollTop(100);
    $holder.scrollLeft(100);

    hot.render();

    // corner
    selectCell(1, 1);
    var currentCell = hot.getCell(1, 1, true);
    var left = $(currentCell).offset().left;
    var top = $(currentCell).offset().top;

    var $inputHolder = $('.handsontableInputHolder');
    keyDown(Handsontable.helper.KEY_CODES.ENTER);
    expect(left).toEqual($inputHolder.offset().left + 1);
    expect(top).toEqual($inputHolder.offset().top + 1);
  });

  it('should open editor at the same coordinates as the edited cell after the table had been scrolled (top)', (done) => {
    var hot = handsontable({
      data: Handsontable.helper.createSpreadsheetData(50, 50),
      fixedColumnsLeft: 2,
      fixedRowsTop: 2
    });

    var $holder = $(hot.view.wt.wtTable.holder);

    $holder[0].scrollTop = 500;

    setTimeout(() => {
      $holder[0].scrollLeft = 500;
    }, 100);

    setTimeout(() => {
      // top
      selectCell(1, 6);
    }, 200);

    setTimeout(() => {
      var currentCell = hot.getCell(1, 6, true);
      var left = $(currentCell).offset().left;
      var top = $(currentCell).offset().top;

      var $inputHolder = $('.handsontableInputHolder');
      keyDown(Handsontable.helper.KEY_CODES.ENTER);
      expect(left).toEqual($inputHolder.offset().left + 1);
      expect(top).toEqual($inputHolder.offset().top + 1);
      done();
    }, 300);
  });

  it('should open editor at the same coordinates as the edited cell after the table had been scrolled (left)', () => {
    var hot = handsontable({
      data: Handsontable.helper.createSpreadsheetData(50, 50),
      fixedColumnsLeft: 2,
      fixedRowsTop: 2
    });

    var $holder = $(hot.view.wt.wtTable.holder);

    $holder.scrollTop(500);
    $holder.scrollLeft(500);

    hot.render();

    // left
    selectCell(6, 1);
    var currentCell = hot.getCell(6, 1, true);
    var left = $(currentCell).offset().left;
    var top = $(currentCell).offset().top;

    var $inputHolder = $('.handsontableInputHolder');
    keyDown(Handsontable.helper.KEY_CODES.ENTER);
    expect(left).toEqual($inputHolder.offset().left + 1);
    expect(top).toEqual($inputHolder.offset().top + 1);
  });

  it('should open editor at the same coordinates as the edited cell after the table had been scrolled (non-fixed)', () => {
    var hot = handsontable({
      data: Handsontable.helper.createSpreadsheetData(50, 50),
      fixedColumnsLeft: 2,
      fixedRowsTop: 2
    });

    var $holder = $(hot.view.wt.wtTable.holder);

    $holder.scrollTop(500);
    $holder.scrollLeft(500);

    hot.render();

    // non-fixed
    selectCell(7, 7);
    var currentCell = hot.getCell(7, 7, true);
    var left = $(currentCell).offset().left;
    var top = $(currentCell).offset().top;

    var $inputHolder = $('.handsontableInputHolder');
    keyDown(Handsontable.helper.KEY_CODES.ENTER);
    expect(left).toEqual($inputHolder.offset().left + 1);
    expect(top).toEqual($inputHolder.offset().top + 1);
  });

  it('should display editor with the proper size, when the edited column is beyond the tables container', function() {
    this.$container.css('overflow', '');
    var hot = handsontable({
      data: Handsontable.helper.createSpreadsheetData(3, 9)
    });

    selectCell(0, 7);
    keyDown(Handsontable.helper.KEY_CODES.ENTER);

    expect(Handsontable.dom.outerWidth(hot.getActiveEditor().TEXTAREA)).toBeAroundValue(Handsontable.dom.outerWidth(hot.getCell(0, 7)));
  });

  it('should display editor with the proper size, when editing a last row after the table is scrolled to the bottom', () => {
    var hot = handsontable({
      data: Handsontable.helper.createSpreadsheetData(3, 8),
      minSpareRows: 1,
      height: 100
    });

    selectCell(0, 2);
    keyDown(Handsontable.helper.KEY_CODES.ENTER);
    var regularHeight = Handsontable.dom.outerHeight(hot.getActiveEditor().TEXTAREA);

    selectCell(3, 2);
    keyDown(Handsontable.helper.KEY_CODES.ENTER);
    keyDown(Handsontable.helper.KEY_CODES.ENTER);
    keyDown(Handsontable.helper.KEY_CODES.ENTER);

    // lame check, needs investigating why sometimes it leaves 2px error
    if (Handsontable.dom.outerHeight(hot.getActiveEditor().TEXTAREA) == regularHeight) {
      expect(Handsontable.dom.outerHeight(hot.getActiveEditor().TEXTAREA)).toEqual(regularHeight);
    } else {
      expect(Handsontable.dom.outerHeight(hot.getActiveEditor().TEXTAREA)).toEqual(regularHeight - 2);
    }

  });

  it('should render the text without trimming out the whitespace, if trimWhitespace is set to false', function() {
    this.$container.css('overflow', '');
    var hot = handsontable({
      data: Handsontable.helper.createSpreadsheetData(3, 9),
      trimWhitespace: false
    });

    selectCell(0, 2);
    keyDown(Handsontable.helper.KEY_CODES.ENTER);
    hot.getActiveEditor().TEXTAREA.value = '       test    of    whitespace      ';
    keyDown(Handsontable.helper.KEY_CODES.ENTER);

    expect(getDataAtCell(0, 2).length).toEqual(37);
  });

  it('should insert new line on caret position when pressing ALT + ENTER', () => {
    var data = [
      ['Maserati', 'Mazda'],
      ['Honda', 'Mini']
    ];

    var hot = handsontable({
      data
    });

    selectCell(0, 0);
    keyDown(Handsontable.helper.KEY_CODES.ENTER);

    var $editorInput = $('.handsontableInput');

    Handsontable.dom.setCaretPosition($editorInput[0], 2);

    $editorInput.simulate('keydown', {
      altKey: true,
      keyCode: Handsontable.helper.KEY_CODES.ENTER
    });

    expect(hot.getActiveEditor().TEXTAREA.value).toEqual('Ma\nserati');
  });

  it('should be displayed and resized properly, so it doesn\'t exceed the viewport dimensions', () => {
    var data = [
      ['', '', '', '', ''],
      ['', 'The Dude abides. I don\'t know about you but I take comfort in that. It\'s good knowin\' he\'s out there. The ' +
           'Dude. Takin\' \'er easy for all us sinners. Shoosh. I sure hope he makes the finals.', '', '', ''],
      ['', '', '', '', '']
    ];

    var hot = handsontable({
      data,
      colWidths: 40,
      width: 300,
      height: 200,
      minSpareRows: 20,
      minSpareCols: 20
    });

    selectCell(1, 1);
    keyDown(Handsontable.helper.KEY_CODES.ENTER);

    var $editorInput = $('.handsontableInput');
    var $editedCell = $(hot.getCell(1, 1));

    expect($editorInput.outerWidth()).toEqual(hot.view.wt.wtTable.holder.clientWidth - $editedCell.position().left + 1);

    hot.view.wt.scrollHorizontal(3);
    hot.render();

    expect($editorInput.width() + $editorInput.offset().left).toBeLessThan(hot.view.wt.wtTable.holder.clientWidth);
  });

  it('should resize editor to properly size after focus', (done) => {
    var data = [
      ['', '', '', '', '', '', '', '', '', '', ''],
      ['', '', '', '', '', '', '', '', '', '', ''],
      ['', '', '', '', '', '', '', '', '', '', ''],
      ['', '', '', '', '', '', '', '', '', '', ''],
      ['', '', '', '', '', '', '', '', '', '', 'sadiasdoadoajdoasjdoij doi ajdoiasjdasoidasoid'],
      ['', '', '', '', '', '', '', '', '', '', ''],
      ['', '', '', '', '', '', '', '', '', '', ''],
      ['', '', '', '', '', '', '', '', '', '', ''],
      ['', '', '', '', '', '', '', '', '', '', ''],
      ['', '', '', '', '', '', '', '', '', '', ''],
    ];
    var hot = handsontable({
      data,
      colWidths: 40,
      rowHeights: 25,
      width: 500,
      height: 220
    });

    selectCell(4, 10);
    keyDown(Handsontable.helper.KEY_CODES.ENTER);

    var $editorInput = $('.handsontableInput');

    setTimeout(() => {
      expect([105, 119]).toEqual(jasmine.arrayContaining([$editorInput.height()]));
      done();
    }, 150);
  });
});