aboutsummaryrefslogtreecommitdiff
path: root/js/tests
diff options
context:
space:
mode:
authorfat <[email protected]>2015-05-13 15:01:39 -0700
committerfat <[email protected]>2015-05-13 15:01:39 -0700
commitdbaffd43c08e60208c2a56cfe102006675ccabd8 (patch)
tree268086d1675aa44cdfd178ec8c04606a58db6b8b /js/tests
parent06b1d49808c941cdac22a8acc1ee9a6b77957bf2 (diff)
parent6b2b0ed32f485103f58fe42057e93a175e14bc2a (diff)
downloadbootstrap-dbaffd43c08e60208c2a56cfe102006675ccabd8.tar.xz
bootstrap-dbaffd43c08e60208c2a56cfe102006675ccabd8.zip
Merge pull request #116 from twbs/fat-es6Alert
es6 - wip
Diffstat (limited to 'js/tests')
-rw-r--r--js/tests/index.html27
-rw-r--r--js/tests/unit/affix.js107
-rw-r--r--js/tests/unit/alert.js3
-rw-r--r--js/tests/unit/button.js58
-rw-r--r--js/tests/unit/carousel.js192
-rw-r--r--js/tests/unit/collapse.js4
-rw-r--r--js/tests/unit/modal.js2
-rw-r--r--js/tests/unit/popover.js29
-rw-r--r--js/tests/unit/scrollspy.js131
-rw-r--r--js/tests/unit/tooltip.js648
-rw-r--r--js/tests/vendor/tether.min.js2
-rw-r--r--js/tests/visual/affix-with-sticky-footer.html317
-rw-r--r--js/tests/visual/affix.html306
-rw-r--r--js/tests/visual/alert.html4
-rw-r--r--js/tests/visual/button.html8
-rw-r--r--js/tests/visual/carousel.html10
-rw-r--r--js/tests/visual/collapse.html4
-rw-r--r--js/tests/visual/dropdown.html48
-rw-r--r--js/tests/visual/modal.html21
-rw-r--r--js/tests/visual/popover.html10
-rw-r--r--js/tests/visual/scrollspy.html27
-rw-r--r--js/tests/visual/tab.html38
-rw-r--r--js/tests/visual/tooltip.html9
23 files changed, 398 insertions, 1607 deletions
diff --git a/js/tests/index.html b/js/tests/index.html
index fab2ebc16..0e2bdd012 100644
--- a/js/tests/index.html
+++ b/js/tests/index.html
@@ -7,6 +7,7 @@
<!-- jQuery -->
<script src="vendor/jquery.min.js"></script>
+ <script src="vendor/tether.min.js"></script>
<script>
// Disable jQuery event aliases to ensure we don't accidentally use any of them
(function () {
@@ -129,19 +130,18 @@
})();
</script>
- <!-- Plugin sources -->
- <script>$.support.transition = false</script>
- <script src="../../js/alert.js"></script>
- <script src="../../js/button.js"></script>
- <script src="../../js/carousel.js"></script>
- <script src="../../js/collapse.js"></script>
- <script src="../../js/dropdown.js"></script>
- <script src="../../js/modal.js"></script>
- <script src="../../js/scrollspy.js"></script>
- <script src="../../js/tab.js"></script>
- <script src="../../js/tooltip.js"></script>
- <script src="../../js/popover.js"></script>
- <script src="../../js/affix.js"></script>
+ <!-- es6 Plugin sources -->
+ <script src="../../js/dist/util.js"></script>
+ <script src="../../js/dist/alert.js"></script>
+ <script src="../../js/dist/button.js"></script>
+ <script src="../../js/dist/carousel.js"></script>
+ <script src="../../js/dist/collapse.js"></script>
+ <script src="../../js/dist/dropdown.js"></script>
+ <script src="../../js/dist/modal.js"></script>
+ <script src="../../js/dist/scrollspy.js"></script>
+ <script src="../../js/dist/tab.js"></script>
+ <script src="../../js/dist/tooltip.js"></script>
+ <script src="../../js/dist/popover.js"></script>
<!-- Unit tests -->
<script src="unit/alert.js"></script>
@@ -154,7 +154,6 @@
<script src="unit/tab.js"></script>
<script src="unit/tooltip.js"></script>
<script src="unit/popover.js"></script>
- <script src="unit/affix.js"></script>
</head>
<body>
diff --git a/js/tests/unit/affix.js b/js/tests/unit/affix.js
deleted file mode 100644
index 3a6918f86..000000000
--- a/js/tests/unit/affix.js
+++ /dev/null
@@ -1,107 +0,0 @@
-$(function () {
- 'use strict';
-
- QUnit.module('affix plugin')
-
- QUnit.test('should be defined on jquery object', function (assert) {
- assert.expect(1)
- assert.ok($(document.body).affix, 'affix method is defined')
- })
-
- QUnit.module('affix', {
- beforeEach: function () {
- // Run all tests in noConflict mode -- it's the only way to ensure that the plugin works in noConflict mode
- $.fn.bootstrapAffix = $.fn.affix.noConflict()
- },
- afterEach: function () {
- $.fn.affix = $.fn.bootstrapAffix
- delete $.fn.bootstrapAffix
- }
- })
-
- QUnit.test('should provide no conflict', function (assert) {
- assert.expect(1)
- assert.strictEqual($.fn.affix, undefined, 'affix was set back to undefined (org value)')
- })
-
- QUnit.test('should return jquery collection containing the element', function (assert) {
- assert.expect(2)
- var $el = $('<div/>')
- var $affix = $el.bootstrapAffix()
- assert.ok($affix instanceof $, 'returns jquery collection')
- assert.strictEqual($affix[0], $el[0], 'collection contains element')
- })
-
- QUnit.test('should exit early if element is not visible', function (assert) {
- assert.expect(1)
- var $affix = $('<div style="display: none"/>').bootstrapAffix()
- $affix.data('bs.affix').checkPosition()
- assert.ok(!$affix.hasClass('affix'), 'affix class was not added')
- })
-
- QUnit.test('should trigger affixed event after affix', function (assert) {
- assert.expect(2)
- var done = assert.async()
-
- var templateHTML = '<div id="affixTarget">'
- + '<ul>'
- + '<li>Please affix</li>'
- + '<li>And unaffix</li>'
- + '</ul>'
- + '</div>'
- + '<div id="affixAfter" style="height: 20000px; display: block;"/>'
- $(templateHTML).appendTo(document.body)
-
- $('#affixTarget').bootstrapAffix({
- offset: $('#affixTarget ul').position()
- })
-
- $('#affixTarget')
- .on('affix.bs.affix', function () {
- assert.ok(true, 'affix event fired')
- }).on('affixed.bs.affix', function () {
- assert.ok(true, 'affixed event fired')
- $('#affixTarget, #affixAfter').remove()
- done()
- })
-
- setTimeout(function () {
- window.scrollTo(0, document.body.scrollHeight)
-
- setTimeout(function () {
- window.scroll(0, 0)
- }, 16) // for testing in a browser
- }, 0)
- })
-
- QUnit.test('should affix-top when scrolling up to offset when parent has padding', function (assert) {
- assert.expect(1)
- var done = assert.async()
-
- var templateHTML = '<div id="padding-offset" style="padding-top: 20px;">'
- + '<div id="affixTopTarget">'
- + '<p>Testing affix-top class is added</p>'
- + '</div>'
- + '<div style="height: 1000px; display: block;"/>'
- + '</div>'
- $(templateHTML).appendTo(document.body)
-
- $('#affixTopTarget')
- .bootstrapAffix({
- offset: { top: 120, bottom: 0 }
- })
- .on('affixed-top.bs.affix', function () {
- assert.ok($('#affixTopTarget').hasClass('affix-top'), 'affix-top class applied')
- $('#padding-offset').remove()
- done()
- })
-
- setTimeout(function () {
- window.scrollTo(0, document.body.scrollHeight)
-
- setTimeout(function () {
- window.scroll(0, 119)
- }, 250)
- }, 250)
- })
-})
diff --git a/js/tests/unit/alert.js b/js/tests/unit/alert.js
index 6be990a51..97818960a 100644
--- a/js/tests/unit/alert.js
+++ b/js/tests/unit/alert.js
@@ -38,7 +38,8 @@ $(function () {
+ '<a class="close" href="#" data-dismiss="alert">×</a>'
+ '<p><strong>Holy guacamole!</strong> Best check yo self, you\'re not looking too good.</p>'
+ '</div>'
- var $alert = $(alertHTML).bootstrapAlert()
+
+ var $alert = $(alertHTML).bootstrapAlert().appendTo($('#qunit-fixture'))
$alert.find('.close').trigger('click')
diff --git a/js/tests/unit/button.js b/js/tests/unit/button.js
index 691796c42..5648506cf 100644
--- a/js/tests/unit/button.js
+++ b/js/tests/unit/button.js
@@ -32,64 +32,6 @@ $(function () {
assert.strictEqual($button[0], $el[0], 'collection contains element')
})
- QUnit.test('should return set state to loading', function (assert) {
- assert.expect(4)
- var $btn = $('<button class="btn" data-loading-text="fat">mdo</button>')
- assert.strictEqual($btn.html(), 'mdo', 'btn text equals mdo')
- $btn.bootstrapButton('loading')
- var done = assert.async()
- setTimeout(function () {
- assert.strictEqual($btn.html(), 'fat', 'btn text equals fat')
- assert.ok($btn[0].hasAttribute('disabled'), 'btn is disabled')
- assert.ok($btn.hasClass('disabled'), 'btn has disabled class')
- done()
- }, 0)
- })
-
- QUnit.test('should return reset state', function (assert) {
- assert.expect(7)
- var $btn = $('<button class="btn" data-loading-text="fat">mdo</button>')
- assert.strictEqual($btn.html(), 'mdo', 'btn text equals mdo')
- $btn.bootstrapButton('loading')
- var doneOne = assert.async()
- setTimeout(function () {
- assert.strictEqual($btn.html(), 'fat', 'btn text equals fat')
- assert.ok($btn[0].hasAttribute('disabled'), 'btn is disabled')
- assert.ok($btn.hasClass('disabled'), 'btn has disabled class')
- doneOne()
- var doneTwo = assert.async()
- $btn.bootstrapButton('reset')
- setTimeout(function () {
- assert.strictEqual($btn.html(), 'mdo', 'btn text equals mdo')
- assert.ok(!$btn[0].hasAttribute('disabled'), 'btn is not disabled')
- assert.ok(!$btn.hasClass('disabled'), 'btn does not have disabled class')
- doneTwo()
- }, 0)
- }, 0)
- })
-
- QUnit.test('should work with an empty string as reset state', function (assert) {
- assert.expect(7)
- var $btn = $('<button class="btn" data-loading-text="fat"/>')
- assert.strictEqual($btn.html(), '', 'btn text equals ""')
- $btn.bootstrapButton('loading')
- var doneOne = assert.async()
- setTimeout(function () {
- assert.strictEqual($btn.html(), 'fat', 'btn text equals fat')
- assert.ok($btn[0].hasAttribute('disabled'), 'btn is disabled')
- assert.ok($btn.hasClass('disabled'), 'btn has disabled class')
- doneOne()
- var doneTwo = assert.async()
- $btn.bootstrapButton('reset')
- setTimeout(function () {
- assert.strictEqual($btn.html(), '', 'btn text equals ""')
- assert.ok(!$btn[0].hasAttribute('disabled'), 'btn is not disabled')
- assert.ok(!$btn.hasClass('disabled'), 'btn does not have disabled class')
- doneTwo()
- }, 0)
- }, 0)
- })
-
QUnit.test('should toggle active', function (assert) {
assert.expect(2)
var $btn = $('<button class="btn" data-toggle="button">mdo</button>')
diff --git a/js/tests/unit/carousel.js b/js/tests/unit/carousel.js
index 39d250598..017bd9bee 100644
--- a/js/tests/unit/carousel.js
+++ b/js/tests/unit/carousel.js
@@ -32,6 +32,38 @@ $(function () {
assert.strictEqual($carousel[0], $el[0], 'collection contains element')
})
+ QUnit.test('should type check config options', function (assert) {
+ assert.expect(2)
+
+ var message
+ var expectedMessage = 'CAROUSEL: Option "interval" provided type "string" but expected type "(number|boolean)".'
+ var config = {
+ interval: 'fat sux'
+ }
+
+ try {
+ $('<div/>').bootstrapCarousel(config)
+ } catch (e) {
+ message = e.message
+ }
+
+ assert.ok(message === expectedMessage, 'correct error message')
+
+ config = {
+ keyboard: document.createElement('div')
+ }
+ expectedMessage = 'CAROUSEL: Option "keyboard" provided type "element" but expected type "boolean".'
+
+ try {
+ $('<div/>').bootstrapCarousel(config)
+ } catch (e) {
+ message = e.message
+ }
+
+ assert.ok(message === expectedMessage, 'correct error message')
+ })
+
+
QUnit.test('should not fire slid when slide is prevented', function (assert) {
assert.expect(1)
var done = assert.async()
@@ -56,13 +88,13 @@ $(function () {
+ '<li data-target="#carousel-example-generic" data-slide-to="2"/>'
+ '</ol>'
+ '<div class="carousel-inner">'
- + '<div class="item active">'
+ + '<div class="carousel-item active">'
+ '<div class="carousel-caption"/>'
+ '</div>'
- + '<div class="item">'
+ + '<div class="carousel-item">'
+ '<div class="carousel-caption"/>'
+ '</div>'
- + '<div class="item">'
+ + '<div class="carousel-item">'
+ '<div class="carousel-caption"/>'
+ '</div>'
+ '</div>'
@@ -76,16 +108,16 @@ $(function () {
.one('slide.bs.carousel', function (e) {
e.preventDefault()
setTimeout(function () {
- assert.ok($carousel.find('.item:eq(0)').is('.active'), 'first item still active')
+ assert.ok($carousel.find('.carousel-item:eq(0)').is('.active'), 'first item still active')
assert.ok($carousel.find('.carousel-indicators li:eq(0)').is('.active'), 'first indicator still active')
$carousel.bootstrapCarousel('next')
}, 0)
})
.one('slid.bs.carousel', function () {
setTimeout(function () {
- assert.ok(!$carousel.find('.item:eq(0)').is('.active'), 'first item still active')
+ assert.ok(!$carousel.find('.carousel-item:eq(0)').is('.active'), 'first item still active')
assert.ok(!$carousel.find('.carousel-indicators li:eq(0)').is('.active'), 'first indicator still active')
- assert.ok($carousel.find('.item:eq(1)').is('.active'), 'second item active')
+ assert.ok($carousel.find('.carousel-item:eq(1)').is('.active'), 'second item active')
assert.ok($carousel.find('.carousel-indicators li:eq(1)').is('.active'), 'second indicator active')
done()
}, 0)
@@ -97,7 +129,7 @@ $(function () {
assert.expect(4)
var carouselHTML = '<div id="myCarousel" class="carousel slide">'
+ '<div class="carousel-inner">'
- + '<div class="item active">'
+ + '<div class="carousel-item active">'
+ '<img alt="">'
+ '<div class="carousel-caption">'
+ '<h4>First Thumbnail label</h4>'
@@ -106,7 +138,7 @@ $(function () {
+ 'ultricies vehicula ut id elit.</p>'
+ '</div>'
+ '</div>'
- + '<div class="item">'
+ + '<div class="carousel-item">'
+ '<img alt="">'
+ '<div class="carousel-caption">'
+ '<h4>Second Thumbnail label</h4>'
@@ -115,7 +147,7 @@ $(function () {
+ 'ultricies vehicula ut id elit.</p>'
+ '</div>'
+ '</div>'
- + '<div class="item">'
+ + '<div class="carousel-item">'
+ '<img alt="">'
+ '<div class="carousel-caption">'
+ '<h4>Third Thumbnail label</h4>'
@@ -152,7 +184,7 @@ $(function () {
assert.expect(4)
var carouselHTML = '<div id="myCarousel" class="carousel slide">'
+ '<div class="carousel-inner">'
- + '<div class="item active">'
+ + '<div class="carousel-item active">'
+ '<img alt="">'
+ '<div class="carousel-caption">'
+ '<h4>First Thumbnail label</h4>'
@@ -161,7 +193,7 @@ $(function () {
+ 'ultricies vehicula ut id elit.</p>'
+ '</div>'
+ '</div>'
- + '<div class="item">'
+ + '<div class="carousel-item">'
+ '<img alt="">'
+ '<div class="carousel-caption">'
+ '<h4>Second Thumbnail label</h4>'
@@ -170,7 +202,7 @@ $(function () {
+ 'ultricies vehicula ut id elit.</p>'
+ '</div>'
+ '</div>'
- + '<div class="item">'
+ + '<div class="carousel-item">'
+ '<img alt="">'
+ '<div class="carousel-caption">'
+ '<h4>Third Thumbnail label</h4>'
@@ -207,7 +239,7 @@ $(function () {
assert.expect(2)
var template = '<div id="myCarousel" class="carousel slide">'
+ '<div class="carousel-inner">'
- + '<div class="item active">'
+ + '<div class="carousel-item active">'
+ '<img alt="">'
+ '<div class="carousel-caption">'
+ '<h4>First Thumbnail label</h4>'
@@ -216,7 +248,7 @@ $(function () {
+ 'ultricies vehicula ut id elit.</p>'
+ '</div>'
+ '</div>'
- + '<div class="item">'
+ + '<div class="carousel-item">'
+ '<img alt="">'
+ '<div class="carousel-caption">'
+ '<h4>Second Thumbnail label</h4>'
@@ -225,7 +257,7 @@ $(function () {
+ 'ultricies vehicula ut id elit.</p>'
+ '</div>'
+ '</div>'
- + '<div class="item">'
+ + '<div class="carousel-item">'
+ '<img alt="">'
+ '<div class="carousel-caption">'
+ '<h4>Third Thumbnail label</h4>'
@@ -244,7 +276,7 @@ $(function () {
$(template)
.on('slide.bs.carousel', function (e) {
assert.ok(e.relatedTarget, 'relatedTarget present')
- assert.ok($(e.relatedTarget).hasClass('item'), 'relatedTarget has class "item"')
+ assert.ok($(e.relatedTarget).hasClass('carousel-item'), 'relatedTarget has class "item"')
done()
})
.bootstrapCarousel('next')
@@ -254,7 +286,7 @@ $(function () {
assert.expect(2)
var template = '<div id="myCarousel" class="carousel slide">'
+ '<div class="carousel-inner">'
- + '<div class="item active">'
+ + '<div class="carousel-item active">'
+ '<img alt="">'
+ '<div class="carousel-caption">'
+ '<h4>First Thumbnail label</h4>'
@@ -263,7 +295,7 @@ $(function () {
+ 'ultricies vehicula ut id elit.</p>'
+ '</div>'
+ '</div>'
- + '<div class="item">'
+ + '<div class="carousel-item">'
+ '<img alt="">'
+ '<div class="carousel-caption">'
+ '<h4>Second Thumbnail label</h4>'
@@ -272,7 +304,7 @@ $(function () {
+ 'ultricies vehicula ut id elit.</p>'
+ '</div>'
+ '</div>'
- + '<div class="item">'
+ + '<div class="carousel-item">'
+ '<img alt="">'
+ '<div class="carousel-caption">'
+ '<h4>Third Thumbnail label</h4>'
@@ -291,7 +323,7 @@ $(function () {
$(template)
.on('slid.bs.carousel', function (e) {
assert.ok(e.relatedTarget, 'relatedTarget present')
- assert.ok($(e.relatedTarget).hasClass('item'), 'relatedTarget has class "item"')
+ assert.ok($(e.relatedTarget).hasClass('carousel-item'), 'relatedTarget has class "item"')
done()
})
.bootstrapCarousel('next')
@@ -301,7 +333,7 @@ $(function () {
assert.expect(4)
var templateHTML = '<div id="myCarousel" class="carousel slide">'
+ '<div class="carousel-inner">'
- + '<div class="item active">'
+ + '<div class="carousel-item active">'
+ '<img alt="">'
+ '<div class="carousel-caption">'
+ '<h4>First Thumbnail label</h4>'
@@ -310,7 +342,7 @@ $(function () {
+ 'ultricies vehicula ut id elit.</p>'
+ '</div>'
+ '</div>'
- + '<div class="item">'
+ + '<div class="carousel-item">'
+ '<img alt="">'
+ '<div class="carousel-caption">'
+ '<h4>Second Thumbnail label</h4>'
@@ -319,7 +351,7 @@ $(function () {
+ 'ultricies vehicula ut id elit.</p>'
+ '</div>'
+ '</div>'
- + '<div class="item">'
+ + '<div class="carousel-item">'
+ '<img alt="">'
+ '<div class="carousel-caption">'
+ '<h4>Third Thumbnail label</h4>'
@@ -337,25 +369,25 @@ $(function () {
$carousel.appendTo('body')
$('[data-slide]').first().trigger('click')
- assert.strictEqual($carousel.data('bs.carousel').options.interval, 1814)
+ assert.strictEqual($carousel.data('bs.carousel')._config.interval, 1814)
$carousel.remove()
$carousel.appendTo('body').attr('data-modal', 'foobar')
$('[data-slide]').first().trigger('click')
- assert.strictEqual($carousel.data('bs.carousel').options.interval, 1814, 'even if there is an data-modal attribute set')
+ assert.strictEqual($carousel.data('bs.carousel')._config.interval, 1814, 'even if there is an data-modal attribute set')
$carousel.remove()
$carousel.appendTo('body')
$('[data-slide]').first().trigger('click')
$carousel.attr('data-interval', 1860)
$('[data-slide]').first().trigger('click')
- assert.strictEqual($carousel.data('bs.carousel').options.interval, 1814, 'attributes should be read only on initialization')
+ assert.strictEqual($carousel.data('bs.carousel')._config.interval, 1814, 'attributes should be read only on initialization')
$carousel.remove()
$carousel.attr('data-interval', false)
$carousel.appendTo('body')
$carousel.bootstrapCarousel(1)
- assert.strictEqual($carousel.data('bs.carousel').options.interval, false, 'data attribute has higher priority than default options')
+ assert.strictEqual($carousel.data('bs.carousel')._config.interval, false, 'data attribute has higher priority than default options')
$carousel.remove()
})
@@ -363,14 +395,14 @@ $(function () {
assert.expect(2)
var templateHTML = '<div id="myCarousel" class="carousel" data-interval="1814">'
+ '<div class="carousel-inner">'
- + '<div class="item active">'
+ + '<div class="carousel-item active">'
+ '<img alt="">'
+ '</div>'
+ '<script type="text/x-metamorph" id="thingy"/>'
- + '<div class="item">'
+ + '<div class="carousel-item">'
+ '<img alt="">'
+ '</div>'
- + '<div class="item">'
+ + '<div class="carousel-item">'
+ '</div>'
+ '</div>'
+ '</div>'
@@ -378,25 +410,25 @@ $(function () {
$template.bootstrapCarousel()
- assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active')
+ assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item active')
$template.bootstrapCarousel(1)
- assert.strictEqual($template.find('.item')[1], $template.find('.active')[0], 'second item active')
+ assert.strictEqual($template.find('.carousel-item')[1], $template.find('.active')[0], 'second item active')
})
QUnit.test('should skip over non-items when using next/prev methods', function (assert) {
assert.expect(2)
var templateHTML = '<div id="myCarousel" class="carousel" data-interval="1814">'
+ '<div class="carousel-inner">'
- + '<div class="item active">'
+ + '<div class="carousel-item active">'
+ '<img alt="">'
+ '</div>'
+ '<script type="text/x-metamorph" id="thingy"/>'
- + '<div class="item">'
+ + '<div class="carousel-item">'
+ '<img alt="">'
+ '</div>'
- + '<div class="item">'
+ + '<div class="carousel-item">'
+ '</div>'
+ '</div>'
+ '</div>'
@@ -404,24 +436,24 @@ $(function () {
$template.bootstrapCarousel()
- assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active')
+ assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item active')
$template.bootstrapCarousel('next')
- assert.strictEqual($template.find('.item')[1], $template.find('.active')[0], 'second item active')
+ assert.strictEqual($template.find('.carousel-item')[1], $template.find('.active')[0], 'second item active')
})
QUnit.test('should go to previous item if left arrow key is pressed', function (assert) {
assert.expect(2)
var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false">'
+ '<div class="carousel-inner">'
- + '<div id="first" class="item">'
+ + '<div id="first" class="carousel-item">'
+ '<img alt="">'
+ '</div>'
- + '<div id="second" class="item active">'
+ + '<div id="second" class="carousel-item active">'
+ '<img alt="">'
+ '</div>'
- + '<div id="third" class="item">'
+ + '<div id="third" class="carousel-item">'
+ '<img alt="">'
+ '</div>'
+ '</div>'
@@ -430,24 +462,24 @@ $(function () {
$template.bootstrapCarousel()
- assert.strictEqual($template.find('.item')[1], $template.find('.active')[0], 'second item active')
+ assert.strictEqual($template.find('.carousel-item')[1], $template.find('.active')[0], 'second item active')
$template.trigger($.Event('keydown', { which: 37 }))
- assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active')
+ assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item active')
})
QUnit.test('should go to next item if right arrow key is pressed', function (assert) {
assert.expect(2)
var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false">'
+ '<div class="carousel-inner">'
- + '<div id="first" class="item active">'
+ + '<div id="first" class="carousel-item active">'
+ '<img alt="">'
+ '</div>'
- + '<div id="second" class="item">'
+ + '<div id="second" class="carousel-item">'
+ '<img alt="">'
+ '</div>'
- + '<div id="third" class="item">'
+ + '<div id="third" class="carousel-item">'
+ '<img alt="">'
+ '</div>'
+ '</div>'
@@ -456,24 +488,24 @@ $(function () {
$template.bootstrapCarousel()
- assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active')
+ assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item active')
$template.trigger($.Event('keydown', { which: 39 }))
- assert.strictEqual($template.find('.item')[1], $template.find('.active')[0], 'second item active')
+ assert.strictEqual($template.find('.carousel-item')[1], $template.find('.active')[0], 'second item active')
})
QUnit.test('should support disabling the keyboard navigation', function (assert) {
assert.expect(3)
var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false" data-keyboard="false">'
+ '<div class="carousel-inner">'
- + '<div id="first" class="item active">'
+ + '<div id="first" class="carousel-item active">'
+ '<img alt="">'
+ '</div>'
- + '<div id="second" class="item">'
+ + '<div id="second" class="carousel-item">'
+ '<img alt="">'
+ '</div>'
- + '<div id="third" class="item">'
+ + '<div id="third" class="carousel-item">'
+ '<img alt="">'
+ '</div>'
+ '</div>'
@@ -482,30 +514,30 @@ $(function () {
$template.bootstrapCarousel()
- assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active')
+ assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item active')
$template.trigger($.Event('keydown', { which: 39 }))
- assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after right arrow press')
+ assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item still active after right arrow press')
$template.trigger($.Event('keydown', { which: 37 }))
- assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after left arrow press')
+ assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item still active after left arrow press')
})
QUnit.test('should ignore keyboard events within <input>s and <textarea>s', function (assert) {
assert.expect(7)
var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false">'
+ '<div class="carousel-inner">'
- + '<div id="first" class="item active">'
+ + '<div id="first" class="carousel-item active">'
+ '<img alt="">'
+ '<input type="text" id="in-put">'
+ '<textarea id="text-area"></textarea>'
+ '</div>'
- + '<div id="second" class="item">'
+ + '<div id="second" class="carousel-item">'
+ '<img alt="">'
+ '</div>'
- + '<div id="third" class="item">'
+ + '<div id="third" class="carousel-item">'
+ '<img alt="">'
+ '</div>'
+ '</div>'
@@ -519,21 +551,21 @@ $(function () {
$template.bootstrapCarousel()
- assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active')
+ assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item active')
$input.trigger($.Event('keydown', { which: 39 }))
- assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after right arrow press in <input>')
+ assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item still active after right arrow press in <input>')
$input.trigger($.Event('keydown', { which: 37 }))
- assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after left arrow press in <input>')
+ assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item still active after left arrow press in <input>')
$textarea.trigger($.Event('keydown', { which: 39 }))
- assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after right arrow press in <textarea>')
+ assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item still active after right arrow press in <textarea>')
$textarea.trigger($.Event('keydown', { which: 37 }))
- assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after left arrow press in <textarea>')
+ assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item still active after left arrow press in <textarea>')
})
QUnit.test('should only add mouseenter and mouseleave listeners when not on mobile', function (assert) {
@@ -541,13 +573,13 @@ $(function () {
var isMobile = 'ontouchstart' in document.documentElement
var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false" data-pause="hover">'
+ '<div class="carousel-inner">'
- + '<div id="first" class="item active">'
+ + '<div id="first" class="carousel-item active">'
+ '<img alt="">'
+ '</div>'
- + '<div id="second" class="item">'
+ + '<div id="second" class="carousel-item">'
+ '<img alt="">'
+ '</div>'
- + '<div id="third" class="item">'
+ + '<div id="third" class="carousel-item">'
+ '<img alt="">'
+ '</div>'
+ '</div>'
@@ -568,13 +600,13 @@ $(function () {
+ '<li data-target="#carousel-example-generic" data-slide-to="2"/>'
+ '</ol>'
+ '<div class="carousel-inner">'
- + '<div class="item active" id="one">'
+ + '<div class="carousel-item active" id="one">'
+ '<div class="carousel-caption"/>'
+ '</div>'
- + '<div class="item" id="two">'
+ + '<div class="carousel-item" id="two">'
+ '<div class="carousel-caption"/>'
+ '</div>'
- + '<div class="item" id="three">'
+ + '<div class="carousel-item" id="three">'
+ '<div class="carousel-caption"/>'
+ '</div>'
+ '</div>'
@@ -582,7 +614,7 @@ $(function () {
+ '<a class="right carousel-control" href="#carousel-example-generic" data-slide="next"/>'
+ '</div>'
var $carousel = $(carouselHTML)
- var getActiveId = function () { return $carousel.find('.item.active').attr('id') }
+ var getActiveId = function () { return $carousel.find('.carousel-item.active').attr('id') }
var done = assert.async()
@@ -613,13 +645,13 @@ $(function () {
+ '<li data-target="#carousel-example-generic" data-slide-to="2"/>'
+ '</ol>'
+ '<div class="carousel-inner">'
- + '<div class="item active" id="one">'
+ + '<div class="carousel-item active" id="one">'
+ '<div class="carousel-caption"/>'
+ '</div>'
- + '<div class="item" id="two">'
+ + '<div class="carousel-item" id="two">'
+ '<div class="carousel-caption"/>'
+ '</div>'
- + '<div class="item" id="three">'
+ + '<div class="carousel-item" id="three">'
+ '<div class="carousel-caption"/>'
+ '</div>'
+ '</div>'
@@ -632,7 +664,7 @@ $(function () {
$carousel
.on('slid.bs.carousel', function () {
- assert.strictEqual($carousel.find('.item.active').attr('id'), 'three', 'carousel wrapped around and slid from 1st to 3rd slide')
+ assert.strictEqual($carousel.find('.carousel-item.active').attr('id'), 'three', 'carousel wrapped around and slid from 1st to 3rd slide')
done()
})
.bootstrapCarousel('prev')
@@ -647,13 +679,13 @@ $(function () {
+ '<li data-target="#carousel-example-generic" data-slide-to="2"/>'
+ '</ol>'
+ '<div class="carousel-inner">'
- + '<div class="item active" id="one">'
+ + '<div class="carousel-item active" id="one">'
+ '<div class="carousel-caption"/>'
+ '</div>'
- + '<div class="item" id="two">'
+ + '<div class="carousel-item" id="two">'
+ '<div class="carousel-caption"/>'
+ '</div>'
- + '<div class="item" id="three">'
+ + '<div class="carousel-item" id="three">'
+ '<div class="carousel-caption"/>'
+ '</div>'
+ '</div>'
@@ -661,7 +693,7 @@ $(function () {
+ '<a class="right carousel-control" href="#carousel-example-generic" data-slide="next"/>'
+ '</div>'
var $carousel = $(carouselHTML)
- var getActiveId = function () { return $carousel.find('.item.active').attr('id') }
+ var getActiveId = function () { return $carousel.find('.carousel-item.active').attr('id') }
var done = assert.async()
@@ -693,13 +725,13 @@ $(function () {
+ '<li data-target="#carousel-example-generic" data-slide-to="2"/>'
+ '</ol>'
+ '<div class="carousel-inner">'
- + '<div class="item active" id="one">'
+ + '<div class="carousel-item active" id="one">'
+ '<div class="carousel-caption"/>'
+ '</div>'
- + '<div class="item" id="two">'
+ + '<div class="carousel-item" id="two">'
+ '<div class="carousel-caption"/>'
+ '</div>'
- + '<div class="item" id="three">'
+ + '<div class="carousel-item" id="three">'
+ '<div class="carousel-caption"/>'
+ '</div>'
+ '</div>'
@@ -713,6 +745,6 @@ $(function () {
assert.ok(false, 'carousel slid when it should not have slid')
})
.bootstrapCarousel('prev')
- assert.strictEqual($carousel.find('.item.active').attr('id'), 'one', 'carousel did not wrap around and stayed on 1st slide')
+ assert.strictEqual($carousel.find('.carousel-item.active').attr('id'), 'one', 'carousel did not wrap around and stayed on 1st slide')
})
})
diff --git a/js/tests/unit/collapse.js b/js/tests/unit/collapse.js
index 0efa65400..78fafc6c2 100644
--- a/js/tests/unit/collapse.js
+++ b/js/tests/unit/collapse.js
@@ -355,7 +355,7 @@ $(function () {
$('<div id="body1" aria-expanded="true" class="in"/>').appendTo($groups.eq(0))
- var $target2 = $('<a class="collapsed" data-toggle="collapse" role="button" href="#body2" data-parent="#accordion"/>').appendTo($groups.eq(1))
+ var $target2 = $('<a role="button" data-toggle="collapse" href="#body2" data-parent="#accordion" class="collapsed" />').appendTo($groups.eq(1))
$('<div id="body2" aria-expanded="false"/>').appendTo($groups.eq(1))
@@ -400,7 +400,7 @@ $(function () {
$body2
.toggleClass('in collapsing')
- .data('bs.collapse').transitioning = 1
+ .data('bs.collapse')._isTransitioning = 1
$target1.trigger('click')
diff --git a/js/tests/unit/modal.js b/js/tests/unit/modal.js
index 217e4d7f7..6da09e3c6 100644
--- a/js/tests/unit/modal.js
+++ b/js/tests/unit/modal.js
@@ -34,7 +34,7 @@ $(function () {
QUnit.test('should expose defaults var for settings', function (assert) {
assert.expect(1)
- assert.ok($.fn.bootstrapModal.Constructor.DEFAULTS, 'default object exposed')
+ assert.ok($.fn.bootstrapModal.Constructor.Default, 'default object exposed')
})
QUnit.test('should insert into dom when show method is called', function (assert) {
diff --git a/js/tests/unit/popover.js b/js/tests/unit/popover.js
index a25df3a58..8347e9f03 100644
--- a/js/tests/unit/popover.js
+++ b/js/tests/unit/popover.js
@@ -16,6 +16,7 @@ $(function () {
afterEach: function () {
$.fn.popover = $.fn.bootstrapPopover
delete $.fn.bootstrapPopover
+ $('.popover').remove()
}
})
@@ -81,6 +82,7 @@ $(function () {
assert.strictEqual($('.popover .popover-content').text(), 'loves writing tests （╯°□°）╯︵ ┻━┻', 'content correctly inserted')
$popover.bootstrapPopover('hide')
+
assert.strictEqual($('.popover').length, 0, 'popover was removed')
})
@@ -91,6 +93,7 @@ $(function () {
var $popover = $('<a href="#">@fat</a>')
.appendTo('#qunit-fixture')
.bootstrapPopover({
+ html: true,
content: function () {
return $div
}
@@ -98,14 +101,14 @@ $(function () {
$popover.bootstrapPopover('show')
assert.notEqual($('.popover').length, 0, 'popover was inserted')
- assert.equal($('.popover .popover-content').html(), $div, 'content correctly inserted')
+ assert.equal($('.popover .popover-content').html(), $div[0].outerHTML, 'content correctly inserted')
$popover.bootstrapPopover('hide')
assert.strictEqual($('.popover').length, 0, 'popover was removed')
$popover.bootstrapPopover('show')
assert.notEqual($('.popover').length, 0, 'popover was inserted')
- assert.equal($('.popover .popover-content').html(), $div, 'content correctly inserted')
+ assert.equal($('.popover .popover-content').html(), $div[0].outerHTML, 'content correctly inserted')
$popover.bootstrapPopover('hide')
assert.strictEqual($('.popover').length, 0, 'popover was removed')
@@ -126,7 +129,6 @@ $(function () {
assert.strictEqual($('.popover').length, 0, 'popover was removed')
})
-
QUnit.test('should get title and content from attributes ignoring options passed via js', function (assert) {
assert.expect(4)
var $popover = $('<a href="#" title="@mdo" data-content="loves data attributes (づ｡◕‿‿◕｡)づ ︵ ┻━┻" >@mdo</a>')
@@ -177,7 +179,7 @@ $(function () {
assert.strictEqual($._data($popover[0], 'events').click[0].namespace, 'foo', 'popover has extra click.foo event')
$popover.bootstrapPopover('show')
- $popover.bootstrapPopover('destroy')
+ $popover.bootstrapPopover('dispose')
assert.ok(!$popover.hasClass('in'), 'popover is hidden')
assert.ok(!$popover.data('popover'), 'popover does not have data')
@@ -229,7 +231,7 @@ $(function () {
$div
.one('shown.bs.popover', function () {
$('.content-with-handler .btn').trigger('click')
- $div.bootstrapPopover('destroy')
+ $div.bootstrapPopover('dispose')
assert.ok(handlerCalled, 'content\'s event handler still present')
done()
})
@@ -240,13 +242,6 @@ $(function () {
.bootstrapPopover('show')
})
- QUnit.test('should throw an error when initializing popover on the document object without specifying a delegation selector', function (assert) {
- assert.expect(1)
- assert.throws(function () {
- $(document).bootstrapPopover({ title: 'What am I on?', content: 'My selector is missing' })
- }, new Error('`selector` option must be specified when initializing popover on the window.document object!'))
- })
-
QUnit.test('should do nothing when an attempt is made to hide an uninitialized popover', function (assert) {
assert.expect(1)
@@ -259,16 +254,6 @@ $(function () {
assert.strictEqual($popover.data('bs.popover'), undefined, 'should not initialize the popover')
})
- QUnit.test('should throw an error when template contains multiple top-level elements', function (assert) {
- assert.expect(1)
- assert.throws(function () {
- $('<span data-toggle="popover" data-title="some title" data-content="some content">some text</span>')
- .appendTo('#qunit-fixture')
- .bootstrapPopover({ template: '<div>Foo</div><div>Bar</div>' })
- .bootstrapPopover('show')
- }, new Error('popover `template` option must consist of exactly 1 top-level element!'))
- })
-
QUnit.test('should fire inserted event', function (assert) {
assert.expect(2)
var done = assert.async()
diff --git a/js/tests/unit/scrollspy.js b/js/tests/unit/scrollspy.js
index bf5fa0bff..063dfabcf 100644
--- a/js/tests/unit/scrollspy.js
+++ b/js/tests/unit/scrollspy.js
@@ -77,6 +77,51 @@ $(function () {
$scrollspy.scrollTop(350)
})
+ QUnit.test('should only switch "active" class on current target specified w element', function (assert) {
+ assert.expect(1)
+ var done = assert.async()
+
+ var sectionHTML = '<div id="root" class="active">'
+ + '<div class="topbar">'
+ + '<div class="topbar-inner">'
+ + '<div class="container" id="ss-target">'
+ + '<ul class="nav">'
+ + '<li><a href="#masthead">Overview</a></li>'
+ + '<li><a href="#detail">Detail</a></li>'
+ + '</ul>'
+ + '</div>'
+ + '</div>'
+ + '</div>'
+ + '<div id="scrollspy-example" style="height: 100px; overflow: auto;">'
+ + '<div style="height: 200px;">'
+ + '<h4 id="masthead">Overview</h4>'
+ + '<p style="height: 200px">'
+ + 'Ad leggings keytar, brunch id art party dolor labore.'
+ + '</p>'
+ + '</div>'
+ + '<div style="height: 200px;">'
+ + '<h4 id="detail">Detail</h4>'
+ + '<p style="height: 200px">'
+ + 'Veniam marfa mustache skateboard, adipisicing fugiat velit pitchfork beard.'
+ + '</p>'
+ + '</div>'
+ + '</div>'
+ + '</div>'
+ var $section = $(sectionHTML).appendTo('#qunit-fixture')
+
+ var $scrollspy = $section
+ .show()
+ .find('#scrollspy-example')
+ .bootstrapScrollspy({ target: document.getElementById('#ss-target') })
+
+ $scrollspy.on('scroll.bs.scrollspy', function () {
+ assert.ok($section.hasClass('active'), '"active" class still on root node')
+ done()
+ })
+
+ $scrollspy.scrollTop(350)
+ })
+
QUnit.test('should correctly select middle navigation option when large offset is used', function (assert) {
assert.expect(3)
var done = assert.async()
@@ -275,4 +320,90 @@ $(function () {
.then(function () { return testElementIsActiveAfterScroll('#li-100-1', '#div-100-1') })
})
+ QUnit.test('should allow passed in option offset method: offset', function (assert) {
+ assert.expect(4)
+
+ var testOffsetMethod = function (type) {
+ var deferred = $.Deferred()
+ var navbarHtml =
+ '<nav class="navbar"' + (type === 'data' ? ' id="navbar-offset-method-menu"' : '') + '>'
+ + '<ul class="nav">'
+ + '<li id="li-' + type + 'm-1"><a href="#div-' + type + 'm-1">div 1</a></li>'
+ + '<li id="li-' + type + 'm-2"><a href="#div-' + type + 'm-2">div 2</a></li>'
+ + '<li id="li-' + type + 'm-3"><a href="#div-' + type + 'm-3">div 3</a></li>'
+ + '</ul>'
+ + '</nav>'
+ var contentHtml =
+ '<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>'
+
+
+ $(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')
+
+ 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.position().top, 'position method with ' + type + ' option')
+
+ deferred.resolve()
+
+ return deferred.promise()
+ }
+
+ $.when(testOffsetMethod('js'))
+ .then(function () { 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 =
+ '<nav class="navbar"' + (type === 'data' ? ' id="navbar-offset-method-menu"' : '') + '>'
+ + '<ul class="nav">'
+ + '<li id="li-' + type + 'm-1"><a href="#div-' + type + 'm-1">div 1</a></li>'
+ + '<li id="li-' + type + 'm-2"><a href="#div-' + type + 'm-2">div 2</a></li>'
+ + '<li id="li-' + type + 'm-3"><a href="#div-' + type + 'm-3">div 3</a></li>'
+ + '</ul>'
+ + '</nav>'
+ var contentHtml =
+ '<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')
+
+ if (type === 'js') $content.bootstrapScrollspy({ target: '.navbar', offset: 0, method: 'position' })
+ else if (type === 'data') $(window).trigger('load.bs.scrollspy.data-api')
+
+ 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.position().top, 'position method with ' + type + ' option')
+
+ deferred.resolve()
+
+ return deferred.promise()
+ }
+
+ $.when(testOffsetMethod('js'))
+ .then(function () { testOffsetMethod('data') })
+ })
+
})
diff --git a/js/tests/unit/tooltip.js b/js/tests/unit/tooltip.js
index 27ce6208e..f4deb29f8 100644
--- a/js/tests/unit/tooltip.js
+++ b/js/tests/unit/tooltip.js
@@ -16,6 +16,7 @@ $(function () {
afterEach: function () {
$.fn.tooltip = $.fn.bootstrapTooltip
delete $.fn.bootstrapTooltip
+ $('.tooltip').remove()
}
})
@@ -34,7 +35,7 @@ $(function () {
QUnit.test('should expose default settings', function (assert) {
assert.expect(1)
- assert.ok($.fn.bootstrapTooltip.Constructor.DEFAULTS, 'defaults is defined')
+ assert.ok($.fn.bootstrapTooltip.Constructor.Default, 'defaults is defined')
})
QUnit.test('should empty title attribute', function (assert) {
@@ -95,10 +96,14 @@ $(function () {
.bootstrapTooltip({ placement: 'bottom' })
$tooltip.bootstrapTooltip('show')
- assert.ok($('.tooltip').is('.fade.bottom.in'), 'has correct classes applied')
+
+ assert
+ .ok($('.tooltip')
+ .is('.fade.bs-tether-element-attached-top.bs-tether-element-attached-center.in'), 'has correct classes applied')
$tooltip.bootstrapTooltip('hide')
- assert.strictEqual($('.tooltip').length, 0, 'tooltip removed')
+
+ assert.strictEqual($tooltip.data('bs.tooltip').tip.parentNode, null, 'tooltip removed')
})
QUnit.test('should allow html entities', function (assert) {
@@ -111,7 +116,7 @@ $(function () {
assert.notEqual($('.tooltip b').length, 0, 'b tag was inserted')
$tooltip.bootstrapTooltip('hide')
- assert.strictEqual($('.tooltip').length, 0, 'tooltip removed')
+ assert.strictEqual($tooltip.data('bs.tooltip').tip.parentNode, null, 'tooltip removed')
})
QUnit.test('should respect custom classes', function (assert) {
@@ -124,7 +129,7 @@ $(function () {
assert.ok($('.tooltip').hasClass('some-class'), 'custom class is present')
$tooltip.bootstrapTooltip('hide')
- assert.strictEqual($('.tooltip').length, 0, 'tooltip removed')
+ assert.strictEqual($tooltip.data('bs.tooltip').tip.parentNode, null, 'tooltip removed')
})
QUnit.test('should fire show event', function (assert) {
@@ -245,7 +250,7 @@ $(function () {
assert.strictEqual($._data($tooltip[0], 'events').click[0].namespace, 'foo', 'tooltip has extra click.foo event')
$tooltip.bootstrapTooltip('show')
- $tooltip.bootstrapTooltip('destroy')
+ $tooltip.bootstrapTooltip('dispose')
assert.ok(!$tooltip.hasClass('in'), 'tooltip is hidden')
assert.ok(!$._data($tooltip[0], 'bs.tooltip'), 'tooltip does not have data')
@@ -253,21 +258,21 @@ $(function () {
assert.ok(!$._data($tooltip[0], 'events').mouseover && !$._data($tooltip[0], 'events').mouseout, 'tooltip does not have hover events')
})
- QUnit.test('should show tooltip with delegate selector on click', function (assert) {
- assert.expect(2)
- var $div = $('<div><a href="#" rel="tooltip" title="Another tooltip"/></div>')
- .appendTo('#qunit-fixture')
- .bootstrapTooltip({
- selector: 'a[rel="tooltip"]',
- trigger: 'click'
- })
+ // QUnit.test('should show tooltip with delegate selector on click', function (assert) {
+ // assert.expect(2)
+ // var $div = $('<div><a href="#" rel="tooltip" title="Another tooltip"/></div>')
+ // .appendTo('#qunit-fixture')
+ // .bootstrapTooltip({
+ // selector: 'a[rel="tooltip"]',
+ // trigger: 'click'
+ // })
- $div.find('a').trigger('click')
- assert.ok($('.tooltip').is('.fade.in'), 'tooltip is faded in')
+ // $div.find('a').trigger('click')
+ // assert.ok($('.tooltip').is('.fade.in'), 'tooltip is faded in')
- $div.find('a').trigger('click')
- assert.strictEqual($('.tooltip').length, 0, 'tooltip was removed from dom')
- })
+ // $div.find('a').trigger('click')
+ // assert.strictEqual($div.data('bs.tooltip').tip.parentNode, null, 'tooltip removed')
+ // })
QUnit.test('should show tooltip when toggle is called', function (assert) {
assert.expect(1)
@@ -307,20 +312,20 @@ $(function () {
QUnit.test('should add position class before positioning so that position-specific styles are taken into account', function (assert) {
assert.expect(1)
var styles = '<style>'
- + '.tooltip.right { white-space: nowrap; }'
- + '.tooltip.right .tooltip-inner { max-width: none; }'
- + '</style>'
+ + '.tooltip.right { white-space: nowrap; }'
+ + '.tooltip.right .tooltip-inner { max-width: none; }'
+ + '</style>'
var $styles = $(styles).appendTo('head')
var $container = $('<div/>').appendTo('#qunit-fixture')
var $target = $('<a href="#" rel="tooltip" title="very very very very very very very very long tooltip in one line"/>')
.appendTo($container)
.bootstrapTooltip({
- placement: 'right',
- viewport: null
+ placement: 'right'
})
.bootstrapTooltip('show')
- var $tooltip = $container.find('.tooltip')
+
+ var $tooltip = $($target.data('bs.tooltip').tip)
// this is some dumb hack shit because sub pixels in firefox
var top = Math.round($target.offset().top + ($target[0].offsetHeight / 2) - ($tooltip[0].offsetHeight / 2))
@@ -376,444 +381,7 @@ $(function () {
assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
})
- QUnit.test('should be placed dynamically to viewport with the dynamic placement option', function (assert) {
- assert.expect(6)
- var $style = $('<style> div[rel="tooltip"] { position: absolute; } #qunit-fixture { top: inherit; left: inherit } </style>').appendTo('head')
- var $container = $('<div/>')
- .css({
- position: 'relative',
- height: '100%'
- })
- .appendTo('#qunit-fixture')
-
- var $topTooltip = $('<div style="left: 0; top: 0;" rel="tooltip" title="Top tooltip">Top Dynamic Tooltip</div>')
- .appendTo($container)
- .bootstrapTooltip({ placement: 'auto', viewport: '#qunit-fixture' })
-
- $topTooltip.bootstrapTooltip('show')
- assert.ok($('.tooltip').is('.bottom'), 'top positioned tooltip is dynamically positioned to bottom')
-
- $topTooltip.bootstrapTooltip('hide')
- assert.strictEqual($('.tooltip').length, 0, 'top positioned tooltip removed from dom')
-
- var $rightTooltip = $('<div style="right: 0;" rel="tooltip" title="Right tooltip">Right Dynamic Tooltip</div>')
- .appendTo($container)
- .bootstrapTooltip({ placement: 'right auto', viewport: '#qunit-fixture' })
-
- $rightTooltip.bootstrapTooltip('show')
- assert.ok($('.tooltip').is('.left'), 'right positioned tooltip is dynamically positioned left')
-
- $rightTooltip.bootstrapTooltip('hide')
- assert.strictEqual($('.tooltip').length, 0, 'right positioned tooltip removed from dom')
-
- var $leftTooltip = $('<div style="left: 0;" rel="tooltip" title="Left tooltip">Left Dynamic Tooltip</div>')
- .appendTo($container)
- .bootstrapTooltip({ placement: 'auto left', viewport: '#qunit-fixture' })
-
- $leftTooltip.bootstrapTooltip('show')
- assert.ok($('.tooltip').is('.right'), 'left positioned tooltip is dynamically positioned right')
-
- $leftTooltip.bootstrapTooltip('hide')
- assert.strictEqual($('.tooltip').length, 0, 'left positioned tooltip removed from dom')
-
- $container.remove()
- $style.remove()
- })
-
- QUnit.test('should position tip on top if viewport has enough space and placement is "auto top"', function (assert) {
- assert.expect(2)
- var styles = '<style>'
- + 'body { padding-top: 100px; }'
- + '#section { height: 300px; border: 1px solid red; padding-top: 50px }'
- + 'div[rel="tooltip"] { width: 150px; border: 1px solid blue; }'
- + '</style>'
- var $styles = $(styles).appendTo('head')
-
- var $container = $('<div id="section"/>').appendTo('#qunit-fixture')
- var $target = $('<div rel="tooltip" title="tip"/>')
- .appendTo($container)
- .bootstrapTooltip({
- placement: 'auto top',
- viewport: '#section'
- })
-
- $target.bootstrapTooltip('show')
- assert.ok($('.tooltip').is('.top'), 'top positioned tooltip is dynamically positioned to top')
-
- $target.bootstrapTooltip('hide')
- assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
-
- $styles.remove()
- })
-
- QUnit.test('should position tip on top if viewport has enough space and is not parent', function (assert) {
- assert.expect(2)
- var styles = '<style>'
- + '#section { height: 300px; border: 1px solid red; margin-top: 100px; }'
- + 'div[rel="tooltip"] { width: 150px; border: 1px solid blue; }'
- + '</style>'
- var $styles = $(styles).appendTo('head')
-
- var $container = $('<div id="section"/>').appendTo('#qunit-fixture')
- var $target = $('<div rel="tooltip" title="tip"/>')
- .appendTo($container)
- .bootstrapTooltip({
- placement: 'auto top',
- viewport: '#qunit-fixture'
- })
-
- $target.bootstrapTooltip('show')
- assert.ok($('.tooltip').is('.top'), 'top positioned tooltip is dynamically positioned to top')
-
- $target.bootstrapTooltip('hide')
- assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
-
- $styles.remove()
- })
-
- QUnit.test('should position tip on bottom if the tip\'s dimension exceeds the viewport area and placement is "auto top"', function (assert) {
- assert.expect(2)
- var styles = '<style>'
- + 'body { padding-top: 100px; }'
- + '#section { height: 300px; border: 1px solid red; }'
- + 'div[rel="tooltip"] { width: 150px; border: 1px solid blue; }'
- + '</style>'
- var $styles = $(styles).appendTo('head')
-
- var $container = $('<div id="section"/>').appendTo('#qunit-fixture')
- var $target = $('<div rel="tooltip" title="tip"/>')
- .appendTo($container)
- .bootstrapTooltip({
- placement: 'auto top',
- viewport: '#section'
- })
-
- $target.bootstrapTooltip('show')
- assert.ok($('.tooltip').is('.bottom'), 'top positioned tooltip is dynamically positioned to bottom')
-
- $target.bootstrapTooltip('hide')
- assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
-
- $styles.remove()
- })
-
- QUnit.test('should display the tip on top whenever scrollable viewport has enough room if the given placement is "auto top"', function (assert) {
- assert.expect(2)
- var styles = '<style>'
- + '#scrollable-div { height: 200px; overflow: auto; }'
- + '.tooltip-item { margin: 200px 0 400px; width: 150px; }'
- + '</style>'
- var $styles = $(styles).appendTo('head')
-
- var $container = $('<div id="scrollable-div"/>').appendTo('#qunit-fixture')
- var $target = $('<div rel="tooltip" title="tip" class="tooltip-item">Tooltip Item</div>')
- .appendTo($container)
- .bootstrapTooltip({
- placement: 'top auto',
- viewport: '#scrollable-div'
- })
-
- $('#scrollable-div').scrollTop(100)
-
- $target.bootstrapTooltip('show')
- assert.ok($('.tooltip').is('.fade.top.in'), 'has correct classes applied')
-
- $target.bootstrapTooltip('hide')
- assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
-
- $styles.remove()
- })
-
- QUnit.test('should display the tip on bottom whenever scrollable viewport doesn\'t have enough room if the given placement is "auto top"', function (assert) {
- assert.expect(2)
- var styles = '<style>'
- + '#scrollable-div { height: 200px; overflow: auto; }'
- + '.tooltip-item { padding: 200px 0 400px; width: 150px; }'
- + '</style>'
- var $styles = $(styles).appendTo('head')
-
- var $container = $('<div id="scrollable-div"/>').appendTo('#qunit-fixture')
- var $target = $('<div rel="tooltip" title="tip" class="tooltip-item">Tooltip Item</div>')
- .appendTo($container)
- .bootstrapTooltip({
- placement: 'top auto',
- viewport: '#scrollable-div'
- })
-
- $('#scrollable-div').scrollTop(200)
-
- $target.bootstrapTooltip('show')
- assert.ok($('.tooltip').is('.fade.bottom.in'), 'has correct classes applied')
-
- $target.bootstrapTooltip('hide')
- assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
-
- $styles.remove()
- })
-
- QUnit.test('should display the tip on bottom whenever scrollable viewport has enough room if the given placement is "auto bottom"', function (assert) {
- assert.expect(2)
- var styles = '<style>'
- + '#scrollable-div { height: 200px; overflow: auto; }'
- + '.spacer { height: 400px; }'
- + '.spacer:first-child { height: 200px; }'
- + '.tooltip-item { width: 150px; }'
- + '</style>'
- var $styles = $(styles).appendTo('head')
-
- var $container = $('<div id="scrollable-div"/>').appendTo('#qunit-fixture')
- var $target = $('<div rel="tooltip" title="tip" class="tooltip-item">Tooltip Item</div>')
- .appendTo($container)
- .before('<div class="spacer"/>')
- .after('<div class="spacer"/>')
- .bootstrapTooltip({
- placement: 'bottom auto',
- viewport: '#scrollable-div'
- })
-
- $('#scrollable-div').scrollTop(200)
-
- $target.bootstrapTooltip('show')
- assert.ok($('.tooltip').is('.fade.bottom.in'), 'has correct classes applied')
-
- $target.bootstrapTooltip('hide')
- assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
-
- $styles.remove()
- })
-
- QUnit.test('should display the tip on top whenever scrollable viewport doesn\'t have enough room if the given placement is "auto bottom"', function (assert) {
- assert.expect(2)
- var styles = '<style>'
- + '#scrollable-div { height: 200px; overflow: auto; }'
- + '.tooltip-item { margin-top: 400px; width: 150px; }'
- + '</style>'
- var $styles = $(styles).appendTo('head')
-
- var $container = $('<div id="scrollable-div"/>').appendTo('#qunit-fixture')
- var $target = $('<div rel="tooltip" title="tip" class="tooltip-item">Tooltip Item</div>')
- .appendTo($container)
- .bootstrapTooltip({
- placement: 'bottom auto',
- viewport: '#scrollable-div'
- })
-
- $('#scrollable-div').scrollTop(400)
-
- $target.bootstrapTooltip('show')
- assert.ok($('.tooltip').is('.fade.top.in'), 'has correct classes applied')
-
- $target.bootstrapTooltip('hide')
- assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
-
- $styles.remove()
- })
-
- QUnit.test('should adjust the tip\'s top position when up against the top of the viewport', function (assert) {
- assert.expect(2)
- var styles = '<style>'
- + '.tooltip .tooltip-inner { width: 200px; height: 200px; max-width: none; }'
- + 'a[rel="tooltip"] { position: fixed; }'
- + '</style>'
- var $styles = $(styles).appendTo('head')
-
- var $container = $('<div/>').appendTo('#qunit-fixture')
- var $target = $('<a href="#" rel="tooltip" title="tip" style="top: 0px; left: 0px;"/>')
- .appendTo($container)
- .bootstrapTooltip({
- placement: 'right',
- viewport: {
- selector: 'body',
- padding: 12
- }
- })
-
- $target.bootstrapTooltip('show')
- assert.strictEqual(Math.round($container.find('.tooltip').offset().top), 12)
-
- $target.bootstrapTooltip('hide')
- assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
-
- $styles.remove()
- })
-
- QUnit.test('should adjust the tip\'s top position when up against the bottom of the viewport', function (assert) {
- assert.expect(2)
- var styles = '<style>'
- + '.tooltip .tooltip-inner { width: 200px; height: 200px; max-width: none; }'
- + 'a[rel="tooltip"] { position: fixed; }'
- + '</style>'
- var $styles = $(styles).appendTo('head')
-
- var $container = $('<div/>').appendTo('#qunit-fixture')
- var $target = $('<a href="#" rel="tooltip" title="tip" style="bottom: 0px; left: 0px;"/>')
- .appendTo($container)
- .bootstrapTooltip({
- placement: 'right',
- viewport: {
- selector: 'body',
- padding: 12
- }
- })
-
- $target.bootstrapTooltip('show')
- var $tooltip = $container.find('.tooltip')
- assert.strictEqual(Math.round($tooltip.offset().top), Math.round($(window).height() - 12 - $tooltip[0].offsetHeight))
-
- $target.bootstrapTooltip('hide')
- assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
-
- $container.remove()
- $styles.remove()
- })
-
- QUnit.test('should adjust the tip\'s left position when up against the left of the viewport', function (assert) {
- assert.expect(2)
- var styles = '<style>'
- + '.tooltip .tooltip-inner { width: 200px; height: 200px; max-width: none; }'
- + 'a[rel="tooltip"] { position: fixed; }'
- + '</style>'
- var $styles = $(styles).appendTo('head')
-
- var $container = $('<div/>').appendTo('#qunit-fixture')
- var $target = $('<a href="#" rel="tooltip" title="tip" style="top: 0px; left: 0px;"/>')
- .appendTo($container)
- .bootstrapTooltip({
- placement: 'bottom',
- viewport: {
- selector: 'body',
- padding: 12
- }
- })
-
- $target.bootstrapTooltip('show')
- assert.strictEqual(Math.round($container.find('.tooltip').offset().left), 12)
-
- $target.bootstrapTooltip('hide')
- assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
-
- $container.remove()
- $styles.remove()
- })
-
- QUnit.test('should adjust the tip\'s left position when up against the right of the viewport', function (assert) {
- assert.expect(2)
- var styles = '<style>'
- + '.tooltip .tooltip-inner { width: 200px; height: 200px; max-width: none; }'
- + 'a[rel="tooltip"] { position: fixed; }'
- + '</style>'
- var $styles = $(styles).appendTo('head')
-
- var $container = $('<div/>').appendTo('body')
- var $target = $('<a href="#" rel="tooltip" title="tip" style="top: 0px; right: 0px;"/>')
- .appendTo($container)
- .bootstrapTooltip({
- placement: 'bottom',
- viewport: {
- selector: 'body',
- padding: 12
- }
- })
-
- $target.bootstrapTooltip('show')
- var $tooltip = $container.find('.tooltip')
- assert.strictEqual(Math.round($tooltip.offset().left), Math.round($(window).width() - 12 - $tooltip[0].offsetWidth))
-
- $target.bootstrapTooltip('hide')
- assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
-
- $container.remove()
- $styles.remove()
- })
-
- QUnit.test('should adjust the tip when up against the right of an arbitrary viewport', function (assert) {
- assert.expect(2)
- var styles = '<style>'
- + '.tooltip, .tooltip .tooltip-inner { width: 200px; height: 200px; max-width: none; }'
- + '.container-viewport { position: absolute; top: 50px; left: 60px; width: 300px; height: 300px; }'
- + 'a[rel="tooltip"] { position: fixed; }'
- + '</style>'
- var $styles = $(styles).appendTo('head')
-
- var $container = $('<div class="container-viewport"/>').appendTo(document.body)
- var $target = $('<a href="#" rel="tooltip" title="tip" style="top: 50px; left: 350px;"/>')
- .appendTo($container)
- .bootstrapTooltip({
- placement: 'bottom',
- viewport: '.container-viewport'
- })
-
- $target.bootstrapTooltip('show')
- var $tooltip = $container.find('.tooltip')
- assert.strictEqual(Math.round($tooltip.offset().left), Math.round(60 + $container.width() - $tooltip[0].offsetWidth))
-
- $target.bootstrapTooltip('hide')
- assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
-
- $container.remove()
- $styles.remove()
- })
-
- QUnit.test('should get viewport element from function', function (assert) {
- assert.expect(3)
- var styles = '<style>'
- + '.tooltip, .tooltip .tooltip-inner { width: 200px; height: 200px; max-width: none; }'
- + '.container-viewport { position: absolute; top: 50px; left: 60px; width: 300px; height: 300px; }'
- + 'a[rel="tooltip"] { position: fixed; }'
- + '</style>'
- var $styles = $(styles).appendTo('head')
-
- var $container = $('<div class="container-viewport"/>').appendTo(document.body)
- var $target = $('<a href="#" rel="tooltip" title="tip" style="top: 50px; left: 350px;"/>').appendTo($container)
- $target
- .bootstrapTooltip({
- placement: 'bottom',
- viewport: function ($element) {
- assert.strictEqual($element[0], $target[0], 'viewport function was passed target as argument')
- return ($element.closest('.container-viewport'))
- }
- })
-
- $target.bootstrapTooltip('show')
- var $tooltip = $container.find('.tooltip')
- assert.strictEqual(Math.round($tooltip.offset().left), Math.round(60 + $container.width() - $tooltip[0].offsetWidth))
-
- $target.bootstrapTooltip('hide')
- assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
-
- $container.remove()
- $styles.remove()
- })
-
- QUnit.test('should not misplace the tip when the right edge offset is greater or equal than the viewport width', function (assert) {
- assert.expect(2)
- var styles = '<style>'
- + '.tooltip, .tooltip *, .tooltip *:before, .tooltip *:after { box-sizing: border-box; }'
- + '.container-viewport, .container-viewport *, .container-viewport *:before, .container-viewport *:after { box-sizing: border-box; }'
- + '.tooltip, .tooltip .tooltip-inner { width: 50px; height: 50px; max-width: none; background: red; }'
- + '.container-viewport { padding: 100px; margin-left: 100px; width: 100px; }'
- + '</style>'
- var $styles = $(styles).appendTo('head')
-
- var $container = $('<div class="container-viewport"/>').appendTo(document.body)
- var $target = $('<a href="#" rel="tooltip" title="tip">foobar</a>')
- .appendTo($container)
- .bootstrapTooltip({
- viewport: '.container-viewport'
- })
-
- $target.bootstrapTooltip('show')
- var $tooltip = $container.find('.tooltip')
- assert.strictEqual(Math.round($tooltip.offset().left), Math.round($target.position().left + $target.width() / 2 - $tooltip[0].offsetWidth / 2))
-
- $target.bootstrapTooltip('hide')
- assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
-
- $container.remove()
- $styles.remove()
- })
-
- QUnit.test('should not error when trying to show an auto-placed tooltip that has been removed from the dom', function (assert) {
+ QUnit.test('should not error when trying to show an top-placed tooltip that has been removed from the dom', function (assert) {
assert.expect(1)
var passed = true
var $tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"/>')
@@ -821,7 +389,7 @@ $(function () {
.one('show.bs.tooltip', function () {
$(this).remove()
})
- .bootstrapTooltip({ placement: 'auto' })
+ .bootstrapTooltip({ placement: 'top' })
try {
$tooltip.bootstrapTooltip('show')
@@ -863,7 +431,7 @@ $(function () {
})
.bootstrapTooltip('show')
- var $tooltip = $container.find('.tooltip')
+ var $tooltip = $($trigger.data('bs.tooltip').tip)
setTimeout(function () {
assert.ok(Math.round($tooltip.offset().top + $tooltip.outerHeight()) <= Math.round($trigger.offset().top))
@@ -871,38 +439,6 @@ $(function () {
}, 0)
})
- QUnit.test('should place tooltip inside viewport', function (assert) {
- assert.expect(1)
- var done = assert.async()
-
- var $container = $('<div/>')
- .css({
- position: 'absolute',
- width: 200,
- height: 200,
- bottom: 0,
- left: 0
- })
- .appendTo('#qunit-fixture')
-
- $('<a href="#" title="Very very very very very very very very long tooltip">Hover me</a>')
- .css({
- position: 'absolute',
- top: 0,
- left: 0
- })
- .appendTo($container)
- .bootstrapTooltip({
- placement: 'top'
- })
- .bootstrapTooltip('show')
-
- setTimeout(function () {
- assert.ok($('.tooltip').offset().left >= 0)
- done()
- }, 0)
- })
-
QUnit.test('should show tooltip if leave event hasn\'t occurred before delay expires', function (assert) {
assert.expect(2)
var done = assert.async()
@@ -1021,16 +557,16 @@ $(function () {
.bootstrapTooltip({ delay: { show: 0, hide: 150 }})
setTimeout(function () {
- assert.ok($tooltip.data('bs.tooltip').$tip.is('.fade.in'), '1ms: tooltip faded in')
+ assert.ok($($tooltip.data('bs.tooltip').tip).is('.fade.in'), '1ms: tooltip faded in')
$tooltip.trigger('mouseout')
setTimeout(function () {
- assert.ok($tooltip.data('bs.tooltip').$tip.is('.fade.in'), '100ms: tooltip still faded in')
+ assert.ok($($tooltip.data('bs.tooltip').tip).is('.fade.in'), '100ms: tooltip still faded in')
}, 100)
setTimeout(function () {
- assert.ok(!$tooltip.data('bs.tooltip').$tip.is('.in'), '200ms: tooltip removed')
+ assert.ok(!$($tooltip.data('bs.tooltip').tip).is('.in'), '200ms: tooltip removed')
done()
}, 200)
@@ -1073,57 +609,15 @@ $(function () {
assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
done()
})
- .bootstrapTooltip({ container: 'body', placement: 'top', trigger: 'manual' })
+ .bootstrapTooltip({ placement: 'top', trigger: 'manual' })
$circle.bootstrapTooltip('show')
})
- QUnit.test('should correctly determine auto placement based on container rather than parent', function (assert) {
- assert.expect(2)
- var done = assert.async()
-
- var styles = '<style>'
- + '.tooltip, .tooltip *, .tooltip *:before, .tooltip *:after { box-sizing: border-box; }'
- + '.tooltip { position: absolute; display: block; font-size: 12px; line-height: 1.4; }'
- + '.tooltip .tooltip-inner { max-width: 200px; padding: 3px 8px; font-family: Helvetica; text-align: center; }'
- + '#trigger-parent {'
- + ' position: fixed;'
- + ' top: 100px;'
- + ' right: 17px;'
- + '}'
- + '</style>'
- var $styles = $(styles).appendTo('head')
-
- $('#qunit-fixture').append('<span id="trigger-parent"><a id="tt-trigger" title="If a_larger_text is written here, it won\'t fit using older broken version of BS">HOVER OVER ME</a></span>')
- var $trigger = $('#tt-trigger')
-
- $trigger
- .on('shown.bs.tooltip', function () {
- var $tip = $('.tooltip-inner')
- var tipXrightEdge = $tip.offset().left + $tip.width()
- var triggerXleftEdge = $trigger.offset().left
- assert.ok(tipXrightEdge < triggerXleftEdge, 'tooltip with auto left placement, when near the right edge of the viewport, gets left placement')
- $trigger.bootstrapTooltip('hide')
- })
- .on('hidden.bs.tooltip', function () {
- $styles.remove()
- $(this).remove()
- assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
- done()
- })
- .bootstrapTooltip({
- container: 'body',
- placement: 'auto left',
- trigger: 'manual'
- })
-
- $trigger.bootstrapTooltip('show')
- })
-
QUnit.test('should not reload the tooltip on subsequent mouseenter events', function (assert) {
assert.expect(1)
var titleHtml = function () {
- var uid = $.fn.bootstrapTooltip.Constructor.prototype.getUID('tooltip')
+ var uid = Util.getUID('tooltip')
return '<p id="tt-content">' + uid + '</p><p>' + uid + '</p><p>' + uid + '</p>'
}
@@ -1149,8 +643,9 @@ $(function () {
QUnit.test('should not reload the tooltip if the mouse leaves and re-enters before hiding', function (assert) {
assert.expect(4)
+
var titleHtml = function () {
- var uid = $.fn.bootstrapTooltip.Constructor.prototype.getUID('tooltip')
+ var uid = Util.getUID('tooltip')
return '<p id="tt-content">' + uid + '</p><p>' + uid + '</p><p>' + uid + '</p>'
}
@@ -1162,7 +657,6 @@ $(function () {
animation: false,
trigger: 'hover',
delay: { show: 0, hide: 500 },
- container: $tooltip,
title: titleHtml
})
@@ -1175,47 +669,14 @@ $(function () {
$('#tt-outer').trigger('mouseleave')
assert.strictEqual(currentUid, $('#tt-content').text())
- assert.ok(obj.hoverState == 'out', 'the tooltip hoverState should be set to "out"')
+ assert.ok(obj._hoverState == 'out', 'the tooltip hoverState should be set to "out"')
- $('#tt-content').trigger('mouseenter')
- assert.ok(obj.hoverState == 'in', 'the tooltip hoverState should be set to "in"')
+ $('#tt-outer').trigger('mouseenter')
+ assert.ok(obj._hoverState == 'in', 'the tooltip hoverState should be set to "in"')
assert.strictEqual(currentUid, $('#tt-content').text())
})
- QUnit.test('should position arrow correctly when tooltip is moved to not appear offscreen', function (assert) {
- assert.expect(2)
- var done = assert.async()
-
- var styles = '<style>'
- + '.tooltip, .tooltip *, .tooltip *:before, .tooltip *:after { box-sizing: border-box; }'
- + '.tooltip { position: absolute; }'
- + '.tooltip-arrow { position: absolute; width: 0; height: 0; }'
- + '.tooltip .tooltip-inner { max-width: 200px; padding: 3px 8px; }'
- + '</style>'
- var $styles = $(styles).appendTo('head')
-
- $('<a href="#" title="tooltip title" style="position: absolute; bottom: 0; right: 0;">Foobar</a>')
- .appendTo('body')
- .on('shown.bs.tooltip', function () {
- var arrowStyles = $(this).data('bs.tooltip').$tip.find('.tooltip-arrow').attr('style')
- assert.ok(/left/i.test(arrowStyles) && !/top/i.test(arrowStyles), 'arrow positioned correctly')
- $(this).bootstrapTooltip('hide')
- })
- .on('hidden.bs.tooltip', function () {
- $styles.remove()
- $(this).remove()
- assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
- done()
- })
- .bootstrapTooltip({
- container: 'body',
- placement: 'top',
- trigger: 'manual'
- })
- .bootstrapTooltip('show')
- })
-
QUnit.test('should correctly position tooltips on transformed elements', function (assert) {
var styleProps = document.documentElement.style
if (!('transform' in styleProps) && !('webkitTransform' in styleProps) && !('msTransform' in styleProps)) {
@@ -1247,21 +708,12 @@ $(function () {
done()
})
.bootstrapTooltip({
- container: 'body',
- placement: 'top',
trigger: 'manual'
})
$element.bootstrapTooltip('show')
})
- QUnit.test('should throw an error when initializing tooltip on the document object without specifying a delegation selector', function (assert) {
- assert.expect(1)
- assert.throws(function () {
- $(document).bootstrapTooltip({ title: 'What am I on?' })
- }, new Error('`selector` option must be specified when initializing tooltip on the window.document object!'))
- })
-
QUnit.test('should do nothing when an attempt is made to hide an uninitialized tooltip', function (assert) {
assert.expect(1)
@@ -1274,25 +726,15 @@ $(function () {
assert.strictEqual($tooltip.data('bs.tooltip'), undefined, 'should not initialize the tooltip')
})
- QUnit.test('should throw an error when template contains multiple top-level elements', function (assert) {
- assert.expect(1)
- assert.throws(function () {
- $('<a href="#" data-toggle="tooltip" title="Another tooltip"></a>')
- .appendTo('#qunit-fixture')
- .bootstrapTooltip({ template: '<div>Foo</div><div>Bar</div>' })
- .bootstrapTooltip('show')
- }, new Error('tooltip `template` option must consist of exactly 1 top-level element!'))
- })
-
QUnit.test('should not remove tooltip if multiple triggers are set and one is still active', function (assert) {
assert.expect(41)
var $el = $('<button>Trigger</button>')
.appendTo('#qunit-fixture')
.bootstrapTooltip({ trigger: 'click hover focus', animation: false })
var tooltip = $el.data('bs.tooltip')
- var $tooltip = tooltip.tip()
+ var $tooltip = $(tooltip.getTipElement())
- function showingTooltip() { return $tooltip.hasClass('in') || tooltip.hoverState == 'in' }
+ function showingTooltip() { return $tooltip.hasClass('in') || tooltip._hoverState == 'in' }
var tests = [
['mouseenter', 'mouseleave'],
diff --git a/js/tests/vendor/tether.min.js b/js/tests/vendor/tether.min.js
new file mode 100644
index 000000000..882e9e8c8
--- /dev/null
+++ b/js/tests/vendor/tether.min.js
@@ -0,0 +1,2 @@
+/*! tether 0.7.1 */
+!function(t,e){"function"==typeof define&&define.amd?define(e):"object"==typeof exports?module.exports=e(require,exports,module):t.Tether=e()}(this,function(t,e,o){return function(){var t,e,o,i,n,s,l,r,h,a,f,p,u,d,g,c,m,b,v,y={}.hasOwnProperty,w=[].indexOf||function(t){for(var e=0,o=this.length;o>e;e++)if(e in this&&this[e]===t)return e;return-1},C=[].slice;null==this.Tether&&(this.Tether={modules:[]}),p=function(t){var e,o,i,n,s;if(o=getComputedStyle(t).position,"fixed"===o)return t;for(i=void 0,e=t;e=e.parentNode;){try{n=getComputedStyle(e)}catch(l){}if(null==n)return e;if(/(auto|scroll)/.test(n.overflow+n.overflowY+n.overflowX)&&("absolute"!==o||"relative"===(s=n.position)||"absolute"===s||"fixed"===s))return e}return document.body},m=function(){var t;return t=0,function(){return t++}}(),v={},a=function(t){var e,i,s,l,r;if(s=t._tetherZeroElement,null==s&&(s=t.createElement("div"),s.setAttribute("data-tether-id",m()),n(s.style,{top:0,left:0,position:"absolute"}),t.body.appendChild(s),t._tetherZeroElement=s),e=s.getAttribute("data-tether-id"),null==v[e]){v[e]={},r=s.getBoundingClientRect();for(i in r)l=r[i],v[e][i]=l;o(function(){return v[e]=void 0})}return v[e]},d=null,l=function(t){var e,o,i,n,s,l,r;t===document?(o=document,t=document.documentElement):o=t.ownerDocument,i=o.documentElement,e={},r=t.getBoundingClientRect();for(n in r)l=r[n],e[n]=l;return s=a(o),e.top-=s.top,e.left-=s.left,null==e.width&&(e.width=document.body.scrollWidth-e.left-e.right),null==e.height&&(e.height=document.body.scrollHeight-e.top-e.bottom),e.top=e.top-i.clientTop,e.left=e.left-i.clientLeft,e.right=o.body.clientWidth-e.width-e.left,e.bottom=o.body.clientHeight-e.height-e.top,e},h=function(t){return t.offsetParent||document.documentElement},f=function(){var t,e,o,i,s;return t=document.createElement("div"),t.style.width="100%",t.style.height="200px",e=document.createElement("div"),n(e.style,{position:"absolute",top:0,left:0,pointerEvents:"none",visibility:"hidden",width:"200px",height:"150px",overflow:"hidden"}),e.appendChild(t),document.body.appendChild(e),i=t.offsetWidth,e.style.overflow="scroll",s=t.offsetWidth,i===s&&(s=e.clientWidth),document.body.removeChild(e),o=i-s,{width:o,height:o}},n=function(t){var e,o,i,n,s,l,r;for(null==t&&(t={}),e=[],Array.prototype.push.apply(e,arguments),r=e.slice(1),s=0,l=r.length;l>s;s++)if(i=r[s])for(o in i)y.call(i,o)&&(n=i[o],t[o]=n);return t},g=function(t,e){var o,i,n,s,l,h;if(null!=t.classList){for(l=e.split(" "),h=[],n=0,s=l.length;s>n;n++)i=l[n],i.trim()&&h.push(t.classList.remove(i));return h}return o=r(t).replace(new RegExp("(^| )"+e.split(" ").join("|")+"( |$)","gi")," "),c(t,o)},e=function(t,e){var o,i,n,s,l;if(null!=t.classList){for(s=e.split(" "),l=[],i=0,n=s.length;n>i;i++)o=s[i],o.trim()&&l.push(t.classList.add(o));return l}return g(t,e),o=r(t)+(" "+e),c(t,o)},u=function(t,e){return null!=t.classList?t.classList.contains(e):new RegExp("(^| )"+e+"( |$)","gi").test(r(t))},r=function(t){return t.className instanceof SVGAnimatedString?t.className.baseVal:t.className},c=function(t,e){return t.setAttribute("class",e)},b=function(t,o,i){var n,s,l,r,h,a;for(s=0,r=i.length;r>s;s++)n=i[s],w.call(o,n)<0&&u(t,n)&&g(t,n);for(a=[],l=0,h=o.length;h>l;l++)n=o[l],a.push(u(t,n)?void 0:e(t,n));return a},i=[],o=function(t){return i.push(t)},s=function(){var t,e;for(e=[];t=i.pop();)e.push(t());return e},t=function(){function t(){}return t.prototype.on=function(t,e,o,i){var n;return null==i&&(i=!1),null==this.bindings&&(this.bindings={}),null==(n=this.bindings)[t]&&(n[t]=[]),this.bindings[t].push({handler:e,ctx:o,once:i})},t.prototype.once=function(t,e,o){return this.on(t,e,o,!0)},t.prototype.off=function(t,e){var o,i,n;if(null!=(null!=(i=this.bindings)?i[t]:void 0)){if(null==e)return delete this.bindings[t];for(o=0,n=[];o<this.bindings[t].length;)n.push(this.bindings[t][o].handler===e?this.bindings[t].splice(o,1):o++);return n}},t.prototype.trigger=function(){var t,e,o,i,n,s,l,r,h;if(o=arguments[0],t=2<=arguments.length?C.call(arguments,1):[],null!=(l=this.bindings)?l[o]:void 0){for(n=0,h=[];n<this.bindings[o].length;)r=this.bindings[o][n],i=r.handler,e=r.ctx,s=r.once,i.apply(null!=e?e:this,t),h.push(s?this.bindings[o].splice(n,1):n++);return h}},t}(),this.Tether.Utils={getScrollParent:p,getBounds:l,getOffsetParent:h,extend:n,addClass:e,removeClass:g,hasClass:u,updateClasses:b,defer:o,flush:s,uniqueId:m,Evented:t,getScrollBarSize:f}}.call(this),function(){var t,e,o,i,n,s,l,r,h,a,f,p,u,d,g,c,m,b,v,y,w,C,O,T,x,A,E,S,W,M=[].slice,P=function(t,e){return function(){return t.apply(e,arguments)}};if(null==this.Tether)throw new Error("You must include the utils.js file before tether.js");i=this.Tether,W=i.Utils,c=W.getScrollParent,m=W.getSize,d=W.getOuterSize,p=W.getBounds,u=W.getOffsetParent,a=W.extend,n=W.addClass,O=W.removeClass,A=W.updateClasses,h=W.defer,f=W.flush,g=W.getScrollBarSize,E=function(t,e,o){return null==o&&(o=1),t+o>=e&&e>=t-o},x=function(){var t,e,o,i,n;for(t=document.createElement("div"),n=["transform","webkitTransform","OTransform","MozTransform","msTransform"],o=0,i=n.length;i>o;o++)if(e=n[o],void 0!==t.style[e])return e}(),T=[],C=function(){var t,e,o;for(e=0,o=T.length;o>e;e++)t=T[e],t.position(!1);return f()},b=function(){var t;return null!=(t="undefined"!=typeof performance&&null!==performance&&"function"==typeof performance.now?performance.now():void 0)?t:+new Date},function(){var t,e,o,i,n,s,l,r,h;for(e=null,o=null,i=null,n=function(){if(null!=o&&o>16)return o=Math.min(o-16,250),void(i=setTimeout(n,250));if(!(null!=e&&b()-e<10))return null!=i&&(clearTimeout(i),i=null),e=b(),C(),o=b()-e},r=["resize","scroll","touchmove"],h=[],s=0,l=r.length;l>s;s++)t=r[s],h.push(window.addEventListener(t,n));return h}(),t={center:"center",left:"right",right:"left"},e={middle:"middle",top:"bottom",bottom:"top"},o={top:0,left:0,middle:"50%",center:"50%",bottom:"100%",right:"100%"},r=function(o,i){var n,s;return n=o.left,s=o.top,"auto"===n&&(n=t[i.left]),"auto"===s&&(s=e[i.top]),{left:n,top:s}},l=function(t){var e,i;return{left:null!=(e=o[t.left])?e:t.left,top:null!=(i=o[t.top])?i:t.top}},s=function(){var t,e,o,i,n,s,l;for(e=1<=arguments.length?M.call(arguments,0):[],o={top:0,left:0},n=0,s=e.length;s>n;n++)l=e[n],i=l.top,t=l.left,"string"==typeof i&&(i=parseFloat(i,10)),"string"==typeof t&&(t=parseFloat(t,10)),o.top+=i,o.left+=t;return o},v=function(t,e){return"string"==typeof t.left&&-1!==t.left.indexOf("%")&&(t.left=parseFloat(t.left,10)/100*e.width),"string"==typeof t.top&&-1!==t.top.indexOf("%")&&(t.top=parseFloat(t.top,10)/100*e.height),t},y=w=function(t){var e,o,i;return i=t.split(" "),o=i[0],e=i[1],{top:o,left:e}},S=function(){function t(t){this.position=P(this.position,this);var e,o,n,s,l;for(T.push(this),this.history=[],this.setOptions(t,!1),s=i.modules,o=0,n=s.length;n>o;o++)e=s[o],null!=(l=e.initialize)&&l.call(this);this.position()}return t.modules=[],t.prototype.getClass=function(t){var e,o;return(null!=(e=this.options.classes)?e[t]:void 0)?this.options.classes[t]:(null!=(o=this.options.classes)?o[t]:void 0)!==!1?this.options.classPrefix?""+this.options.classPrefix+"-"+t:t:""},t.prototype.setOptions=function(t,e){var o,i,s,l,r,h;for(this.options=t,null==e&&(e=!0),o={offset:"0 0",targetOffset:"0 0",targetAttachment:"auto auto",classPrefix:"tether"},this.options=a(o,this.options),r=this.options,this.element=r.element,this.target=r.target,this.targetModifier=r.targetModifier,"viewport"===this.target?(this.target=document.body,this.targetModifier="visible"):"scroll-handle"===this.target&&(this.target=document.body,this.targetModifier="scroll-handle"),h=["element","target"],s=0,l=h.length;l>s;s++){if(i=h[s],null==this[i])throw new Error("Tether Error: Both element and target must be defined");null!=this[i].jquery?this[i]=this[i][0]:"string"==typeof this[i]&&(this[i]=document.querySelector(this[i]))}if(n(this.element,this.getClass("element")),this.options.addTargetClasses!==!1&&n(this.target,this.getClass("target")),!this.options.attachment)throw new Error("Tether Error: You must provide an attachment");return this.targetAttachment=y(this.options.targetAttachment),this.attachment=y(this.options.attachment),this.offset=w(this.options.offset),this.targetOffset=w(this.options.targetOffset),null!=this.scrollParent&&this.disable(),"scroll-handle"===this.targetModifier?this.scrollParent=this.target:this.scrollParent=c(this.target),this.options.enabled!==!1?this.enable(e):void 0},t.prototype.getTargetBounds=function(){var t,e,o,i,n,s,l,r,h;if(null==this.targetModifier)return p(this.target);switch(this.targetModifier){case"visible":return this.target===document.body?{top:pageYOffset,left:pageXOffset,height:innerHeight,width:innerWidth}:(t=p(this.target),n={height:t.height,width:t.width,top:t.top,left:t.left},n.height=Math.min(n.height,t.height-(pageYOffset-t.top)),n.height=Math.min(n.height,t.height-(t.top+t.height-(pageYOffset+innerHeight))),n.height=Math.min(innerHeight,n.height),n.height-=2,n.width=Math.min(n.width,t.width-(pageXOffset-t.left)),n.width=Math.min(n.width,t.width-(t.left+t.width-(pageXOffset+innerWidth))),n.width=Math.min(innerWidth,n.width),n.width-=2,n.top<pageYOffset&&(n.top=pageYOffset),n.left<pageXOffset&&(n.left=pageXOffset),n);case"scroll-handle":return h=this.target,h===document.body?(h=document.documentElement,t={left:pageXOffset,top:pageYOffset,height:innerHeight,width:innerWidth}):t=p(h),r=getComputedStyle(h),o=h.scrollWidth>h.clientWidth||"scroll"===[r.overflow,r.overflowX]||this.target!==document.body,s=0,o&&(s=15),i=t.height-parseFloat(r.borderTopWidth)-parseFloat(r.borderBottomWidth)-s,n={width:15,height:.975*i*(i/h.scrollHeight),left:t.left+t.width-parseFloat(r.borderLeftWidth)-15},e=0,408>i&&this.target===document.body&&(e=-11e-5*Math.pow(i,2)-.00727*i+22.58),this.target!==document.body&&(n.height=Math.max(n.height,24)),l=this.target.scrollTop/(h.scrollHeight-i),n.top=l*(i-n.height-e)+t.top+parseFloat(r.borderTopWidth),this.target===document.body&&(n.height=Math.max(n.height,24)),n}},t.prototype.clearCache=function(){return this._cache={}},t.prototype.cache=function(t,e){return null==this._cache&&(this._cache={}),null==this._cache[t]&&(this._cache[t]=e.call(this)),this._cache[t]},t.prototype.enable=function(t){return null==t&&(t=!0),this.options.addTargetClasses!==!1&&n(this.target,this.getClass("enabled")),n(this.element,this.getClass("enabled")),this.enabled=!0,this.scrollParent!==document&&this.scrollParent.addEventListener("scroll",this.position),t?this.position():void 0},t.prototype.disable=function(){return O(this.target,this.getClass("enabled")),O(this.element,this.getClass("enabled")),this.enabled=!1,null!=this.scrollParent?this.scrollParent.removeEventListener("scroll",this.position):void 0},t.prototype.destroy=function(){var t,e,o,i,n;for(this.disable(),n=[],t=o=0,i=T.length;i>o;t=++o){if(e=T[t],e===this){T.splice(t,1);break}n.push(void 0)}return n},t.prototype.updateAttachClasses=function(t,e){var o,i,n,s,l,r,a,f,p,u=this;for(null==t&&(t=this.attachment),null==e&&(e=this.targetAttachment),s=["left","top","bottom","right","middle","center"],(null!=(p=this._addAttachClasses)?p.length:void 0)&&this._addAttachClasses.splice(0,this._addAttachClasses.length),o=null!=this._addAttachClasses?this._addAttachClasses:this._addAttachClasses=[],t.top&&o.push(""+this.getClass("element-attached")+"-"+t.top),t.left&&o.push(""+this.getClass("element-attached")+"-"+t.left),e.top&&o.push(""+this.getClass("target-attached")+"-"+e.top),e.left&&o.push(""+this.getClass("target-attached")+"-"+e.left),i=[],l=0,a=s.length;a>l;l++)n=s[l],i.push(""+this.getClass("element-attached")+"-"+n);for(r=0,f=s.length;f>r;r++)n=s[r],i.push(""+this.getClass("target-attached")+"-"+n);return h(function(){return null!=u._addAttachClasses?(A(u.element,u._addAttachClasses,i),u.options.addTargetClasses!==!1&&A(u.target,u._addAttachClasses,i),u._addAttachClasses=void 0):void 0})},t.prototype.position=function(t){var e,o,n,h,a,d,c,m,b,y,w,C,O,T,x,A,E,S,W,M,P,z,B,_,F,L,Y,H,X,N,j,R,U,q,k,D=this;if(null==t&&(t=!0),this.enabled){for(this.clearCache(),M=r(this.targetAttachment,this.attachment),this.updateAttachClasses(this.attachment,M),e=this.cache("element-bounds",function(){return p(D.element)}),F=e.width,n=e.height,0===F&&0===n&&null!=this.lastSize?(N=this.lastSize,F=N.width,n=N.height):this.lastSize={width:F,height:n},B=z=this.cache("target-bounds",function(){return D.getTargetBounds()}),b=v(l(this.attachment),{width:F,height:n}),P=v(l(M),B),a=v(this.offset,{width:F,height:n}),d=v(this.targetOffset,B),b=s(b,a),P=s(P,d),h=z.left+P.left-b.left,_=z.top+P.top-b.top,j=i.modules,L=0,H=j.length;H>L;L++){if(c=j[L],x=c.position.call(this,{left:h,top:_,targetAttachment:M,targetPos:z,attachment:this.attachment,elementPos:e,offset:b,targetOffset:P,manualOffset:a,manualTargetOffset:d,scrollbarSize:S}),x===!1)return!1;null!=x&&"object"==typeof x&&(_=x.top,h=x.left)}if(m={page:{top:_,left:h},viewport:{top:_-pageYOffset,bottom:pageYOffset-_-n+innerHeight,left:h-pageXOffset,right:pageXOffset-h-F+innerWidth}},document.body.scrollWidth>window.innerWidth&&(S=this.cache("scrollbar-size",g),m.viewport.bottom-=S.height),document.body.scrollHeight>window.innerHeight&&(S=this.cache("scrollbar-size",g),m.viewport.right-=S.width),(""!==(R=document.body.style.position)&&"static"!==R||""!==(U=document.body.parentElement.style.position)&&"static"!==U)&&(m.page.bottom=document.body.scrollHeight-_-n,m.page.right=document.body.scrollWidth-h-F),(null!=(q=this.options.optimizations)?q.moveElement:void 0)!==!1&&null==this.targetModifier){for(w=this.cache("target-offsetparent",function(){return u(D.target)}),T=this.cache("target-offsetparent-bounds",function(){return p(w)}),O=getComputedStyle(w),o=getComputedStyle(this.element),C=T,y={},k=["Top","Left","Bottom","Right"],Y=0,X=k.length;X>Y;Y++)W=k[Y],y[W.toLowerCase()]=parseFloat(O["border"+W+"Width"]);T.right=document.body.scrollWidth-T.left-C.width+y.right,T.bottom=document.body.scrollHeight-T.top-C.height+y.bottom,m.page.top>=T.top+y.top&&m.page.bottom>=T.bottom&&m.page.left>=T.left+y.left&&m.page.right>=T.right&&(E=w.scrollTop,A=w.scrollLeft,m.offset={top:m.page.top-T.top+E-y.top,left:m.page.left-T.left+A-y.left})}return this.move(m),this.history.unshift(m),this.history.length>3&&this.history.pop(),t&&f(),!0}},t.prototype.move=function(t){var e,o,i,n,s,l,r,f,p,d,g,c,m,b,v,y,w,C=this;if(null!=this.element.parentNode){f={};for(d in t){f[d]={};for(n in t[d]){for(i=!1,y=this.history,b=0,v=y.length;v>b;b++)if(r=y[b],!E(null!=(w=r[d])?w[n]:void 0,t[d][n])){i=!0;break}i||(f[d][n]=!0)}}e={top:"",left:"",right:"",bottom:""},p=function(t,o){var i,n,s;return(null!=(s=C.options.optimizations)?s.gpu:void 0)===!1?(t.top?e.top=""+o.top+"px":e.bottom=""+o.bottom+"px",t.left?e.left=""+o.left+"px":e.right=""+o.right+"px"):(t.top?(e.top=0,n=o.top):(e.bottom=0,n=-o.bottom),t.left?(e.left=0,i=o.left):(e.right=0,i=-o.right),e[x]="translateX("+Math.round(i)+"px) translateY("+Math.round(n)+"px)","msTransform"!==x?e[x]+=" translateZ(0)":void 0)},s=!1,(f.page.top||f.page.bottom)&&(f.page.left||f.page.right)?(e.position="absolute",p(f.page,t.page)):(f.viewport.top||f.viewport.bottom)&&(f.viewport.left||f.viewport.right)?(e.position="fixed",p(f.viewport,t.viewport)):null!=f.offset&&f.offset.top&&f.offset.left?(e.position="absolute",l=this.cache("target-offsetparent",function(){return u(C.target)}),u(this.element)!==l&&h(function(){return C.element.parentNode.removeChild(C.element),l.appendChild(C.element)}),p(f.offset,t.offset),s=!0):(e.position="absolute",p({top:!0,left:!0},t.page)),s||"BODY"===this.element.parentNode.tagName||(this.element.parentNode.removeChild(this.element),document.body.appendChild(this.element)),m={},c=!1;for(n in e)g=e[n],o=this.element.style[n],""===o||""===g||"top"!==n&&"left"!==n&&"bottom"!==n&&"right"!==n||(o=parseFloat(o),g=parseFloat(g)),o!==g&&(c=!0,m[n]=e[n]);return c?h(function(){return a(C.element.style,m)}):void 0}},t}(),i.position=C,this.Tether=a(S,i)}.call(this),function(){var t,e,o,i,n,s,l,r,h,a,f=[].indexOf||function(t){for(var e=0,o=this.length;o>e;e++)if(e in this&&this[e]===t)return e;return-1};a=this.Tether.Utils,l=a.getOuterSize,s=a.getBounds,r=a.getSize,i=a.extend,h=a.updateClasses,o=a.defer,e={left:"right",right:"left",top:"bottom",bottom:"top",middle:"middle"},t=["left","top","right","bottom"],n=function(e,o){var i,n,l,r,h,a,f;if("scrollParent"===o?o=e.scrollParent:"window"===o&&(o=[pageXOffset,pageYOffset,innerWidth+pageXOffset,innerHeight+pageYOffset]),o===document&&(o=o.documentElement),null!=o.nodeType)for(n=r=s(o),h=getComputedStyle(o),o=[n.left,n.top,r.width+n.left,r.height+n.top],i=a=0,f=t.length;f>a;i=++a)l=t[i],l=l[0].toUpperCase()+l.substr(1),"Top"===l||"Left"===l?o[i]+=parseFloat(h["border"+l+"Width"]):o[i]-=parseFloat(h["border"+l+"Width"]);return o},this.Tether.modules.push({position:function(e){var l,r,a,p,u,d,g,c,m,b,v,y,w,C,O,T,x,A,E,S,W,M,P,z,B,_,F,L,Y,H,X,N,j,R,U,q,k,D,Z,V,$,G,I,J,K,Q,tt,et=this;if(_=e.top,v=e.left,W=e.targetAttachment,!this.options.constraints)return!0;for(A=function(e){var o,i,n,s;for(et.removeClass(e),s=[],i=0,n=t.length;n>i;i++)o=t[i],s.push(et.removeClass(""+e+"-"+o));return s},V=this.cache("element-bounds",function(){return s(et.element)}),b=V.height,F=V.width,0===F&&0===b&&null!=this.lastSize&&($=this.lastSize,F=$.width,b=$.height),P=this.cache("target-bounds",function(){return et.getTargetBounds()}),M=P.height,z=P.width,S={},m={},r=[this.getClass("pinned"),this.getClass("out-of-bounds")],G=this.options.constraints,L=0,N=G.length;N>L;L++)c=G[L],c.outOfBoundsClass&&r.push(c.outOfBoundsClass),c.pinnedClass&&r.push(c.pinnedClass);for(Y=0,j=r.length;j>Y;Y++)for(g=r[Y],I=["left","top","right","bottom"],H=0,R=I.length;R>H;H++)E=I[H],r.push(""+g+"-"+E);for(l=[],S=i({},W),m=i({},this.attachment),J=this.options.constraints,X=0,U=J.length;U>X;X++){if(c=J[X],B=c.to,a=c.attachment,O=c.pin,null==a&&(a=""),f.call(a," ")>=0?(K=a.split(" "),d=K[0],u=K[1]):u=d=a,p=n(this,B),("target"===d||"both"===d)&&(_<p[1]&&"top"===S.top&&(_+=M,S.top="bottom"),_+b>p[3]&&"bottom"===S.top&&(_-=M,S.top="top")),"together"===d&&(_<p[1]&&"top"===S.top&&("bottom"===m.top?(_+=M,S.top="bottom",_+=b,m.top="top"):"top"===m.top&&(_+=M,S.top="bottom",_-=b,m.top="bottom")),_+b>p[3]&&"bottom"===S.top&&("top"===m.top?(_-=M,S.top="top",_-=b,m.top="bottom"):"bottom"===m.top&&(_-=M,S.top="top",_+=b,m.top="top")),"middle"===S.top&&(_+b>p[3]&&"top"===m.top?(_-=b,m.top="bottom"):_<p[1]&&"bottom"===m.top&&(_+=b,m.top="top"))),("target"===u||"both"===u)&&(v<p[0]&&"left"===S.left&&(v+=z,S.left="right"),v+F>p[2]&&"right"===S.left&&(v-=z,S.left="left")),"together"===u&&(v<p[0]&&"left"===S.left?"right"===m.left?(v+=z,S.left="right",v+=F,m.left="left"):"left"===m.left&&(v+=z,S.left="right",v-=F,m.left="right"):v+F>p[2]&&"right"===S.left?"left"===m.left?(v-=z,S.left="left",v-=F,m.left="right"):"right"===m.left&&(v-=z,S.left="left",v+=F,m.left="left"):"center"===S.left&&(v+F>p[2]&&"left"===m.left?(v-=F,m.left="right"):v<p[0]&&"right"===m.left&&(v+=F,m.left="left"))),("element"===d||"both"===d)&&(_<p[1]&&"bottom"===m.top&&(_+=b,m.top="top"),_+b>p[3]&&"top"===m.top&&(_-=b,m.top="bottom")),("element"===u||"both"===u)&&(v<p[0]&&"right"===m.left&&(v+=F,m.left="left"),v+F>p[2]&&"left"===m.left&&(v-=F,m.left="right")),"string"==typeof O?O=function(){var t,e,o,i;for(o=O.split(","),i=[],e=0,t=o.length;t>e;e++)C=o[e],i.push(C.trim());return i}():O===!0&&(O=["top","left","right","bottom"]),O||(O=[]),T=[],y=[],_<p[1]&&(f.call(O,"top")>=0?(_=p[1],T.push("top")):y.push("top")),_+b>p[3]&&(f.call(O,"bottom")>=0?(_=p[3]-b,T.push("bottom")):y.push("bottom")),v<p[0]&&(f.call(O,"left")>=0?(v=p[0],T.push("left")):y.push("left")),v+F>p[2]&&(f.call(O,"right")>=0?(v=p[2]-F,T.push("right")):y.push("right")),T.length)for(x=null!=(Q=this.options.pinnedClass)?Q:this.getClass("pinned"),l.push(x),D=0,q=T.length;q>D;D++)E=T[D],l.push(""+x+"-"+E);if(y.length)for(w=null!=(tt=this.options.outOfBoundsClass)?tt:this.getClass("out-of-bounds"),l.push(w),Z=0,k=y.length;k>Z;Z++)E=y[Z],l.push(""+w+"-"+E);(f.call(T,"left")>=0||f.call(T,"right")>=0)&&(m.left=S.left=!1),(f.call(T,"top")>=0||f.call(T,"bottom")>=0)&&(m.top=S.top=!1),(S.top!==W.top||S.left!==W.left||m.top!==this.attachment.top||m.left!==this.attachment.left)&&this.updateAttachClasses(m,S)}return o(function(){return et.options.addTargetClasses!==!1&&h(et.target,l,r),h(et.element,l,r)}),{top:_,left:v}}})}.call(this),function(){var t,e,o,i;i=this.Tether.Utils,e=i.getBounds,o=i.updateClasses,t=i.defer,this.Tether.modules.push({position:function(i){var n,s,l,r,h,a,f,p,u,d,g,c,m,b,v,y,w,C,O,T,x,A,E,S,W,M=this;if(g=i.top,a=i.left,x=this.cache("element-bounds",function(){return e(M.element)}),h=x.height,c=x.width,d=this.getTargetBounds(),r=g+h,f=a+c,n=[],g<=d.bottom&&r>=d.top)for(A=["left","right"],m=0,w=A.length;w>m;m++)p=A[m],((E=d[p])===a||E===f)&&n.push(p);if(a<=d.right&&f>=d.left)for(S=["top","bottom"],b=0,C=S.length;C>b;b++)p=S[b],((W=d[p])===g||W===r)&&n.push(p);for(l=[],s=[],u=["left","top","right","bottom"],l.push(this.getClass("abutted")),v=0,O=u.length;O>v;v++)p=u[v],l.push(""+this.getClass("abutted")+"-"+p);for(n.length&&s.push(this.getClass("abutted")),y=0,T=n.length;T>y;y++)p=n[y],s.push(""+this.getClass("abutted")+"-"+p);return t(function(){return M.options.addTargetClasses!==!1&&o(M.target,s,l),o(M.element,s,l)}),!0}})}.call(this),function(){this.Tether.modules.push({position:function(t){var e,o,i,n,s,l,r;return l=t.top,e=t.left,this.options.shift?(o=function(t){return"function"==typeof t?t.call(this,{top:l,left:e}):t},i=o(this.options.shift),"string"==typeof i?(i=i.split(" "),i[1]||(i[1]=i[0]),s=i[0],n=i[1],s=parseFloat(s,10),n=parseFloat(n,10)):(r=[i.top,i.left],s=r[0],n=r[1]),l+=s,e+=n,{top:l,left:e}):void 0}})}.call(this),this.Tether}); \ No newline at end of file
diff --git a/js/tests/visual/affix-with-sticky-footer.html b/js/tests/visual/affix-with-sticky-footer.html
deleted file mode 100644
index 5c413067a..000000000
--- a/js/tests/visual/affix-with-sticky-footer.html
+++ /dev/null
@@ -1,317 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
- <meta charset="utf-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1">
- <title>Affix</title>
- <link rel="stylesheet" href="../../../dist/css/bootstrap.min.css">
-
- <style>
- html {
- position: relative;
- min-height: 100%;
- }
- body {
- /* Margin bottom by footer height */
- margin-bottom: 200px;
- }
- .footer {
- position: absolute;
- bottom: 0;
- width: 100%;
- /* Set the fixed height of the footer here */
- height: 200px;
- background-color: #f5f5f5;
- }
- /* Test Styles */
- .affixed-element-top.affix {
- top: 10px;
- }
- .affixed-element-top.affix-bottom {
- position: absolute;
- }
- .affixed-element-bottom {
- margin-bottom: 0;
- }
- .affixed-element-bottom.affix {
- bottom: 10px;
- }
- .affixed-element-bottom.affix-bottom {
- position: relative;
- }
- .grow-btn, .shrink-btn {
- color: #FFF;
- }
- .grow-btn {
- background-color: #2ECC40;
- }
- .grow-btn:hover {
- background-color: #3D9970;
- }
- .shrink-btn {
- background-color: #FF4136;
- }
- .shrink-btn:hover {
- background-color: #85144B;
- }
- </style>
-
- <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
- <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
- <!--[if lt IE 9]>
- <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
- <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
- <![endif]-->
-</head>
-<body>
-
-<div class="container">
-
- <div class="page-header js-page-header">
- <h1>Affix <small>Bootstrap Visual Test</small></h1>
- </div>
-
- <div class="col-md-3">
- <ul class="list-group affixed-element-top js-affixed-element-top">
- <li class="list-group-item">Cras justo odio</li>
- <li class="list-group-item">Dapibus ac facilisis in</li>
- <li class="list-group-item">Morbi leo risus</li>
- <li class="list-group-item">Porta ac consectetur ac</li>
- <li class="list-group-item">Vestibulum at eros</li>
- <li class="list-group-item">Cras justo odio</li>
- <li class="list-group-item">Dapibus ac facilisis in</li>
- <li class="list-group-item">Morbi leo risus</li>
- <li class="list-group-item">Porta ac consectetur ac</li>
- <li class="list-group-item">Vestibulum at eros</li>
- <li class="list-group-item">Cras justo odio</li>
- <li class="list-group-item">Dapibus ac facilisis in</li>
- <li class="list-group-item">Morbi leo risus</li>
- <li class="list-group-item">Porta ac consectetur ac</li>
- <li class="list-group-item">Vestibulum at eros</li>
- <li class="list-group-item">Porta ac consectetur ac</li>
- </ul>
- </div>
-
- <div class="col-md-6 js-content">
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- </div>
-
- <div class="col-md-3">
- <ul class="list-group affixed-element-bottom js-affixed-element-bottom">
- <li class="list-group-item">Sit necessitatibus aspernatur.</li>
- <li class="list-group-item">Adipisicing alias dolor!</li>
- <li class="list-group-item">Ipsum molestiae impedit.</li>
- <li class="list-group-item">Amet quis iste?</li>
- <li class="list-group-item">Ipsum quaerat porro.</li>
- <li class="list-group-item">Elit lorem libero.</li>
- <li class="list-group-item">Ipsum dolore facilis.</li>
- <li class="list-group-item">Elit ad atque.</li>
- <li class="list-group-item">Dolor amet sequi!</li>
- <li class="list-group-item">Consectetur voluptatum facilis!</li>
- <li class="list-group-item">Sit neque eligendi?</li>
- <li class="list-group-item">Amet fuga consectetur!</li>
- <li class="list-group-item">Amet molestias repellat!</li>
- <li class="list-group-item">Consectetur minima repellendus.</li>
- <li class="list-group-item grow-btn js-grow-btn">Grow content</li>
- <li class="list-group-item shrink-btn js-shrink-btn">Shrink content</li>
- </ul>
- </div>
-
-
-</div>
-
-<footer class="footer js-footer">
- <div class="container">
- <p class="text-muted">Place sticky footer content here.</p>
- </div>
-</footer>
-
-<!-- JavaScript Includes -->
-<script src="../vendor/jquery.min.js"></script>
-<script src="../../transition.js"></script>
-<script src="../../affix.js"></script>
-
-
-<!-- JavaScript Test -->
-<script>
-$(function () {
- $('.js-affixed-element-top').affix({
- offset: {
- top: $('.js-page-header').outerHeight(true) - 10
- , bottom: $('.js-footer').outerHeight(true) + 10
- }
- })
- // todo(fat): sux you have to do this.
- .on('affix.bs.affix', function (e) {
- $(e.target).width(e.target.offsetWidth)
- })
-
- $('.js-affixed-element-bottom').affix({
- offset: {
- bottom: $('.js-footer').outerHeight(true) + 10
- }
- })
-
- $('.js-grow-btn').on('click', function() {
- $('.js-content').append('<p>Ipsum corrupti ipsam est temporibus.</p>')
- })
- $('.js-shrink-btn').on('click', function() {
- $('.js-content p').last().remove()
- })
-})
-</script>
-</body>
-</html>
diff --git a/js/tests/visual/affix.html b/js/tests/visual/affix.html
deleted file mode 100644
index 4d772dc73..000000000
--- a/js/tests/visual/affix.html
+++ /dev/null
@@ -1,306 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
- <meta charset="utf-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1">
- <title>Affix</title>
- <link rel="stylesheet" href="../../../dist/css/bootstrap.min.css">
-
- <style>
- /* Test Styles */
- .affixed-element-top.affix {
- top: 10px;
- }
- .affixed-element-top.affix-bottom {
- position: absolute;
- }
- .affixed-element-bottom {
- margin-bottom: 0;
- }
- .affixed-element-bottom.affix {
- bottom: 10px;
- }
- .affixed-element-bottom.affix-bottom {
- position: relative;
- }
- .grow-btn, .shrink-btn {
- color: #FFF;
- }
- .grow-btn {
- background-color: #2ECC40;
- }
- .grow-btn:hover {
- background-color: #3D9970;
- }
- .shrink-btn {
- background-color: #FF4136;
- }
- .shrink-btn:hover {
- background-color: #85144B;
- }
- </style>
-
- <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
- <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
- <!--[if lt IE 9]>
- <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
- <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
- <![endif]-->
-</head>
-<body>
-
-<div class="container">
-
- <div class="page-header js-page-header">
- <h1>Affix <small>Bootstrap Visual Test</small></h1>
- </div>
-
- <div class="col-md-3">
- <ul class="list-group affixed-element-top js-affixed-element-top">
- <li class="list-group-item">Cras justo odio</li>
- <li class="list-group-item">Dapibus ac facilisis in</li>
- <li class="list-group-item">Morbi leo risus</li>
- <li class="list-group-item">Porta ac consectetur ac</li>
- <li class="list-group-item">Vestibulum at eros</li>
- <li class="list-group-item">Cras justo odio</li>
- <li class="list-group-item">Dapibus ac facilisis in</li>
- <li class="list-group-item">Morbi leo risus</li>
- <li class="list-group-item">Porta ac consectetur ac</li>
- <li class="list-group-item">Vestibulum at eros</li>
- <li class="list-group-item">Cras justo odio</li>
- <li class="list-group-item">Dapibus ac facilisis in</li>
- <li class="list-group-item">Morbi leo risus</li>
- <li class="list-group-item">Porta ac consectetur ac</li>
- <li class="list-group-item">Vestibulum at eros</li>
- <li class="list-group-item">Porta ac consectetur ac</li>
- </ul>
- </div>
-
- <div class="col-md-6 js-content">
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
-
- </div>
-
- <div class="col-md-3">
- <ul class="list-group affixed-element-bottom js-affixed-element-bottom">
- <li class="list-group-item">Sit necessitatibus aspernatur.</li>
- <li class="list-group-item">Adipisicing alias dolor!</li>
- <li class="list-group-item">Ipsum molestiae impedit.</li>
- <li class="list-group-item">Amet quis iste?</li>
- <li class="list-group-item">Ipsum quaerat porro.</li>
- <li class="list-group-item">Elit lorem libero.</li>
- <li class="list-group-item">Ipsum dolore facilis.</li>
- <li class="list-group-item">Elit ad atque.</li>
- <li class="list-group-item">Dolor amet sequi!</li>
- <li class="list-group-item">Consectetur voluptatum facilis!</li>
- <li class="list-group-item">Sit neque eligendi?</li>
- <li class="list-group-item">Amet fuga consectetur!</li>
- <li class="list-group-item">Amet molestias repellat!</li>
- <li class="list-group-item">Consectetur minima repellendus.</li>
- <li class="list-group-item grow-btn js-grow-btn">Grow content</li>
- <li class="list-group-item shrink-btn js-shrink-btn">Shrink content</li>
- </ul>
- </div>
-
- <div class="col-md-12 js-footer">
- <hr>
-
- <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-
- <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
-
- <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
-
- <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
- </div>
-
-</div>
-
-<!-- JavaScript Includes -->
-<script src="../vendor/jquery.min.js"></script>
-<script src="../../transition.js"></script>
-<script src="../../affix.js"></script>
-
-
-<!-- JavaScript Test -->
-<script>
-$(function () {
- $('.js-affixed-element-top').affix({
- offset: {
- top: $('.js-page-header').outerHeight(true) - 10
- , bottom: $('.js-footer').outerHeight(true) + 10
- }
- })
- // todo(fat): sux you have to do this.
- .on('affix.bs.affix', function (e) {
- $(e.target).width(e.target.offsetWidth)
- })
-
- $('.js-affixed-element-bottom').affix({
- offset: {
- bottom: $('.js-footer').outerHeight(true) + 10
- }
- })
-
- $('.js-grow-btn').on('click', function() {
- $('.js-content').append('<p>Ipsum corrupti ipsam est temporibus.</p>')
- })
- $('.js-shrink-btn').on('click', function() {
- $('.js-content p').last().remove()
- })
-})
-</script>
-</body>
-</html>
diff --git a/js/tests/visual/alert.html b/js/tests/visual/alert.html
index 0070315a2..9e6a939e9 100644
--- a/js/tests/visual/alert.html
+++ b/js/tests/visual/alert.html
@@ -41,8 +41,8 @@
<!-- JavaScript Includes -->
<script src="../vendor/jquery.min.js"></script>
-<script src="../../transition.js"></script>
-<script src="../../alert.js"></script>
+<script src="../../dist/util.js"></script>
+<script src="../../dist/alert.js"></script>
</body>
</html>
diff --git a/js/tests/visual/button.html b/js/tests/visual/button.html
index d92a08329..a6eed7e05 100644
--- a/js/tests/visual/button.html
+++ b/js/tests/visual/button.html
@@ -22,10 +22,6 @@
<h1>Button <small>Bootstrap Visual Test</small></h1>
</div>
- <button type="button" data-loading-text="Loading for 3 seconds..." class="btn btn-primary js-loading-button">
- Loading state
- </button>
-
<button type="button" class="btn btn-primary" data-toggle="button">Single toggle</button>
<div class="btn-group" data-toggle="buttons">
@@ -56,8 +52,8 @@
<!-- JavaScript Includes -->
<script src="../vendor/jquery.min.js"></script>
-<script src="../../transition.js"></script>
-<script src="../../button.js"></script>
+<script src="../../dist/util.js"></script>
+<script src="../../dist/button.js"></script>
<!-- JavaScript Test -->
<script>
diff --git a/js/tests/visual/carousel.html b/js/tests/visual/carousel.html
index 8dede0921..47dacaa6a 100644
--- a/js/tests/visual/carousel.html
+++ b/js/tests/visual/carousel.html
@@ -29,13 +29,13 @@
<li data-target="#carousel-example-generic" data-slide-to="2" class=""></li>
</ol>
<div class="carousel-inner">
- <div class="item active">
+ <div class="carousel-item active">
<img alt="First slide" src="http://37.media.tumblr.com/tumblr_m8tay0JcfG1qa42jro1_1280.jpg">
</div>
- <div class="item">
+ <div class="carousel-item">
<img alt="Second slide" src="http://37.media.tumblr.com/tumblr_m8tazfiVYJ1qa42jro1_1280.jpg">
</div>
- <div class="item">
+ <div class="carousel-item">
<img alt="Third slide" src="http://38.media.tumblr.com/tumblr_m8tb2rVsD31qa42jro1_1280.jpg">
</div>
</div>
@@ -51,8 +51,8 @@
<!-- JavaScript Includes -->
<script src="../vendor/jquery.min.js"></script>
-<script src="../../transition.js"></script>
-<script src="../../carousel.js"></script>
+<script src="../../dist/util.js"></script>
+<script src="../../dist/carousel.js"></script>
</body>
</html>
diff --git a/js/tests/visual/collapse.html b/js/tests/visual/collapse.html
index 3b8a42e3d..2ccc787ec 100644
--- a/js/tests/visual/collapse.html
+++ b/js/tests/visual/collapse.html
@@ -71,8 +71,8 @@
<!-- JavaScript Includes -->
<script src="../vendor/jquery.min.js"></script>
-<script src="../../transition.js"></script>
-<script src="../../collapse.js"></script>
+<script src="../../dist/util.js"></script>
+<script src="../../dist/collapse.js"></script>
</body>
</html>
diff --git a/js/tests/visual/dropdown.html b/js/tests/visual/dropdown.html
index 02090b6cc..a51267de8 100644
--- a/js/tests/visual/dropdown.html
+++ b/js/tests/visual/dropdown.html
@@ -22,21 +22,15 @@
<h1>Dropdown <small>Bootstrap Visual Test</small></h1>
</div>
- <nav id="navbar-example" class="navbar navbar-default navbar-static" role="navigation">
+ <nav id="navbar-example" class="navbar navbar-default navbar-static-top" role="navigation">
<div class="container-fluid">
- <div class="navbar-header">
- <button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target=".bs-example-js-navbar-collapse">
- <span class="sr-only">Toggle navigation</span>
- <span class="icon-bar"></span>
- <span class="icon-bar"></span>
- <span class="icon-bar"></span>
- </button>
- <a class="navbar-brand" href="#">Project Name</a>
- </div>
- <div class="collapse navbar-collapse bs-example-js-navbar-collapse">
- <ul class="nav navbar-nav">
- <li class="dropdown">
- <a id="drop1" href="#" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <button class="navbar-toggler hidden-sm-up" type="button" data-toggle="collapse" data-target="#exCollapsingNavbar2">
+ &#9776;
+ </button>
+ <div class="collapse navbar-toggleable-xs" id="exCollapsingNavbar2">
+ <ul class="nav navbar-nav pull-left">
+ <li class="dropdown nav-item">
+ <a id="drop1" href="#" role="button" class="dropdown-toggle nav-link" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu" role="menu" aria-labelledby="drop1">
<li role="presentation"><a role="menuitem" tabindex="-1" href="https://twitter.com/fat">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="https://twitter.com/fat">Another action</a></li>
@@ -45,8 +39,8 @@
<li role="presentation"><a role="menuitem" tabindex="-1" href="https://twitter.com/fat">Separated link</a></li>
</ul>
</li>
- <li class="dropdown">
- <a href="#" id="drop2" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown 2 <b class="caret"></b></a>
+ <li class="dropdown nav-item">
+ <a href="#" id="drop2" role="button" class="dropdown-toggle nav-link" data-toggle="dropdown">Dropdown 2 <b class="caret"></b></a>
<ul class="dropdown-menu" role="menu" aria-labelledby="drop2">
<li role="presentation"><a role="menuitem" tabindex="-1" href="https://twitter.com/fat">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="https://twitter.com/fat">Another action</a></li>
@@ -56,9 +50,9 @@
</ul>
</li>
</ul>
- <ul class="nav navbar-nav navbar-right">
- <li id="fat-menu" class="dropdown">
- <a href="#" id="drop3" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown 3 <b class="caret"></b></a>
+ <ul class="nav navbar-nav pull-right">
+ <li id="fat-menu" class="dropdown nav-item">
+ <a href="#" id="drop3" role="button" class="dropdown-toggle nav-link" data-toggle="dropdown">Dropdown 3 <b class="caret"></b></a>
<ul class="dropdown-menu" role="menu" aria-labelledby="drop3">
<li role="presentation"><a role="menuitem" tabindex="-1" href="https://twitter.com/fat">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="https://twitter.com/fat">Another action</a></li>
@@ -73,9 +67,9 @@
</nav>
<ul class="nav nav-pills">
- <li class="active"><a href="#">Regular link</a></li>
- <li class="dropdown">
- <a id="drop4" role="button" data-toggle="dropdown" href="#">Dropdown <b class="caret"></b></a>
+ <li class="active nav-item"><a href="#" class="nav-link">Regular link</a></li>
+ <li class="dropdown nav-item">
+ <a id="drop4" class="nav-link" role="button" data-toggle="dropdown" href="#">Dropdown <b class="caret"></b></a>
<ul id="menu1" class="dropdown-menu" role="menu" aria-labelledby="drop4">
<li role="presentation"><a role="menuitem" tabindex="-1" href="https://twitter.com/fat">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="https://twitter.com/fat">Another action</a></li>
@@ -84,8 +78,8 @@
<li role="presentation"><a role="menuitem" tabindex="-1" href="https://twitter.com/fat">Separated link</a></li>
</ul>
</li>
- <li class="dropdown">
- <a id="drop5" role="button" data-toggle="dropdown" href="#">Dropdown 2 <b class="caret"></b></a>
+ <li class="dropdown nav-item">
+ <a id="drop5" class="nav-link" role="button" data-toggle="dropdown" href="#">Dropdown 2 <b class="caret"></b></a>
<ul id="menu2" class="dropdown-menu" role="menu" aria-labelledby="drop5">
<li role="presentation"><a role="menuitem" tabindex="-1" href="https://twitter.com/fat">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="https://twitter.com/fat">Another action</a></li>
@@ -100,9 +94,9 @@
<!-- JavaScript Includes -->
<script src="../vendor/jquery.min.js"></script>
-<script src="../../transition.js"></script>
-<script src="../../dropdown.js"></script>
-<script src="../../collapse.js"></script>
+<script src="../../dist/util.js"></script>
+<script src="../../dist/dropdown.js"></script>
+<script src="../../dist/collapse.js"></script>
</body>
</html>
diff --git a/js/tests/visual/modal.html b/js/tests/visual/modal.html
index 4342f0ce4..ab61a3b16 100644
--- a/js/tests/visual/modal.html
+++ b/js/tests/visual/modal.html
@@ -141,20 +141,23 @@
<!-- JavaScript Includes -->
<script src="../vendor/jquery.min.js"></script>
-<script src="../../transition.js"></script>
-<script src="../../modal.js"></script>
+
+<script src="../../dist/util.js"></script>
+<script src="../../dist/modal.js"></script>
+<script src="../../dist/collapse.js"></script>
+
+<!-- <script src="../../transition.js"></script>
<script src="../../tooltip.js"></script>
-<script src="../../popover.js"></script>
-<script src="../../collapse.js"></script>
+<script src="../../popover.js"></script> -->
<!-- JavaScript Test -->
<script>
$(function () {
- $('.js-popover').popover()
- $('.js-tooltip').tooltip()
- $('#tall-toggle').click(function () {
- $('#tall').toggle()
- })
+ // $('.js-popover').popover()
+ // $('.js-tooltip').tooltip()
+ // $('#tall-toggle').click(function () {
+ // $('#tall').toggle()
+ // })
})
</script>
diff --git a/js/tests/visual/popover.html b/js/tests/visual/popover.html
index 0e84f5cee..ac6557256 100644
--- a/js/tests/visual/popover.html
+++ b/js/tests/visual/popover.html
@@ -5,7 +5,7 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Popover</title>
- <link rel="stylesheet" href="../../../dist/css/bootstrap.min.css">
+ <link rel="stylesheet" href="../../../dist/css/bootstrap.css">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
@@ -39,9 +39,11 @@
<!-- JavaScript Includes -->
<script src="../vendor/jquery.min.js"></script>
-<script src="../../transition.js"></script>
-<script src="../../tooltip.js"></script>
-<script src="../../popover.js"></script>
+<script src="../vendor/tether.min.js"></script>
+<script src="../../dist/util.js"></script>
+<script src="../../dist/tooltip.js"></script>
+<script src="../../dist/popover.js"></script>
+
<!-- JavaScript Test -->
<script>
diff --git a/js/tests/visual/scrollspy.html b/js/tests/visual/scrollspy.html
index 5952b7e59..9958f90c0 100644
--- a/js/tests/visual/scrollspy.html
+++ b/js/tests/visual/scrollspy.html
@@ -24,21 +24,12 @@
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container-fluid">
- <div class="navbar-header">
- <button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target=".js-navbar-scrollspy">
- <span class="sr-only">Toggle navigation</span>
- <span class="icon-bar"></span>
- <span class="icon-bar"></span>
- <span class="icon-bar"></span>
- </button>
- <a class="navbar-brand" href="#">Project Name</a>
- </div>
- <div class="collapse navbar-collapse js-navbar-scrollspy">
+ <div class="js-navbar-scrollspy">
<ul class="nav navbar-nav">
- <li class=""><a href="#fat">@fat</a></li>
- <li class=""><a href="#mdo">@mdo</a></li>
- <li class="dropdown">
- <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <li class="nav-item active"><a class="nav-link" href="#fat">@fat</a></li>
+ <li class="nav-item"><a class="nav-link" href="#mdo">@mdo</a></li>
+ <li class="dropdown nav-item">
+ <a href="#" class="dropdown-toggle nav-link" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu" role="menu">
<li class=""><a href="#one" tabindex="-1">one</a></li>
<li><a href="#two" tabindex="-1">two</a></li>
@@ -100,10 +91,10 @@
<!-- JavaScript Includes -->
<script src="../vendor/jquery.min.js"></script>
-<script src="../../transition.js"></script>
-<script src="../../scrollspy.js"></script>
-<script src="../../dropdown.js"></script>
-<script src="../../collapse.js"></script>
+<script src="../../dist/util.js"></script>
+<script src="../../dist/scrollspy.js"></script>
+<script src="../../dist/dropdown.js"></script>
+<script src="../../dist/collapse.js"></script>
</body>
</html>
diff --git a/js/tests/visual/tab.html b/js/tests/visual/tab.html
index a3fed1e9f..ff6685fed 100644
--- a/js/tests/visual/tab.html
+++ b/js/tests/visual/tab.html
@@ -35,10 +35,10 @@
<h4>Tabs without fade</h4>
<ul id="myTab" class="nav nav-tabs">
- <li class="active"><a href="#home" data-toggle="tab">Home</a></li>
- <li><a href="#profile" data-toggle="tab">Profile</a></li>
- <li class="dropdown">
- <a href="#" id="myTabDrop1" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <li class="active nav-item"><a href="#home" class="nav-link" data-toggle="tab">Home</a></li>
+ <li class="nav-item"><a href="#profile" data-toggle="tab" class="nav-link">Profile</a></li>
+ <li class="dropdown nav-item">
+ <a href="#" id="myTabDrop1" class="dropdown-toggle nav-link" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu" role="menu" aria-labelledby="myTabDrop1">
<li><a href="#dropdown1" tabindex="-1" data-toggle="tab">@fat</a></li>
<li><a href="#dropdown2" tabindex="-1" data-toggle="tab">@mdo</a></li>
@@ -67,10 +67,10 @@
<h4>Tabs with fade</h4>
<ul id="myTab1" class="nav nav-tabs">
- <li class="active"><a href="#home1" data-toggle="tab">Home</a></li>
- <li><a href="#profile1" data-toggle="tab">Profile</a></li>
- <li class="dropdown">
- <a href="#" id="myTabDrop2" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <li class="active nav-item"><a class="nav-link" href="#home1" data-toggle="tab">Home</a></li>
+ <li class="nav-item"><a class="nav-link" href="#profile1" data-toggle="tab">Profile</a></li>
+ <li class="dropdown nav-item">
+ <a href="#" id="myTabDrop2" class="dropdown-toggle nav-link" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu" role="menu" aria-labelledby="myTabDrop2">
<li><a href="#dropdown1-1" tabindex="-1" data-toggle="tab">@fat</a></li>
<li><a href="#dropdown1-2" tabindex="-1" data-toggle="tab">@mdo</a></li>
@@ -99,10 +99,10 @@
<h4>Tabs without fade (no initially active pane)</h4>
<ul id="myTab2" class="nav nav-tabs">
- <li><a href="#home2" data-toggle="tab">Home</a></li>
- <li><a href="#profile2" data-toggle="tab">Profile</a></li>
- <li class="dropdown">
- <a href="#" id="myTabDrop3" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <li class="nav-item"><a class="nav-link" href="#home2" data-toggle="tab">Home</a></li>
+ <li class="nav-item"><a class="nav-link" href="#profile2" data-toggle="tab">Profile</a></li>
+ <li class="dropdown nav-item">
+ <a href="#" id="myTabDrop3" class="dropdown-toggle nav-link" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu" role="menu" aria-labelledby="myTabDrop3">
<li><a href="#dropdown2-1" tabindex="-1" data-toggle="tab">@fat</a></li>
<li><a href="#dropdown2-2" tabindex="-1" data-toggle="tab">@mdo</a></li>
@@ -131,10 +131,10 @@
<h4>Tabs with fade (no initially active pane)</h4>
<ul id="myTab3" class="nav nav-tabs">
- <li><a href="#home3" data-toggle="tab">Home</a></li>
- <li><a href="#profile3" data-toggle="tab">Profile</a></li>
- <li class="dropdown">
- <a href="#" id="myTabDrop4" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <li class="nav-item"><a class="nav-link" href="#home3" data-toggle="tab">Home</a></li>
+ <li class="nav-item"><a class="nav-link" href="#profile3" data-toggle="tab">Profile</a></li>
+ <li class="dropdown nav-item">
+ <a href="#" id="myTabDrop4" class="dropdown-toggle nav-link" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu" role="menu" aria-labelledby="myTabDrop4">
<li><a href="#dropdown3-1" tabindex="-1" data-toggle="tab">@fat</a></li>
<li><a href="#dropdown3-2" tabindex="-1" data-toggle="tab">@mdo</a></li>
@@ -164,9 +164,9 @@
<!-- JavaScript Includes -->
<script src="../vendor/jquery.min.js"></script>
-<script src="../../transition.js"></script>
-<script src="../../tab.js"></script>
-<script src="../../dropdown.js"></script>
+<script src="../../dist/util.js"></script>
+<script src="../../dist/tab.js"></script>
+<script src="../../dist/dropdown.js"></script>
</body>
</html>
diff --git a/js/tests/visual/tooltip.html b/js/tests/visual/tooltip.html
index 8d10871c9..1946dff97 100644
--- a/js/tests/visual/tooltip.html
+++ b/js/tests/visual/tooltip.html
@@ -5,7 +5,7 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Tooltip</title>
- <link rel="stylesheet" href="../../../dist/css/bootstrap.min.css">
+ <link rel="stylesheet" href="../../../dist/css/bootstrap.css">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
@@ -22,7 +22,7 @@
<h1>Tooltip <small>Bootstrap Visual Test</small></h1>
</div>
- <p class="muted" style="margin-bottom: 0;">Tight pants next level keffiyeh <a href="#" data-toggle="tooltip" title="" data-original-title="Default tooltip">you probably</a> haven't heard of them. Photo booth beard raw denim letterpress vegan messenger bag stumptown. Farm-to-table seitan, mcsweeney's fixie sustainable quinoa 8-bit american apparel <a href="#" data-toggle="tooltip" title="" data-original-title="Another tooltip">have a</a> terry richardson vinyl chambray. Beard stumptown, cardigans banh mi lomo thundercats. Tofu biodiesel williamsburg marfa, four loko mcsweeney's cleanse vegan chambray. A really ironic artisan <a href="#" data-toggle="tooltip" title="" data-original-title="Another one here too">whatever keytar</a>, scenester farm-to-table banksy Austin <a href="#" data-toggle="tooltip" title="" data-original-title="The last tip!">twitter handle</a> freegan cred raw denim single-origin coffee viral.
+ <p class="muted" style="margin-bottom: 0;">Tight pants next level keffiyeh <a href="#" data-toggle="tooltip" title="Default tooltip">you probably</a> haven't heard of them. Photo booth beard raw denim letterpress vegan messenger bag stumptown. Farm-to-table seitan, mcsweeney's fixie sustainable quinoa 8-bit american apparel <a href="#" data-toggle="tooltip" title="Another tooltip">have a</a> terry richardson vinyl chambray. Beard stumptown, cardigans banh mi lomo thundercats. Tofu biodiesel williamsburg marfa, four loko mcsweeney's cleanse vegan chambray. A really ironic artisan <a href="#" data-toggle="tooltip" title="Another one here too">whatever keytar</a>, scenester farm-to-table banksy Austin <a href="#" data-toggle="tooltip" title="The last tip!">twitter handle</a> freegan cred raw denim single-origin coffee viral.
</p>
<hr>
<p>
@@ -36,8 +36,9 @@
<!-- JavaScript Includes -->
<script src="../vendor/jquery.min.js"></script>
-<script src="../../transition.js"></script>
-<script src="../../tooltip.js"></script>
+<script src="../vendor/tether.min.js"></script>
+<script src="../../dist/util.js"></script>
+<script src="../../dist/tooltip.js"></script>
<!-- JavaScript Test -->
<script>
generated by cgit v1.2.3 (git 2.25.1) at 2026-06-07 00:13:21 +0000