diff options
Diffstat (limited to 'js/tests/unit')
| -rw-r--r-- | js/tests/unit/collapse.js | 51 | ||||
| -rw-r--r-- | js/tests/unit/scrollspy.js | 78 | ||||
| -rw-r--r-- | js/tests/unit/tooltip.js | 2 |
3 files changed, 72 insertions, 59 deletions
diff --git a/js/tests/unit/collapse.js b/js/tests/unit/collapse.js index 4eadc205b..892da52ed 100644 --- a/js/tests/unit/collapse.js +++ b/js/tests/unit/collapse.js @@ -90,6 +90,21 @@ $(function () { .bootstrapCollapse('show') }) + QUnit.test('should reset style to auto after finishing closing collapse', function (assert) { + assert.expect(1) + var done = assert.async() + + $('<div class="collapse"/>') + .on('shown.bs.collapse', function () { + $(this).bootstrapCollapse('hide') + }) + .on('hidden.bs.collapse', function () { + assert.strictEqual(this.style.height, '', 'height is auto') + done() + }) + .bootstrapCollapse('show') + }) + QUnit.test('should remove "collapsed" class from target when collapse is shown', function (assert) { assert.expect(1) var done = assert.async() @@ -220,12 +235,12 @@ $(function () { assert.expect(3) var done = assert.async() - var accordionHTML = '<div class="panel-group" id="accordion">' - + '<div class="panel"/>' - + '<div class="panel"/>' - + '<div class="panel"/>' + var accordionHTML = '<div id="accordion">' + + '<div class="card"/>' + + '<div class="card"/>' + + '<div class="card"/>' + '</div>' - var $groups = $(accordionHTML).appendTo('#qunit-fixture').find('.panel') + var $groups = $(accordionHTML).appendTo('#qunit-fixture').find('.card') var $target1 = $('<a role="button" data-toggle="collapse" href="#body1" data-parent="#accordion"/>').appendTo($groups.eq(0)) @@ -254,12 +269,12 @@ $(function () { assert.expect(3) var done = assert.async() - var accordionHTML = '<div class="panel-group accordion">' - + '<div class="panel"/>' - + '<div class="panel"/>' - + '<div class="panel"/>' + var accordionHTML = '<div class="accordion">' + + '<div class="card"/>' + + '<div class="card"/>' + + '<div class="card"/>' + '</div>' - var $groups = $(accordionHTML).appendTo('#qunit-fixture').find('.panel') + var $groups = $(accordionHTML).appendTo('#qunit-fixture').find('.card') var $target1 = $('<a role="button" data-toggle="collapse" href="#body1" data-parent=".accordion"/>').appendTo($groups.eq(0)) @@ -356,12 +371,12 @@ $(function () { assert.expect(3) var done = assert.async() - var accordionHTML = '<div class="panel-group" id="accordion">' - + '<div class="panel"/>' - + '<div class="panel"/>' - + '<div class="panel"/>' + var accordionHTML = '<div id="accordion">' + + '<div class="card"/>' + + '<div class="card"/>' + + '<div class="card"/>' + '</div>' - var $groups = $(accordionHTML).appendTo('#qunit-fixture').find('.panel') + var $groups = $(accordionHTML).appendTo('#qunit-fixture').find('.card') var $target1 = $('<a role="button" data-toggle="collapse" href="#body1" data-parent="#accordion"/>').appendTo($groups.eq(0)) @@ -391,11 +406,11 @@ $(function () { var done = assert.async() var accordionHTML = '<div id="accordion">' - + '<div class="panel"/>' - + '<div class="panel"/>' + + '<div class="card"/>' + + '<div class="card"/>' + '</div>' var showFired = false - var $groups = $(accordionHTML).appendTo('#qunit-fixture').find('.panel') + var $groups = $(accordionHTML).appendTo('#qunit-fixture').find('.card') var $target1 = $('<a role="button" data-toggle="collapse" href="#body1" data-parent="#accordion"/>').appendTo($groups.eq(0)) diff --git a/js/tests/unit/scrollspy.js b/js/tests/unit/scrollspy.js index 878c4d389..97ddd16ec 100644 --- a/js/tests/unit/scrollspy.js +++ b/js/tests/unit/scrollspy.js @@ -81,7 +81,7 @@ $(function () { .find('#scrollspy-example') .bootstrapScrollspy({ target: '#ss-target' }) - $scrollspy.on('scroll.bs.scrollspy', function () { + $scrollspy.one('scroll', function () { assert.ok($section.hasClass('active'), '"active" class still on root node') done() }) @@ -126,7 +126,7 @@ $(function () { .find('#scrollspy-example') .bootstrapScrollspy({ target: document.getElementById('#ss-target') }) - $scrollspy.on('scroll.bs.scrollspy', function () { + $scrollspy.one('scroll', function () { assert.ok($section.hasClass('active'), '"active" class still on root node') done() }) @@ -158,7 +158,7 @@ $(function () { $scrollspy.bootstrapScrollspy({ target: '#navigation', offset: $scrollspy.position().top }) - $scrollspy.on('scroll.bs.scrollspy', function () { + $scrollspy.one('scroll', function () { assert.ok(!$section.find('#one-link').hasClass('active'), '"active" class removed from first section') assert.ok($section.find('#two-link').hasClass('active'), '"active" class on middle section') assert.ok(!$section.find('#three-link').hasClass('active'), '"active" class not on last section') @@ -188,13 +188,12 @@ $(function () { .appendTo('#qunit-fixture') .bootstrapScrollspy({ offset: 0, target: '.navbar' }) + var done = assert.async() var testElementIsActiveAfterScroll = function (element, target) { var deferred = $.Deferred() var scrollHeight = Math.ceil($content.scrollTop() + $(target).position().top) - var done = assert.async() $content.one('scroll', function () { assert.ok($(element).hasClass('active'), 'target:' + target + ', element' + element) - done() deferred.resolve() }) $content.scrollTop(scrollHeight) @@ -203,6 +202,7 @@ $(function () { $.when(testElementIsActiveAfterScroll('#a-1', '#div-1')) .then(function () { return testElementIsActiveAfterScroll('#a-2', '#div-2') }) + .then(function () { done() }) }) QUnit.test('should add the active class correctly when there are nested elements at 0 scroll offset', function (assert) { @@ -272,11 +272,11 @@ $(function () { target: '#navigation', offset: $scrollspy.position().top }) - .one('scroll.bs.scrollspy', function () { + .one('scroll', function () { assert.strictEqual($('.active').length, 1, '"active" class on only one element present') assert.strictEqual($('.active').is('#two-link'), true, '"active" class on second section') $scrollspy - .one('scroll.bs.scrollspy', function () { + .one('scroll', function () { assert.strictEqual($('.active').length, 0, 'selection cleared') done() }) @@ -314,29 +314,28 @@ $(function () { var testElementIsActiveAfterScroll = function (element, target) { var deferred = $.Deferred() var scrollHeight = Math.ceil($content.scrollTop() + $(target).position().top) - var done = assert.async() $content.one('scroll', function () { assert.ok($(element).hasClass('active'), 'target:' + target + ', element: ' + element) - done() deferred.resolve() }) $content.scrollTop(scrollHeight) return deferred.promise() } + var done = assert.async() $.when(testElementIsActiveAfterScroll('#li-100-5', '#div-100-5')) .then(function () { return testElementIsActiveAfterScroll('#li-100-4', '#div-100-4') }) .then(function () { return testElementIsActiveAfterScroll('#li-100-3', '#div-100-3') }) .then(function () { return testElementIsActiveAfterScroll('#li-100-2', '#div-100-2') }) .then(function () { return testElementIsActiveAfterScroll('#li-100-1', '#div-100-1') }) + .then(function () { done() }) }) QUnit.test('should allow passed in option offset method: offset', function (assert) { assert.expect(4) var testOffsetMethod = function (type) { - var deferred = $.Deferred() - var navbarHtml = + var $navbar = $( '<nav class="navbar"' + (type === 'data' ? ' id="navbar-offset-method-menu"' : '') + '>' + '<ul class="nav">' + '<li><a id="li-' + type + 'm-1" class="nav-link" href="#div-' + type + 'm-1">div 1</a></li>' @@ -344,42 +343,43 @@ $(function () { + '<li><a id="li-' + type + 'm-3" class="nav-link" href="#div-' + type + 'm-3">div 3</a></li>' + '</ul>' + '</nav>' - var contentHtml = + ) + var $content = $( '<div class="content"' + (type === 'data' ? ' data-spy="scroll" data-target="#navbar-offset-method-menu" data-offset="0" data-method="offset"' : '') + ' style="position: relative; overflow: auto; height: 100px">' + '<div id="div-' + type + 'm-1" style="position: relative; height: 200px; padding: 0; margin: 0">div 1</div>' + '<div id="div-' + type + 'm-2" style="position: relative; height: 150px; padding: 0; margin: 0">div 2</div>' + '<div id="div-' + type + 'm-3" style="position: relative; height: 250px; padding: 0; margin: 0">div 3</div>' + '</div>' + ) + $navbar.appendTo('#qunit-fixture') + $content.appendTo('#qunit-fixture') - $(navbarHtml).appendTo('#qunit-fixture') - var $content = $(contentHtml) - .appendTo('#qunit-fixture') - - if (type === 'js') $content.bootstrapScrollspy({ target: '.navbar', offset: 0, method: 'offset' }) - else if (type === 'data') $(window).trigger('load.bs.scrollspy.data-api') + if (type === 'js') { + $content.bootstrapScrollspy({ target: '.navbar', offset: 0, method: 'offset' }) + } + else if (type === 'data') { + $(window).trigger('load') + } var $target = $('#div-' + type + 'm-2') var scrollspy = $content.data('bs.scrollspy') - assert.ok(scrollspy._offsets[1] === $target.offset().top, 'offsed method with ' + type + ' option') + assert.ok(scrollspy._offsets[1] === $target.offset().top, 'offset method with ' + type + ' option') assert.ok(scrollspy._offsets[1] !== $target.position().top, 'position method with ' + type + ' option') - - deferred.resolve() - - return deferred.promise() + $navbar.remove() + $content.remove() } - $.when(testOffsetMethod('js')) - .then(function () { testOffsetMethod('data') }) + testOffsetMethod('js') + testOffsetMethod('data') }) QUnit.test('should allow passed in option offset method: position', function (assert) { assert.expect(4) var testOffsetMethod = function (type) { - var deferred = $.Deferred() - var navbarHtml = + var $navbar = $( '<nav class="navbar"' + (type === 'data' ? ' id="navbar-offset-method-menu"' : '') + '>' + '<ul class="nav">' + '<li><a class="nav-link" id="li-' + type + 'm-1" href="#div-' + type + 'm-1">div 1</a></li>' @@ -387,34 +387,32 @@ $(function () { + '<li><a class="nav-link" id="li-' + type + 'm-3" href="#div-' + type + 'm-3">div 3</a></li>' + '</ul>' + '</nav>' - var contentHtml = + ) + var $content = $( '<div class="content"' + (type === 'data' ? ' data-spy="scroll" data-target="#navbar-offset-method-menu" data-offset="0" data-method="position"' : '') + ' style="position: relative; overflow: auto; height: 100px">' + '<div id="div-' + type + 'm-1" style="position: relative; height: 200px; padding: 0; margin: 0">div 1</div>' + '<div id="div-' + type + 'm-2" style="position: relative; height: 150px; padding: 0; margin: 0">div 2</div>' + '<div id="div-' + type + 'm-3" style="position: relative; height: 250px; padding: 0; margin: 0">div 3</div>' + '</div>' + ) - - $(navbarHtml).appendTo('#qunit-fixture') - var $content = $(contentHtml) - .appendTo('#qunit-fixture') + $navbar.appendTo('#qunit-fixture') + $content.appendTo('#qunit-fixture') if (type === 'js') $content.bootstrapScrollspy({ target: '.navbar', offset: 0, method: 'position' }) - else if (type === 'data') $(window).trigger('load.bs.scrollspy.data-api') + else if (type === 'data') $(window).trigger('load') var $target = $('#div-' + type + 'm-2') var scrollspy = $content.data('bs.scrollspy') - assert.ok(scrollspy._offsets[1] !== $target.offset().top, 'offsed method with ' + type + ' option') + assert.ok(scrollspy._offsets[1] !== $target.offset().top, 'offset method with ' + type + ' option') assert.ok(scrollspy._offsets[1] === $target.position().top, 'position method with ' + type + ' option') - - deferred.resolve() - - return deferred.promise() + $navbar.remove() + $content.remove() } - $.when(testOffsetMethod('js')) - .then(function () { testOffsetMethod('data') }) + testOffsetMethod('js') + testOffsetMethod('data') }) }) diff --git a/js/tests/unit/tooltip.js b/js/tests/unit/tooltip.js index 9ec5ddb03..6cf870551 100644 --- a/js/tests/unit/tooltip.js +++ b/js/tests/unit/tooltip.js @@ -368,7 +368,7 @@ $(function () { var $tooltip = $($target.data('bs.tooltip').tip) - // this is some dumb hack shit because sub pixels in firefox + // this is some dumb hack stuff because sub pixels in firefox var top = Math.round($target.offset().top + ($target[0].offsetHeight / 2) - ($tooltip[0].offsetHeight / 2)) var top2 = Math.round($tooltip.offset().top) var topDiff = top - top2 |