123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387 |
- describe('Comments', function () {
- var id = 'testContainer';
- beforeEach(function () {
- this.$container = $('<div id="' + id + '"></div>').appendTo('body');
- });
- afterEach(function () {
- if (this.$container) {
- destroy();
- this.$container.remove();
- }
- });
- describe('Enabling the plugin', function () {
- it('should enable the plugin in the initial config', function () {
- var hot = handsontable({
- data: Handsontable.helper.createSpreadsheetData(4, 4),
- comments: true
- });
- expect(hot.getPlugin('comments').isEnabled()).toBe(true);
- });
- it('should enable the plugin using updateSettings', function () {
- var hot = handsontable({
- data: Handsontable.helper.createSpreadsheetData(4, 4)
- });
- expect(hot.getPlugin('comments').isEnabled()).toBe(false);
- updateSettings({
- comments: true
- });
- expect(hot.getPlugin('comments').isEnabled()).toBe(true);
- });
- });
- describe('Styling', function () {
- it('should display comment indicators in the appropriate cells', function () {
- var hot = handsontable({
- data: Handsontable.helper.createSpreadsheetData(4, 4),
- comments: true,
- cell: [{ row: 1, col: 1, comment: { value: 'test' } }, { row: 2, col: 2, comment: { value: 'test' } }]
- });
- expect(getCell(1, 1).className.indexOf('htCommentCell')).toBeGreaterThan(-1);
- expect(getCell(2, 2).className.indexOf('htCommentCell')).toBeGreaterThan(-1);
- });
- });
- describe('API', function () {
- it('should return the comment from a proper cell, when using the getCommentAtCell method', function () {
- var hot = handsontable({
- data: Handsontable.helper.createSpreadsheetData(4, 4),
- comments: true,
- cell: [{ row: 1, col: 1, comment: { value: 'test' } }, { row: 2, col: 2, comment: { value: 'another test' } }]
- });
- var plugin = hot.getPlugin('comments');
- expect(plugin.getCommentAtCell(1, 1)).toEqual('test');
- expect(plugin.getCommentAtCell(2, 2)).toEqual('another test');
- });
- it('should return the comment from a proper cell, when using the setRange and getComment methods', function () {
- var hot = handsontable({
- data: Handsontable.helper.createSpreadsheetData(4, 4),
- comments: true,
- cell: [{ row: 1, col: 1, comment: { value: 'test' } }, { row: 2, col: 2, comment: { value: 'another test' } }]
- });
- var plugin = hot.getPlugin('comments');
- plugin.setRange({ from: { row: 1, col: 1 } });
- expect(plugin.getComment()).toEqual('test');
- plugin.setRange({ from: { row: 2, col: 2 } });
- expect(plugin.getComment()).toEqual('another test');
- });
- it('should allow inserting comments using the `setCommentAtCell` method', function () {
- var hot = handsontable({
- data: Handsontable.helper.createSpreadsheetData(4, 4),
- comments: true
- });
- var plugin = hot.getPlugin('comments');
- expect(getCellMeta(1, 1).comment).toEqual(void 0);
- plugin.setCommentAtCell(1, 1, 'test comment');
- expect(getCellMeta(1, 1).comment.value).toEqual('test comment');
- });
- it('should trigger `afterSetCellMeta` callback when `setCommentAtCell` function is invoked', function () {
- var afterSetCellMetaCallback = jasmine.createSpy('afterSetCellMetaCallback');
- var hot = handsontable({
- data: Handsontable.helper.createSpreadsheetData(4, 4),
- comments: true,
- afterSetCellMeta: afterSetCellMetaCallback
- });
- var plugin = hot.getPlugin('comments');
- plugin.setCommentAtCell(1, 1, 'Added comment');
- expect(afterSetCellMetaCallback).toHaveBeenCalledWith(1, 1, 'comment', { value: 'Added comment' }, undefined, undefined);
- });
- it('should allow removing comments using the `removeCommentAtCell` method', function () {
- var hot = handsontable({
- data: Handsontable.helper.createSpreadsheetData(4, 4),
- comments: true,
- cell: [{ row: 1, col: 1, comment: { value: 'test' } }]
- });
- var plugin = hot.getPlugin('comments');
- expect(getCellMeta(1, 1).comment.value).toEqual('test');
- plugin.removeCommentAtCell(1, 1);
- expect(getCellMeta(1, 1).comment).toEqual(void 0);
- });
- it('should trigger `afterSetCellMeta` callback when `removeCommentAtCell` function is invoked', function () {
- var afterSetCellMetaCallback = jasmine.createSpy('afterSetCellMetaCallback');
- var hot = handsontable({
- data: Handsontable.helper.createSpreadsheetData(4, 4),
- comments: true,
- cell: [{ row: 1, col: 1, comment: { value: 'test' } }],
- afterSetCellMeta: afterSetCellMetaCallback
- });
- var plugin = hot.getPlugin('comments');
- plugin.removeCommentAtCell(1, 1);
- expect(afterSetCellMetaCallback).toHaveBeenCalledWith(1, 1, 'comment', undefined, undefined, undefined);
- });
- it('should allow opening the comment editor using the `showAtCell` method', function () {
- var hot = handsontable({
- data: Handsontable.helper.createSpreadsheetData(4, 4),
- comments: true
- });
- var plugin = hot.getPlugin('comments');
- var editor = plugin.editor.getInputElement();
- expect(editor.parentNode.style.display).toEqual('none');
- plugin.showAtCell(1, 1);
- expect(editor.parentNode.style.display).toEqual('block');
- });
- it('should allow closing the comment editor using the `hide` method', function () {
- var hot = handsontable({
- data: Handsontable.helper.createSpreadsheetData(4, 4),
- comments: true
- });
- var plugin = hot.getPlugin('comments');
- var editor = plugin.editor.getInputElement();
- plugin.showAtCell(1, 1);
- expect(editor.parentNode.style.display).toEqual('block');
- plugin.hide();
- expect(editor.parentNode.style.display).toEqual('none');
- });
- });
- it('`updateCommentMeta` & `setComment` functions should extend cellMetaObject properly', function () {
- var comment, readOnly;
- var hot = handsontable({
- data: Handsontable.helper.createSpreadsheetData(4, 4),
- comments: true
- });
- var plugin = hot.getPlugin('comments');
- setCellMeta(0, 0, 'comment', { readOnly: true });
- plugin.updateCommentMeta(0, 0, { value: 'Test' });
- comment = getCellMeta(0, 0).comment;
- readOnly = comment && comment.readOnly;
- expect(readOnly).toEqual(true);
- plugin.setRange({ from: { row: 0, col: 0 }, to: { row: 0, col: 0 } });
- plugin.setComment('Test2');
- comment = getCellMeta(0, 0).comment;
- readOnly = comment && comment.readOnly;
- expect(readOnly).toEqual(true);
- });
- describe('Using the Context Menu', function () {
- it('should open the comment editor when clicking the "Add comment" entry', function () {
- var hot = handsontable({
- data: Handsontable.helper.createSpreadsheetData(4, 4),
- contextMenu: true,
- comments: true
- });
- selectCell(1, 1);
- contextMenu();
- var addCommentButton = $('.htItemWrapper').filter(function () {
- return $(this).text() === 'Add comment';
- })[0];
- $(addCommentButton).simulate('mousedown');
- var editor = hot.getPlugin('comments').editor.getInputElement();
- expect($(editor).parents('.htComments')[0].style.display).toEqual('block');
- });
- it('should remove the comment from a cell after clicking the "Delete comment" entry', function () {
- var hot = handsontable({
- data: Handsontable.helper.createSpreadsheetData(4, 4),
- contextMenu: true,
- comments: true,
- cell: [{ row: 1, col: 1, comment: { value: 'Test comment' } }]
- });
- expect(getCellMeta(1, 1).comment.value).toEqual('Test comment');
- selectCell(1, 1);
- contextMenu();
- var deleteCommentButton = $('.htItemWrapper').filter(function () {
- return $(this).text() === 'Delete comment';
- })[0];
- $(deleteCommentButton).simulate('mousedown');
- expect(getCellMeta(1, 1).comment).toEqual(void 0);
- });
- it('should remove comments from a selected group of cells after clicking the "Delete comment" entry', function () {
- var hot = handsontable({
- data: Handsontable.helper.createSpreadsheetData(4, 4),
- contextMenu: true,
- comments: true,
- cell: [{ row: 1, col: 1, comment: { value: 'Test comment' } }, { row: 2, col: 2, comment: { value: 'Test comment 2' } }]
- });
- expect(getCellMeta(1, 1).comment.value).toEqual('Test comment');
- expect(getCellMeta(2, 2).comment.value).toEqual('Test comment 2');
- selectCell(1, 1, 2, 2);
- contextMenu();
- var deleteCommentButton = $('.htItemWrapper').filter(function () {
- return $(this).text() === 'Delete comment';
- })[0];
- $(deleteCommentButton).simulate('mousedown');
- expect(getCellMeta(1, 1).comment).toEqual(void 0);
- expect(getCellMeta(2, 2).comment).toEqual(void 0);
- });
- it('should make the comment editor\'s textarea read-only after clicking the "Read only comment" entry', function (done) {
- var hot = handsontable({
- data: Handsontable.helper.createSpreadsheetData(4, 4),
- contextMenu: true,
- comments: true,
- cell: [{ row: 1, col: 1, comment: { value: 'Test comment' } }]
- });
- selectCell(1, 1);
- contextMenu();
- var editor = hot.getPlugin('comments').editor.getInputElement();
- expect($(editor)[0].readOnly).toBe(false);
- var readOnlyComment = $('.htItemWrapper').filter(function () {
- return $(this).text() === 'Read only comment';
- })[0];
- $(readOnlyComment).simulate('mousedown');
- $(document).simulate('mouseup');
- $(getCell(1, 1)).simulate('mouseover', {
- clientX: Handsontable.dom.offset(getCell(1, 1)).left + 5,
- clientY: Handsontable.dom.offset(getCell(1, 1)).top + 5
- });
- setTimeout(function () {
- expect($(editor)[0].readOnly).toBe(true);
- done();
- }, 550);
- });
- });
- describe('Hooks invoked after changing cell meta', function () {
- it('should trigger `afterSetCellMeta` callback after deleting comment by context menu', function () {
- var afterSetCellMetaCallback = jasmine.createSpy('afterSetCellMetaCallback');
- var rows = 10,
- columns = 10;
- handsontable({
- data: Handsontable.helper.createSpreadsheetData(rows, columns),
- rowHeaders: true,
- colHeaders: true,
- contextMenu: true,
- comments: true,
- columns: function columns() {
- return {
- comment: {
- value: 'test'
- }
- };
- },
- afterSetCellMeta: afterSetCellMetaCallback
- });
- expect(afterSetCellMetaCallback).not.toHaveBeenCalled();
- selectCell(1, 1);
- contextMenu();
- var deleteCommentButton = $('.htItemWrapper').filter(function () {
- return $(this).text() === 'Delete comment';
- })[0];
- $(deleteCommentButton).simulate('mousedown');
- expect(afterSetCellMetaCallback).toHaveBeenCalledWith(1, 1, 'comment', undefined, undefined, undefined);
- });
- // Don't work in PhantomJS
- // It will work probably when #3961 will be fixed
- xit('should trigger `afterSetCellMeta` callback after editing comment by context menu', function (done) {
- var afterSetCellMetaCallback = jasmine.createSpy('afterSetCellMetaCallback');
- var rows = 10,
- columns = 10;
- handsontable({
- data: Handsontable.helper.createSpreadsheetData(rows, columns),
- rowHeaders: true,
- colHeaders: true,
- contextMenu: true,
- comments: true,
- columns: function columns() {
- return {
- comment: {
- value: 'test'
- }
- };
- },
- afterSetCellMeta: afterSetCellMetaCallback
- });
- selectCell(0, 0);
- contextMenu();
- var editCommentButton = $('.htItemWrapper').filter(function () {
- return $(this).text() === 'Edit comment';
- })[0];
- $(editCommentButton).simulate('mousedown');
- setTimeout(function () {
- $('.htCommentTextArea').val('Edited comment');
- // changing focus
- $('body').simulate('mousedown');
- setTimeout(function () {
- expect(afterSetCellMetaCallback).toHaveBeenCalledWith(0, 0, 'comment', { value: 'Edited comment' }, undefined, undefined);
- done();
- }, 100);
- }, 100);
- });
- });
- });
|