module('DOM integration'); test('adding a new unselected option changes nothing', function (assert) { // Any browsers which support mutation observers will not trigger the event var expected = 4; if (window.MutationObserver) { expected = 2; } else if (!window.addEventListener) { expected = 2; } assert.expect(expected); var asyncDone = null; var syncDone = assert.async(); if (expected != 2) { asyncDone = assert.async(); } var $ = require('jquery'); var Options = require('select2/options'); var Select2 = require('select2/core'); var $select = $( '' ); $('#qunit-fixture').append($select); var select = new Select2($select); select.on('selection:update', function (args) { assert.equal( args.data.length, 1, 'There was more than one selection' ); assert.equal( args.data[0].id, 'One', 'The selection changed to something other than One' ); if (expected != 2) { asyncDone(); } }); assert.equal( $select.val(), 'One' ); var $option = $(''); $select.append($option); assert.equal( $select.val(), 'One' ); syncDone(); }); test('adding a new selected option changes the value', function (assert) { // handle IE 8 not being supported var expected = 4; if (!window.MutationObserver && !window.addEventListener) { expected = 2; } assert.expect(expected); var asyncDone = null; var syncDone = assert.async(); if (expected != 2) { asyncDone = assert.async(); } var $ = require('jquery'); var Options = require('select2/options'); var Select2 = require('select2/core'); var $select = $( '' ); $('#qunit-fixture').append($select); var select = new Select2($select); select.on('selection:update', function (args) { assert.equal( args.data.length, 1, 'There was more than one selection' ); assert.equal( args.data[0].id, 'Three', 'The selection did not change to Three' ); if (expected != 2) { asyncDone(); } }); assert.equal( $select.val(), 'One' ); var $option = $(''); $select.append($option); assert.equal( $select.val(), 'Three' ); syncDone(); }); test('removing an unselected option changes nothing', function (assert) { // Any browsers which support mutation observers will not trigger the event var expected = 4; if (!window.MutationObserver && !window.addEventListener) { expected = 2; } assert.expect(expected); var asyncDone = null; var syncDone = assert.async(); if (expected != 2) { asyncDone = assert.async(); } var $ = require('jquery'); var Options = require('select2/options'); var Select2 = require('select2/core'); var $select = $( '' ); $('#qunit-fixture').append($select); var select = new Select2($select); select.on('selection:update', function (args) { assert.equal( args.data.length, 1, 'There was more than one selection' ); assert.equal( args.data[0].id, 'One', 'The selection changed to something other than One' ); if (expected != 2) { asyncDone(); } }); assert.equal( $select.val(), 'One' ); $select.children().eq(1).remove(); assert.equal( $select.val(), 'One' ); syncDone(); }); test('removing a selected option changes the value', function (assert) { // handle IE 8 not being supported var expected = 3; if (!window.MutationObserver && !window.addEventListener) { expected = 2; } assert.expect(expected); var asyncDone = null; var syncDone = assert.async(); if (expected != 2) { asyncDone = assert.async(); } var $ = require('jquery'); var Options = require('select2/options'); var Select2 = require('select2/core'); var $select = $( '' ); $('#qunit-fixture').append($select); var select = new Select2($select); select.on('selection:update', function (args) { assert.equal( args.data.length, 1, 'There was more than one selection' ); if (expected != 2) { asyncDone(); } }); assert.equal( $select.val(), 'One' ); $select.children().eq(0).remove(); assert.equal( $select.val(), 'Two' ); syncDone(); }); test('searching tags does not loose focus', function (assert) { assert.expect(1); var asyncDone = assert.async(); var $ = require('jquery'); var Options = require('select2/options'); var Select2 = require('select2/core'); var $select = $( '' ); $('#qunit-fixture').append($select); var select = new Select2($select, {tags: true}); var inputEl = select.selection.$search[0]; inputEl.focus(); select.on('selection:update', function() { assert.equal(document.activeElement, inputEl); asyncDone(); }); select.selection.trigger('query', {term: 'f'}); select.selection.trigger('query', {term: 'ff'}); });