diff options
Diffstat (limited to 'js/tests/unit')
| -rw-r--r-- | js/tests/unit/button.js | 22 | ||||
| -rw-r--r-- | js/tests/unit/carousel.js | 36 | ||||
| -rw-r--r-- | js/tests/unit/dom/eventHandler.js | 239 | ||||
| -rw-r--r-- | js/tests/unit/modal.js | 49 |
4 files changed, 289 insertions, 57 deletions
diff --git a/js/tests/unit/button.js b/js/tests/unit/button.js index fff6df5bc..c162e3a9f 100644 --- a/js/tests/unit/button.js +++ b/js/tests/unit/button.js @@ -107,17 +107,17 @@ $(function () { QUnit.test('should check for closest matching toggle', function (assert) { assert.expect(12) var groupHTML = - '<div class="btn-group" data-toggle="buttons">' - + ' <label class="btn btn-primary active">' - + ' <input type="radio" name="options" id="option1" checked="true"> Option 1' - + ' </label>' - + ' <label class="btn btn-primary">' - + ' <input type="radio" name="options" id="option2"> Option 2' - + ' </label>' - + ' <label class="btn btn-primary">' - + ' <input type="radio" name="options" id="option3"> Option 3' - + ' </label>' - + '</div>' + '<div class="btn-group" data-toggle="buttons">' + + ' <label class="btn btn-primary active">' + + ' <input type="radio" name="options" id="option1" checked="true"> Option 1' + + ' </label>' + + ' <label class="btn btn-primary">' + + ' <input type="radio" name="options" id="option2"> Option 2' + + ' </label>' + + ' <label class="btn btn-primary">' + + ' <input type="radio" name="options" id="option3"> Option 3' + + ' </label>' + + '</div>' var $group = $(groupHTML).appendTo('#qunit-fixture') diff --git a/js/tests/unit/carousel.js b/js/tests/unit/carousel.js index 615318ad3..fd9cf8509 100644 --- a/js/tests/unit/carousel.js +++ b/js/tests/unit/carousel.js @@ -619,13 +619,9 @@ $(function () { assert.strictEqual($template.find('.carousel-item')[1], $template.find('.active')[0], 'second item active') -<<<<<<< HEAD - $template.trigger($.Event('keydown', { + EventHandler.trigger($template[0], 'keydown', { which: 37 - })) -======= - EventHandler.trigger($template[0], 'keydown', { which: 37 }) ->>>>>>> fix unit test for carousel + }) assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item active') }) @@ -651,13 +647,9 @@ $(function () { assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item active') -<<<<<<< HEAD - $template.trigger($.Event('keydown', { + EventHandler.trigger($template[0], 'keydown', { which: 39 - })) -======= - EventHandler.trigger($template[0], 'keydown', { which: 39 }) ->>>>>>> fix unit test for carousel + }) assert.strictEqual($template.find('.carousel-item')[1], $template.find('.active')[0], 'second item active') }) @@ -676,24 +668,14 @@ $(function () { $template.bootstrapCarousel() var done = assert.async() -<<<<<<< HEAD - var eventArrowDown = $.Event('keydown', { - which: 40 - }) - var eventArrowUp = $.Event('keydown', { - which: 38 - }) - - $template.one('keydown', function (event) { - assert.strictEqual(event.isDefaultPrevented(), false) -======= EventHandler.one($template[0], 'keydown', function (event) { assert.strictEqual(event.defaultPrevented, false) ->>>>>>> fix unit test for carousel }) // arrow down - EventHandler.trigger($template[0], 'keydown', { which: 40 }) + EventHandler.trigger($template[0], 'keydown', { + which: 40 + }) EventHandler.one($template[0], 'keydown', function (event) { assert.strictEqual(event.defaultPrevented, false) @@ -701,7 +683,9 @@ $(function () { }) // arrow up - EventHandler.trigger($template[0], 'keydown', { which: 38 }) + EventHandler.trigger($template[0], 'keydown', { + which: 38 + }) }) QUnit.test('should support disabling the keyboard navigation', function (assert) { diff --git a/js/tests/unit/dom/eventHandler.js b/js/tests/unit/dom/eventHandler.js new file mode 100644 index 000000000..49cc89c65 --- /dev/null +++ b/js/tests/unit/dom/eventHandler.js @@ -0,0 +1,239 @@ +$(function () { + 'use strict' + + QUnit.module('event handler') + + QUnit.test('should be defined', function (assert) { + assert.expect(1) + assert.ok(EventHandler, 'EventHandler is defined') + }) + + QUnit.test('should trigger event correctly', function (assert) { + assert.expect(1) + + var element = document.createElement('div') + element.addEventListener('foobar', function () { + assert.ok(true, 'listener called') + }) + + EventHandler.trigger(element, 'foobar') + }) + + QUnit.test('should trigger event through jQuery event system', function (assert) { + assert.expect(1) + + var element = document.createElement('div') + $(element).on('foobar', function () { + assert.ok(true, 'listener called') + }) + + EventHandler.trigger(element, 'foobar') + }) + + QUnit.test('should trigger namespaced event through jQuery event system', function (assert) { + assert.expect(2) + + var element = document.createElement('div') + $(element).on('foobar.namespace', function () { + assert.ok(true, 'first listener called') + }) + element.addEventListener('foobar.namespace', function () { + assert.ok(true, 'second listener called') + }) + + EventHandler.trigger(element, 'foobar.namespace') + }) + + QUnit.test('should mirror preventDefault', function (assert) { + assert.expect(2) + + var element = document.createElement('div') + $(element).on('foobar.namespace', function (event) { + event.preventDefault() + assert.ok(true, 'first listener called') + }) + element.addEventListener('foobar.namespace', function (event) { + assert.ok(event.defaultPrevented, 'defaultPrevented is true in second listener') + }) + + EventHandler.trigger(element, 'foobar.namespace') + }) + + QUnit.test('on should add event listener', function (assert) { + assert.expect(1) + + var element = document.createElement('div') + EventHandler.on(element, 'foobar', function () { + assert.ok(true, 'listener called') + }) + + EventHandler.trigger(element, 'foobar') + }) + + QUnit.test('on should add namespaced event listener', function (assert) { + assert.expect(1) + + var element = document.createElement('div') + EventHandler.on(element, 'foobar.namespace', function () { + assert.ok(true, 'listener called') + }) + + EventHandler.trigger(element, 'foobar.namespace') + }) + + QUnit.test('on should add native namespaced event listener', function (assert) { + assert.expect(1) + + var element = document.createElement('div') + document.body.appendChild(element) + EventHandler.on(element, 'click.namespace', function () { + assert.ok(true, 'listener called') + }) + + EventHandler.trigger(element, 'click') + document.body.removeChild(element) + }) + + QUnit.test('on should add delegated event listener', function (assert) { + assert.expect(1) + + var element = document.createElement('div') + var subelement = document.createElement('span') + element.appendChild(subelement) + + var anchor = document.createElement('a') + element.appendChild(anchor) + + EventHandler.on(element, 'click.namespace', 'a', function () { + assert.ok(true, 'listener called') + }) + + EventHandler.on(element, 'click', 'span', function () { + assert.notOk(true, 'listener should not be called') + }) + + document.body.appendChild(element) + EventHandler.trigger(anchor, 'click') + document.body.removeChild(element) + }) + + QUnit.test('one should remove the listener after the event', function (assert) { + assert.expect(1) + + var element = document.createElement('div') + EventHandler.one(element, 'foobar', function () { + assert.ok(true, 'listener called') + }) + + EventHandler.trigger(element, 'foobar') + EventHandler.trigger(element, 'foobar') + }) + + QUnit.test('off should remove a listener', function (assert) { + assert.expect(1) + + var element = document.createElement('div') + var handler = function () { + assert.ok(true, 'listener called') + } + + EventHandler.on(element, 'foobar', handler) + EventHandler.trigger(element, 'foobar') + + EventHandler.off(element, 'foobar', handler) + EventHandler.trigger(element, 'foobar') + }) + + QUnit.test('off should remove all the listeners', function (assert) { + assert.expect(2) + + var element = document.createElement('div') + + EventHandler.on(element, 'foobar', function () { + assert.ok(true, 'first listener called') + }) + EventHandler.on(element, 'foobar', function () { + assert.ok(true, 'second listener called') + }) + EventHandler.trigger(element, 'foobar') + + EventHandler.off(element, 'foobar') + EventHandler.trigger(element, 'foobar') + }) + + QUnit.test('off should remove all the namespaced listeners if namespace is passed', function (assert) { + assert.expect(2) + + var element = document.createElement('div') + + EventHandler.on(element, 'foobar.namespace', function () { + assert.ok(true, 'first listener called') + }) + EventHandler.on(element, 'foofoo.namespace', function () { + assert.ok(true, 'second listener called') + }) + EventHandler.trigger(element, 'foobar.namespace') + EventHandler.trigger(element, 'foofoo.namespace') + + EventHandler.off(element, '.namespace') + EventHandler.trigger(element, 'foobar.namespace') + EventHandler.trigger(element, 'foofoo.namespace') + }) + + QUnit.test('off should remove the namespaced listeners', function (assert) { + assert.expect(2) + + var element = document.createElement('div') + + EventHandler.on(element, 'foobar.namespace', function () { + assert.ok(true, 'first listener called') + }) + EventHandler.on(element, 'foofoo.namespace', function () { + assert.ok(true, 'second listener called') + }) + EventHandler.trigger(element, 'foobar.namespace') + + EventHandler.off(element, 'foobar.namespace') + EventHandler.trigger(element, 'foobar.namespace') + + EventHandler.trigger(element, 'foofoo.namespace') + }) + + QUnit.test('off should remove the all the namespaced listeners for native events', function (assert) { + assert.expect(2) + + var element = document.createElement('div') + document.body.appendChild(element) + + EventHandler.on(element, 'click.namespace', function () { + assert.ok(true, 'first listener called') + }) + EventHandler.on(element, 'click.namespace2', function () { + assert.ok(true, 'second listener called') + }) + EventHandler.trigger(element, 'click') + + EventHandler.off(element, 'click') + EventHandler.trigger(element, 'click') + document.body.removeChild(element) + }) + + QUnit.test('off should remove the specified namespaced listeners for native events', function (assert) { + assert.expect(3) + + var element = document.createElement('div') + document.body.appendChild(element) + + EventHandler.on(element, 'click.namespace', function () { + assert.ok(true, 'first listener called') + }) + EventHandler.on(element, 'click.namespace2', function () { + assert.ok(true, 'second listener called') + }) + EventHandler.trigger(element, 'click') + + EventHandler.off(element, 'click.namespace') + EventHandler.trigger(element, 'click') + document.body.removeChild(element) + }) +}) diff --git a/js/tests/unit/modal.js b/js/tests/unit/modal.js index 9b7fb0aa6..cfac27bba 100644 --- a/js/tests/unit/modal.js +++ b/js/tests/unit/modal.js @@ -209,9 +209,12 @@ $(function () { .on('shown.bs.modal', function () { assert.ok($('#modal-test').length, 'modal inserted into dom') assert.ok($('#modal-test').is(':visible'), 'modal visible') - $div.trigger($.Event('keydown', { - which: 27 - })) + + var evt = document.createEvent('HTMLEvents') + evt.initEvent('keydown', true, true) + evt.which = 27 + + $div[0].dispatchEvent(evt) setTimeout(function () { assert.ok(!$('#modal-test').is(':visible'), 'modal hidden') @@ -308,15 +311,19 @@ $(function () { .one('hidden.bs.modal', function () { // After one open-close cycle assert.ok(!$('#modal-test').is(':visible'), 'modal hidden') - $(this) - .one('shown.bs.modal', function () { - $('#close').trigger('click') - }) - .one('hidden.bs.modal', function () { - assert.ok(!$('#modal-test').is(':visible'), 'modal hidden') - done() - }) - .bootstrapModal('show') + + var $this = $(this) + setTimeout(function () { + $this + .one('shown.bs.modal', function () { + $('#close').trigger('click') + }) + .one('hidden.bs.modal', function () { + assert.ok(!$('#modal-test').is(':visible'), 'modal hidden') + done() + }) + .bootstrapModal('show') + }, 0) }) .bootstrapModal('show') }) @@ -595,7 +602,6 @@ $(function () { QUnit.test('should not follow link in area tag', function (assert) { assert.expect(2) - var done = assert.async() $('<map><area id="test" shape="default" data-toggle="modal" data-target="#modal-test" href="demo.html"/></map>') .appendTo('#qunit-fixture') @@ -603,16 +609,19 @@ $(function () { $('<div id="modal-test"><div class="contents"><div id="close" data-dismiss="modal"/></div></div>') .appendTo('#qunit-fixture') + // We need to use CustomEvent here to have a working preventDefault in IE tests. + var evt = new CustomEvent('click', { + bubbles: true, + cancelable: true + }) + $('#test') .on('click.bs.modal.data-api', function (event) { - assert.notOk(event.isDefaultPrevented(), 'navigating to href will happen') - - setTimeout(function () { - assert.ok(event.isDefaultPrevented(), 'model shown instead of navigating to href') - done() - }, 1) + assert.notOk(event.defaultPrevented, 'navigating to href will happen') }) - .trigger('click') + + $('#test')[0].dispatchEvent(evt) + assert.ok(evt.defaultPrevented, 'model shown instead of navigating to href') }) QUnit.test('should not parse target as html', function (assert) { |