(function() { var click = function(el, cb) { syn.click(el).delay(350, cb); }; // These tests are functional simulations of // user interaction, using syn.js. For more information: // // @see http://v3.javascriptmvc.com/docs.html#&who=syn // @see http://bitovi.com/blog/2010/07/syn-a-standalone-synthetic-event-library.html describe('Interaction', function() { it('should keep dropdown open after selection made if closeAfterSelect: false', function(done) { var test = setup_test('', {}); click(test.selectize.$control, function() { click($('[data-value=a]', test.selectize.$dropdown_content), function() { expect(test.selectize.isOpen).to.be.equal(true); expect(test.selectize.isFocused).to.be.equal(true); done(); }); }); }); it('should close dropdown after selection made if closeAfterSelect: true', function(done) { var test = setup_test('', {closeAfterSelect: true}); click(test.selectize.$control, function() { click($('[data-value=a]', test.selectize.$dropdown_content), function() { expect(test.selectize.isOpen).to.be.equal(false); expect(test.selectize.isFocused).to.be.equal(true); done(); }); }); }); describe('clicking control', function() { it('should give it focus', function(done) { var test = setup_test('', {}); click(test.selectize.$control, function() { expect(test.selectize.isFocused).to.be.equal(true); done(); }); }); it('should start loading results if preload:"focus"', function(done) { var calls_focus = 0; var calls_load = 0; var test = setup_test('', { preload: 'focus', load: function(query, done) { calls_load++; assert.equal(query, ''); setTimeout(function() { done([{value: 'c', text: 'C'}]); }); } }); test.selectize.on('focus', function() { calls_focus++; }); click(test.selectize.$control, function() { setTimeout(function() { assert.equal(calls_focus, 1); assert.equal(calls_load, 1); done(); }, 300); }); }); it('should open dropdown menu', function(done) { var test = setup_test('', {}); click(test.selectize.$control, function() { expect(test.selectize.isOpen).to.be.equal(true); expect(test.selectize.$dropdown.is(':visible')).to.be.equal(true); done(); }); }); }); describe('clicking option', function() { it('should select it', function(done) { var test = setup_test('', {}); click(test.selectize.$control, function() { click($('[data-value="b"]', test.selectize.$dropdown), function() { expect(test.selectize.$input.val()).to.be.equal('b'); expect(test.selectize.$input.text()).to.be.equal('B'); done(); }); }); }); it('should close dropdown', function(done) { var test = setup_test('', {}); click(test.selectize.$control, function() { click($('[data-value="b"]', test.selectize.$dropdown), function() { expect(test.selectize.isOpen).to.be.equal(false); expect(test.selectize.$dropdown.is(':visible')).to.be.equal(false); done(); }); }); }); }); describe('typing in input', function() { it('should filter results', function(done) { var test = setup_test('', {}); click(test.selectize.$control, function() { syn.type('a', test.selectize.$control_input) .delay(0, function() { expect($('[data-value="a"]', test.selectize.$dropdown).length).to.be.equal(1); expect($('[data-value="b"]', test.selectize.$dropdown).length).to.be.equal(0); done(); }); }); }); it('should hide dropdown if no results present', function(done) { var test = setup_test('', {}); click(test.selectize.$control, function() { syn.type('awaw', test.selectize.$control_input) .delay(0, function() { expect(test.selectize.isOpen).to.be.equal(false); expect(test.selectize.$dropdown.is(':visible')).to.be.equal(false); done(); }); }); }); it('should not hide dropdown if "create" option enabled and no results present', function(done) { var test = setup_test('', {create: true}); click(test.selectize.$control, function() { syn.type('awaw', test.selectize.$control_input) .delay(0, function() { expect(test.selectize.isOpen).to.be.equal(true); expect(test.selectize.$dropdown.is(':visible')).to.be.equal(true); done(); }); }); }); it('should restore dropdown visibility when backing out of a query without results (backspace)', function(done) { var test = setup_test('', {}); click(test.selectize.$control, function() { syn.type('awf', test.selectize.$control_input) .type('\b\b\b', test.selectize.$control_input) .delay(0, function() { expect(test.selectize.isOpen).to.be.equal(true); expect(test.selectize.$dropdown.is(':visible')).to.be.equal(true); done(); }); }); }); it('should move caret when [left] or [right] pressed', function(done) { var test = setup_test('', {create: true}); click(test.selectize.$control, function() { syn.type('[left][left]whatt', test.selectize.$control_input) .delay(0, function() { expect(test.selectize.caretPos).to.be.equal(2); done(); }); }); }); it('should not create input if comma entered in single select mode', function(done) { var test = setup_test('', {create: true}); click(test.selectize.$control, function() { syn.type('asdf,asdf', test.selectize.$control_input) .delay(0, function() { expect(test.selectize.isOpen).to.be.equal(true); expect(test.selectize.options).to.not.have.property('asdf'); done(); }); }); }); }); describe('blurring the input', function() { it('should close dropdown when createOnBlur is true', function(done) { var test = setup_test('', { createOnBlur: true, create: function(value){ return { value: value, text: value }; } }); click(test.selectize.$control, function() { syn .type('fooo', test.selectize.$control_input) .delay(0, function() { expect(test.selectize.isOpen).to.be.equal(true); expect(test.selectize.$dropdown.is(':visible')).to.be.equal(true); syn .click($("body")) .delay(5, function() { expect(test.selectize.isOpen).to.be.equal(false); expect(test.selectize.$dropdown.is(':visible')).to.be.equal(false); done(); }); }); }); }); }); describe('filtering created items', function() { function createFilterTest(createFilter) { return setup_test('', {create: true, createFilter: createFilter}); } var text = 'abc'; function execFilterTest(test, done, expectation) { var selectize = test.selectize; click(selectize.$control, function() { syn .type(text, selectize.$control_input) .type(selectize.settings.delimiter, selectize.$control_input) .delay(0, function() { expectation(selectize); done(); }) }); } function execFilterTests(heading, filters, expectation) { for (var i = 0; i < filters.length; i++) { (function(filter) { it(heading, function(done) { execFilterTest(createFilterTest(filter), done, expectation); }); })(filters[i]); } } execFilterTests('should add an item normally if there is no createFilter', [undefined, null, ''], function(selectize) { expect(selectize.getItem(text).length).to.be.equal(1); }); execFilterTests('should add an item if the input matches the createFilter', ['a', /a/, function() { return true; }], function(selectize) { expect(selectize.getItem(text).length).to.be.equal(1); }); execFilterTests('should not add an item or display the create label if the input does not match the createFilter', ['foo', /foo/, function() { return false; }], function(selectize) { expect(selectize.getItem(text).length).to.be.equal(0); expect($(selectize.$dropdown_content).filter('.create').length).to.be.equal(0); }); }); }); })();