123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277 |
- describe('SelectEditor', () => {
- var id = 'testContainer';
- beforeEach(function() {
- this.$container = $(`<div id="${id}"></div>`).appendTo('body');
- });
- afterEach(function() {
- if (this.$container) {
- destroy();
- this.$container.remove();
- }
- });
- it('should display select', () => {
- handsontable({
- columns: [
- {
- editor: 'select'
- }
- ]
- });
- selectCell(0, 0);
- var editor = $('.htSelectEditor');
- expect(editor.length).toEqual(1);
- expect(editor.is('select')).toBe(true);
- expect(editor.is(':visible')).toBe(false);
- keyDown('enter');
- expect(editor.is(':visible')).toBe(true);
- expect(editor.offset()).toEqual($(getCell(0, 0)).offset());
- });
- it('should display and correctly reposition select editor while scrolling', (done) => {
- var hot = handsontable({
- width: 200,
- height: 200,
- data: Handsontable.helper.createSpreadsheetData(100, 100),
- columns: [
- {
- editor: 'select'
- }, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {editor: 'select'}
- ]
- });
- var mainHolder = hot.view.wt.wtTable.holder;
- selectCell(0, 0);
- keyDown('enter');
- keyUp('enter');
- mainHolder.scrollTop = 10;
- mainHolder.scrollLeft = 20;
- var editor = $('.htSelectEditor');
- setTimeout(() => {
- expect(editor.css('top')).toEqual('-10px');
- expect(editor.css('left')).toEqual('-20px');
- done();
- }, 200);
- });
- it('should populate select with given options (array)', () => {
- var options = [
- 'Misubishi', 'Chevrolet', 'Lamborgini'
- ];
- handsontable({
- columns: [
- {
- editor: 'select',
- selectOptions: options
- }
- ]
- });
- selectCell(0, 0);
- var editor = $('.htSelectEditor');
- keyDown('enter');
- var $options = editor.find('option');
- expect($options.length).toEqual(options.length);
- expect($options.eq(0).val()).toMatch(options[0]);
- expect($options.eq(0).html()).toMatch(options[0]);
- expect($options.eq(1).val()).toMatch(options[1]);
- expect($options.eq(1).html()).toMatch(options[1]);
- expect($options.eq(2).val()).toMatch(options[2]);
- expect($options.eq(2).html()).toMatch(options[2]);
- });
- it('should populate select with given options (object)', () => {
- var options = {
- mit: 'Misubishi',
- che: 'Chevrolet',
- lam: 'Lamborgini'
- };
- handsontable({
- columns: [
- {
- editor: 'select',
- selectOptions: options
- }
- ]
- });
- selectCell(0, 0);
- var editor = $('.htSelectEditor');
- keyDown('enter');
- var $options = editor.find('option');
- expect($options.eq(0).val()).toMatch('mit');
- expect($options.eq(0).html()).toMatch(options.mit);
- expect($options.eq(1).val()).toMatch('che');
- expect($options.eq(1).html()).toMatch(options.che);
- expect($options.eq(2).val()).toMatch('lam');
- expect($options.eq(2).html()).toMatch(options.lam);
- });
- it('should populate select with given options (function:array)', () => {
- var options = function() {
- return [
- 'Misubishi', 'Chevrolet', 'Lamborgini'
- ];
- };
- handsontable({
- columns: [
- {
- editor: 'select',
- selectOptions: options
- }
- ]
- });
- selectCell(0, 0);
- var editor = $('.htSelectEditor');
- keyDown('enter');
- var $options = editor.find('option');
- expect($options.length).toEqual(options().length);
- expect($options.eq(0).val()).toMatch(options()[0]);
- expect($options.eq(0).html()).toMatch(options()[0]);
- expect($options.eq(1).val()).toMatch(options()[1]);
- expect($options.eq(1).html()).toMatch(options()[1]);
- expect($options.eq(2).val()).toMatch(options()[2]);
- expect($options.eq(2).html()).toMatch(options()[2]);
- });
- it('should populate select with given options (function:object)', () => {
- var options = function() {
- return {
- mit: 'Misubishi',
- che: 'Chevrolet',
- lam: 'Lamborgini'
- };
- };
- handsontable({
- columns: [
- {
- editor: 'select',
- selectOptions: options
- }
- ]
- });
- selectCell(0, 0);
- var editor = $('.htSelectEditor');
- keyDown('enter');
- var $options = editor.find('option');
- expect($options.eq(0).val()).toMatch('mit');
- expect($options.eq(0).html()).toMatch(options().mit);
- expect($options.eq(1).val()).toMatch('che');
- expect($options.eq(1).html()).toMatch(options().che);
- expect($options.eq(2).val()).toMatch('lam');
- expect($options.eq(2).html()).toMatch(options().lam);
- });
- it('should mark option matching cell value as selected', () => {
- var options = [
- 'Misubishi', 'Chevrolet', 'Lamborgini'
- ];
- handsontable({
- data: [
- ['Misubishi'],
- ['Lamborgini'],
- ['Chevrolet']
- ],
- columns: [
- {
- editor: 'select',
- selectOptions: options
- }
- ]
- });
- selectCell(0, 0);
- var editor = $('.htSelectEditor');
- keyDown('enter');
- expect(editor.find('option:selected').text()).toEqual(getDataAtCell(0, 0));
- keyDown('enter');
- selectCell(1, 0);
- keyDown('enter');
- expect(editor.find('option:selected').text()).toEqual(getDataAtCell(1, 0));
- keyDown('enter');
- selectCell(2, 0);
- keyDown('enter');
- expect(editor.find('option:selected').text()).toEqual(getDataAtCell(2, 0));
- keyDown('enter');
- });
- it('should not prevent the default event action when select is clicked', () => {
- var options = function() {
- return [
- 'Misubishi', 'Chevrolet', 'Lamborgini'
- ];
- };
- handsontable({
- columns: [
- {
- editor: 'select',
- selectOptions: options
- }
- ]
- });
- selectCell(0, 0);
- var editor = $('.htSelectEditor');
- keyDown('enter');
- var select = editor.find('select');
- var selectMouseDownListener = jasmine.createSpy('selectMouseDownListener');
- $('body').on('mousedown', selectMouseDownListener);
- editor.mousedown();
- expect(selectMouseDownListener.calls.count()).toEqual(1);
- var event = selectMouseDownListener.calls.argsFor(0)[0];
- expect(event).toBeDefined();
- expect(event.isDefaultPrevented()).toBe(false);
- });
- });
|