diff options
| author | Mark Otto <[email protected]> | 2014-11-11 19:25:16 -0800 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2014-11-11 19:25:16 -0800 |
| commit | 1e268ddfc30def5f4b2b0f2ace34b7de549ea830 (patch) | |
| tree | 7cc63bc43a6c3b603cef4f004a2285e5c034a710 /js | |
| parent | 4f6aeaa6347725436296131c4d2b059243390a04 (diff) | |
| parent | 001d5e00c58bbb8e4d34c085c5b27b214a475bd5 (diff) | |
| download | bootstrap-1e268ddfc30def5f4b2b0f2ace34b7de549ea830.tar.xz bootstrap-1e268ddfc30def5f4b2b0f2ace34b7de549ea830.zip | |
Merge branch 'master' into labels-readme
Diffstat (limited to 'js')
| -rw-r--r-- | js/affix.js | 4 | ||||
| -rw-r--r-- | js/alert.js | 4 | ||||
| -rw-r--r-- | js/button.js | 10 | ||||
| -rw-r--r-- | js/carousel.js | 13 | ||||
| -rw-r--r-- | js/collapse.js | 69 | ||||
| -rw-r--r-- | js/dropdown.js | 10 | ||||
| -rw-r--r-- | js/modal.js | 53 | ||||
| -rw-r--r-- | js/popover.js | 4 | ||||
| -rw-r--r-- | js/scrollspy.js | 4 | ||||
| -rw-r--r-- | js/tab.js | 12 | ||||
| -rw-r--r-- | js/tests/index.html | 9 | ||||
| -rw-r--r-- | js/tests/unit/button.js | 10 | ||||
| -rw-r--r-- | js/tests/unit/carousel.js | 42 | ||||
| -rw-r--r-- | js/tests/unit/collapse.js | 72 | ||||
| -rw-r--r-- | js/tests/unit/dropdown.js | 41 | ||||
| -rw-r--r-- | js/tests/visual/affix.html | 12 | ||||
| -rw-r--r-- | js/tests/visual/alert.html | 12 | ||||
| -rw-r--r-- | js/tests/visual/button.html | 12 | ||||
| -rw-r--r-- | js/tests/visual/carousel.html | 12 | ||||
| -rw-r--r-- | js/tests/visual/collapse.html | 12 | ||||
| -rw-r--r-- | js/tests/visual/dropdown.html | 12 | ||||
| -rw-r--r-- | js/tests/visual/modal.html | 12 | ||||
| -rw-r--r-- | js/tests/visual/popover.html | 12 | ||||
| -rw-r--r-- | js/tests/visual/scrollspy.html | 15 | ||||
| -rw-r--r-- | js/tests/visual/tab.html | 16 | ||||
| -rw-r--r-- | js/tests/visual/tooltip.html | 12 | ||||
| -rw-r--r-- | js/tooltip.js | 4 | ||||
| -rw-r--r-- | js/transition.js | 2 |
28 files changed, 410 insertions, 92 deletions
diff --git a/js/affix.js b/js/affix.js index b8519ecb3..e4efa20c6 100644 --- a/js/affix.js +++ b/js/affix.js @@ -1,5 +1,5 @@ /* ======================================================================== - * Bootstrap: affix.js v3.2.0 + * Bootstrap: affix.js v3.3.0 * http://getbootstrap.com/javascript/#affix * ======================================================================== * Copyright 2011-2014 Twitter, Inc. @@ -28,7 +28,7 @@ this.checkPosition() } - Affix.VERSION = '3.2.0' + Affix.VERSION = '3.3.0' Affix.RESET = 'affix affix-top affix-bottom' diff --git a/js/alert.js b/js/alert.js index 10483899d..d47d85fc5 100644 --- a/js/alert.js +++ b/js/alert.js @@ -1,5 +1,5 @@ /* ======================================================================== - * Bootstrap: alert.js v3.2.0 + * Bootstrap: alert.js v3.3.0 * http://getbootstrap.com/javascript/#alerts * ======================================================================== * Copyright 2011-2014 Twitter, Inc. @@ -18,7 +18,7 @@ $(el).on('click', dismiss, this.close) } - Alert.VERSION = '3.2.0' + Alert.VERSION = '3.3.0' Alert.TRANSITION_DURATION = 150 diff --git a/js/button.js b/js/button.js index 901e47a6e..403829490 100644 --- a/js/button.js +++ b/js/button.js @@ -1,5 +1,5 @@ /* ======================================================================== - * Bootstrap: button.js v3.2.0 + * Bootstrap: button.js v3.3.0 * http://getbootstrap.com/javascript/#buttons * ======================================================================== * Copyright 2011-2014 Twitter, Inc. @@ -19,7 +19,7 @@ this.isLoading = false } - Button.VERSION = '3.2.0' + Button.VERSION = '3.3.0' Button.DEFAULTS = { loadingText: 'loading...' @@ -35,10 +35,10 @@ if (data.resetText == null) $el.data('resetText', $el[val]()) - $el[val](data[state] == null ? this.options[state] : data[state]) - // push to event loop to allow forms to submit setTimeout($.proxy(function () { + $el[val](data[state] == null ? this.options[state] : data[state]) + if (state == 'loadingText') { this.isLoading = true $el.addClass(d).attr(d, d) @@ -110,7 +110,7 @@ e.preventDefault() }) .on('focus.bs.button.data-api blur.bs.button.data-api', '[data-toggle^="button"]', function (e) { - $(e.target).closest('.btn').toggleClass('focus', e.type == 'focus') + $(e.target).closest('.btn').toggleClass('focus', /^focus(in)?$/.test(e.type)) }) }(jQuery); diff --git a/js/carousel.js b/js/carousel.js index b68899009..82106d278 100644 --- a/js/carousel.js +++ b/js/carousel.js @@ -1,5 +1,5 @@ /* ======================================================================== - * Bootstrap: carousel.js v3.2.0 + * Bootstrap: carousel.js v3.3.0 * http://getbootstrap.com/javascript/#carousel * ======================================================================== * Copyright 2011-2014 Twitter, Inc. @@ -30,7 +30,7 @@ .on('mouseleave.bs.carousel', $.proxy(this.cycle, this)) } - Carousel.VERSION = '3.2.0' + Carousel.VERSION = '3.3.0' Carousel.TRANSITION_DURATION = 600 @@ -42,6 +42,7 @@ } Carousel.prototype.keydown = function (e) { + if (/input|textarea/i.test(e.target.tagName)) return switch (e.which) { case 37: this.prev(); break case 39: this.next(); break @@ -207,7 +208,7 @@ // CAROUSEL DATA-API // ================= - $(document).on('click.bs.carousel.data-api', '[data-slide], [data-slide-to]', function (e) { + var clickHandler = function (e) { var href var $this = $(this) var $target = $($this.attr('data-target') || (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '')) // strip for ie7 @@ -223,7 +224,11 @@ } e.preventDefault() - }) + } + + $(document) + .on('click.bs.carousel.data-api', '[data-slide]', clickHandler) + .on('click.bs.carousel.data-api', '[data-slide-to]', clickHandler) $(window).on('load', function () { $('[data-ride="carousel"]').each(function () { diff --git a/js/collapse.js b/js/collapse.js index abbf25f2a..4f8596444 100644 --- a/js/collapse.js +++ b/js/collapse.js @@ -1,5 +1,5 @@ /* ======================================================================== - * Bootstrap: collapse.js v3.2.0 + * Bootstrap: collapse.js v3.3.0 * http://getbootstrap.com/javascript/#collapse * ======================================================================== * Copyright 2011-2014 Twitter, Inc. @@ -16,18 +16,25 @@ var Collapse = function (element, options) { this.$element = $(element) this.options = $.extend({}, Collapse.DEFAULTS, options) + this.$trigger = $(this.options.trigger).filter('[href="#' + element.id + '"], [data-target="#' + element.id + '"]') this.transitioning = null - if (this.options.parent) this.$parent = $(this.options.parent) + if (this.options.parent) { + this.$parent = this.getParent() + } else { + this.addAriaAndCollapsedClass(this.$element, this.$trigger) + } + if (this.options.toggle) this.toggle() } - Collapse.VERSION = '3.2.0' + Collapse.VERSION = '3.3.0' Collapse.TRANSITION_DURATION = 350 Collapse.DEFAULTS = { - toggle: true + toggle: true, + trigger: '[data-toggle="collapse"]' } Collapse.prototype.dimension = function () { @@ -62,6 +69,10 @@ .addClass('collapsing')[dimension](0) .attr('aria-expanded', true) + this.$trigger + .removeClass('collapsed') + .attr('aria-expanded', true) + this.transitioning = 1 var complete = function () { @@ -98,6 +109,10 @@ .removeClass('collapse in') .attr('aria-expanded', false) + this.$trigger + .addClass('collapsed') + .attr('aria-expanded', false) + this.transitioning = 1 var complete = function () { @@ -120,6 +135,33 @@ this[this.$element.hasClass('in') ? 'hide' : 'show']() } + Collapse.prototype.getParent = function () { + return $(this.options.parent) + .find('[data-toggle="collapse"][data-parent="' + this.options.parent + '"]') + .each($.proxy(function (i, element) { + var $element = $(element) + this.addAriaAndCollapsedClass(getTargetFromTrigger($element), $element) + }, this)) + .end() + } + + Collapse.prototype.addAriaAndCollapsedClass = function ($element, $trigger) { + var isOpen = $element.hasClass('in') + + $element.attr('aria-expanded', isOpen) + $trigger + .toggleClass('collapsed', !isOpen) + .attr('aria-expanded', isOpen) + } + + function getTargetFromTrigger($trigger) { + var href + var target = $trigger.attr('data-target') + || (href = $trigger.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '') // strip for ie7 + + return $(target) + } + // COLLAPSE PLUGIN DEFINITION // ========================== @@ -155,22 +197,13 @@ // ================= $(document).on('click.bs.collapse.data-api', '[data-toggle="collapse"]', function (e) { - var href var $this = $(this) - var target = $this.attr('data-target') - || e.preventDefault() - || (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '') // strip for ie7 - var $target = $(target) + + if (!$this.attr('data-target')) e.preventDefault() + + var $target = getTargetFromTrigger($this) var data = $target.data('bs.collapse') - var option = data ? 'toggle' : $this.data() - var parent = $this.attr('data-parent') - var $parent = parent && $(parent) - - if (!data || !data.transitioning) { - if ($parent) $parent.find('[data-toggle="collapse"][data-parent="' + parent + '"]').not($this).addClass('collapsed').attr('aria-expanded', false) - var isCollapsed = $target.hasClass('in') - $this.toggleClass('collapsed', isCollapsed).attr('aria-expanded', !isCollapsed) - } + var option = data ? 'toggle' : $.extend({}, $this.data(), { trigger: this }) Plugin.call($target, option) }) diff --git a/js/dropdown.js b/js/dropdown.js index 7388f8124..64ec34d5d 100644 --- a/js/dropdown.js +++ b/js/dropdown.js @@ -1,5 +1,5 @@ /* ======================================================================== - * Bootstrap: dropdown.js v3.2.0 + * Bootstrap: dropdown.js v3.3.0 * http://getbootstrap.com/javascript/#dropdowns * ======================================================================== * Copyright 2011-2014 Twitter, Inc. @@ -19,7 +19,7 @@ $(element).on('click.bs.dropdown', this.toggle) } - Dropdown.VERSION = '3.2.0' + Dropdown.VERSION = '3.3.0' Dropdown.prototype.toggle = function (e) { var $this = $(this) @@ -55,7 +55,7 @@ } Dropdown.prototype.keydown = function (e) { - if (!/(38|40|27|32)/.test(e.which)) return + if (!/(38|40|27|32)/.test(e.which) || /input|textarea/i.test(e.target.tagName)) return var $this = $(this) @@ -154,6 +154,8 @@ .on('click.bs.dropdown.data-api', clearMenus) .on('click.bs.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() }) .on('click.bs.dropdown.data-api', toggle, Dropdown.prototype.toggle) - .on('keydown.bs.dropdown.data-api', toggle + ', [role="menu"], [role="listbox"]', Dropdown.prototype.keydown) + .on('keydown.bs.dropdown.data-api', toggle, Dropdown.prototype.keydown) + .on('keydown.bs.dropdown.data-api', '[role="menu"]', Dropdown.prototype.keydown) + .on('keydown.bs.dropdown.data-api', '[role="listbox"]', Dropdown.prototype.keydown) }(jQuery); diff --git a/js/modal.js b/js/modal.js index 6e2ac7e74..ed3f0293f 100644 --- a/js/modal.js +++ b/js/modal.js @@ -1,5 +1,5 @@ /* ======================================================================== - * Bootstrap: modal.js v3.2.0 + * Bootstrap: modal.js v3.3.0 * http://getbootstrap.com/javascript/#modals * ======================================================================== * Copyright 2011-2014 Twitter, Inc. @@ -30,7 +30,7 @@ } } - Modal.VERSION = '3.2.0' + Modal.VERSION = '3.3.0' Modal.TRANSITION_DURATION = 300 Modal.BACKDROP_TRANSITION_DURATION = 150 @@ -56,10 +56,11 @@ this.isShown = true this.checkScrollbar() + this.setScrollbar() this.$body.addClass('modal-open') - this.setScrollbar() this.escape() + this.resize() this.$element.on('click.dismiss.bs.modal', '[data-dismiss="modal"]', $.proxy(this.hide, this)) @@ -74,6 +75,9 @@ .show() .scrollTop(0) + if (that.options.backdrop) that.adjustBackdrop() + that.adjustDialog() + if (transition) { that.$element[0].offsetWidth // force reflow } @@ -108,6 +112,7 @@ this.isShown = false this.escape() + this.resize() $(document).off('focusin.bs.modal') @@ -143,11 +148,20 @@ } } + Modal.prototype.resize = function () { + if (this.isShown) { + $(window).on('resize.bs.modal', $.proxy(this.handleUpdate, this)) + } else { + $(window).off('resize.bs.modal') + } + } + Modal.prototype.hideModal = function () { var that = this this.$element.hide() this.backdrop(function () { that.$body.removeClass('modal-open') + that.resetAdjustments() that.resetScrollbar() that.$element.trigger('hidden.bs.modal') }) @@ -204,13 +218,43 @@ } } + // these following methods are used to handle overflowing modals + + Modal.prototype.handleUpdate = function () { + if (this.options.backdrop) this.adjustBackdrop() + this.adjustDialog() + } + + Modal.prototype.adjustBackdrop = function () { + this.$backdrop + .css('height', 0) + .css('height', this.$element[0].scrollHeight) + } + + Modal.prototype.adjustDialog = function () { + var modalIsOverflowing = this.$element[0].scrollHeight > document.documentElement.clientHeight + + this.$element.css({ + paddingLeft: !this.bodyIsOverflowing && modalIsOverflowing ? this.scrollbarWidth : '', + paddingRight: this.bodyIsOverflowing && !modalIsOverflowing ? this.scrollbarWidth : '' + }) + } + + Modal.prototype.resetAdjustments = function () { + this.$element.css({ + paddingLeft: '', + paddingRight: '' + }) + } + Modal.prototype.checkScrollbar = function () { + this.bodyIsOverflowing = document.body.scrollHeight > document.documentElement.clientHeight this.scrollbarWidth = this.measureScrollbar() } Modal.prototype.setScrollbar = function () { var bodyPad = parseInt((this.$body.css('padding-right') || 0), 10) - if (this.scrollbarWidth) this.$body.css('padding-right', bodyPad + this.scrollbarWidth) + if (this.bodyIsOverflowing) this.$body.css('padding-right', bodyPad + this.scrollbarWidth) } Modal.prototype.resetScrollbar = function () { @@ -218,7 +262,6 @@ } Modal.prototype.measureScrollbar = function () { // thx walsh - if (document.body.clientWidth >= window.innerWidth) return 0 var scrollDiv = document.createElement('div') scrollDiv.className = 'modal-scrollbar-measure' this.$body.append(scrollDiv) diff --git a/js/popover.js b/js/popover.js index c69be715f..354805917 100644 --- a/js/popover.js +++ b/js/popover.js @@ -1,5 +1,5 @@ /* ======================================================================== - * Bootstrap: popover.js v3.2.0 + * Bootstrap: popover.js v3.3.0 * http://getbootstrap.com/javascript/#popovers * ======================================================================== * Copyright 2011-2014 Twitter, Inc. @@ -19,7 +19,7 @@ if (!$.fn.tooltip) throw new Error('Popover requires tooltip.js') - Popover.VERSION = '3.2.0' + Popover.VERSION = '3.3.0' Popover.DEFAULTS = $.extend({}, $.fn.tooltip.Constructor.DEFAULTS, { placement: 'right', diff --git a/js/scrollspy.js b/js/scrollspy.js index 430b5d6aa..973021a93 100644 --- a/js/scrollspy.js +++ b/js/scrollspy.js @@ -1,5 +1,5 @@ /* ======================================================================== - * Bootstrap: scrollspy.js v3.2.0 + * Bootstrap: scrollspy.js v3.3.0 * http://getbootstrap.com/javascript/#scrollspy * ======================================================================== * Copyright 2011-2014 Twitter, Inc. @@ -30,7 +30,7 @@ this.process() } - ScrollSpy.VERSION = '3.2.0' + ScrollSpy.VERSION = '3.3.0' ScrollSpy.DEFAULTS = { offset: 10 @@ -1,5 +1,5 @@ /* ======================================================================== - * Bootstrap: tab.js v3.2.0 + * Bootstrap: tab.js v3.3.0 * http://getbootstrap.com/javascript/#tabs * ======================================================================== * Copyright 2011-2014 Twitter, Inc. @@ -17,7 +17,7 @@ this.element = $(element) } - Tab.VERSION = '3.2.0' + Tab.VERSION = '3.3.0' Tab.TRANSITION_DURATION = 150 @@ -141,9 +141,13 @@ // TAB DATA-API // ============ - $(document).on('click.bs.tab.data-api', '[data-toggle="tab"], [data-toggle="pill"]', function (e) { + var clickHandler = function (e) { e.preventDefault() Plugin.call($(this), 'show') - }) + } + + $(document) + .on('click.bs.tab.data-api', '[data-toggle="tab"]', clickHandler) + .on('click.bs.tab.data-api', '[data-toggle="pill"]', clickHandler) }(jQuery); diff --git a/js/tests/index.html b/js/tests/index.html index 194f531aa..b32f0adc2 100644 --- a/js/tests/index.html +++ b/js/tests/index.html @@ -3,6 +3,7 @@ <head> <meta charset="utf-8"> <title>Bootstrap Plugin Test Suite</title> + <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- jQuery --> <script src="vendor/jquery.min.js"></script> @@ -12,7 +13,12 @@ <script src="vendor/qunit.js"></script> <style> #qunit-tests > li.pass { - display: none;/* Make it easier to see failing tests is Sauce screencasts */ + display: none;/* Make it easier to see failing tests in Sauce screencasts */ + } + + #qunit-fixture { + top: 0; + left: 0; } </style> <script> @@ -36,6 +42,7 @@ }) QUnit.testStart(function (testDetails) { + $(window).scrollTop(0) QUnit.log = function (details) { if (!details.result) { details.name = testDetails.name diff --git a/js/tests/unit/button.js b/js/tests/unit/button.js index 73747cdd4..320996483 100644 --- a/js/tests/unit/button.js +++ b/js/tests/unit/button.js @@ -33,9 +33,9 @@ $(function () { var $btn = $('<button class="btn" data-loading-text="fat">mdo</button>') equal($btn.html(), 'mdo', 'btn text equals mdo') $btn.bootstrapButton('loading') - equal($btn.html(), 'fat', 'btn text equals fat') stop() setTimeout(function () { + equal($btn.html(), 'fat', 'btn text equals fat') ok($btn[0].hasAttribute('disabled'), 'btn is disabled') ok($btn.hasClass('disabled'), 'btn has disabled class') start() @@ -46,16 +46,16 @@ $(function () { var $btn = $('<button class="btn" data-loading-text="fat">mdo</button>') equal($btn.html(), 'mdo', 'btn text equals mdo') $btn.bootstrapButton('loading') - equal($btn.html(), 'fat', 'btn text equals fat') stop() setTimeout(function () { + equal($btn.html(), 'fat', 'btn text equals fat') ok($btn[0].hasAttribute('disabled'), 'btn is disabled') ok($btn.hasClass('disabled'), 'btn has disabled class') start() stop() $btn.bootstrapButton('reset') - equal($btn.html(), 'mdo', 'btn text equals mdo') setTimeout(function () { + equal($btn.html(), 'mdo', 'btn text equals mdo') ok(!$btn[0].hasAttribute('disabled'), 'btn is not disabled') ok(!$btn.hasClass('disabled'), 'btn does not have disabled class') start() @@ -67,16 +67,16 @@ $(function () { var $btn = $('<button class="btn" data-loading-text="fat"/>') equal($btn.html(), '', 'btn text equals ""') $btn.bootstrapButton('loading') - equal($btn.html(), 'fat', 'btn text equals fat') stop() setTimeout(function () { + equal($btn.html(), 'fat', 'btn text equals fat') ok($btn[0].hasAttribute('disabled'), 'btn is disabled') ok($btn.hasClass('disabled'), 'btn has disabled class') start() stop() $btn.bootstrapButton('reset') - equal($btn.html(), '', 'btn text equals ""') setTimeout(function () { + equal($btn.html(), '', 'btn text equals ""') ok(!$btn[0].hasAttribute('disabled'), 'btn is not disabled') ok(!$btn.hasClass('disabled'), 'btn does not have disabled class') start() diff --git a/js/tests/unit/carousel.js b/js/tests/unit/carousel.js index 6f0b9642f..5998abe6a 100644 --- a/js/tests/unit/carousel.js +++ b/js/tests/unit/carousel.js @@ -478,6 +478,48 @@ $(function () { strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after left arrow press') }) + test('should ignore keyboard events within <input>s and <textarea>s', function () { + var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false">' + + '<div class="carousel-inner">' + + '<div id="first" class="item active">' + + '<img alt="">' + + '<input type="text" id="in-put">' + + '<textarea id="text-area"></textarea>' + + '</div>' + + '<div id="second" class="item">' + + '<img alt="">' + + '</div>' + + '<div id="third" class="item">' + + '<img alt="">' + + '</div>' + + '</div>' + + '</div>' + var $template = $(templateHTML) + var $input = $template.find('#in-put') + var $textarea = $template.find('#text-area') + + strictEqual($input.length, 1, 'found <input>') + strictEqual($textarea.length, 1, 'found <textarea>') + + $template.bootstrapCarousel() + + strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active') + + + $input.trigger($.Event('keydown', { which: 39 })) + strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after right arrow press in <input>') + + $input.trigger($.Event('keydown', { which: 37 })) + strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after left arrow press in <input>') + + + $textarea.trigger($.Event('keydown', { which: 39 })) + strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after right arrow press in <textarea>') + + $textarea.trigger($.Event('keydown', { which: 37 })) + strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after left arrow press in <textarea>') + }) + test('should only add mouseenter and mouseleave listeners when not on mobile', function () { var isMobile = 'ontouchstart' in document.documentElement var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false" data-pause="hover">' diff --git a/js/tests/unit/collapse.js b/js/tests/unit/collapse.js index c1d78575c..30d00e413 100644 --- a/js/tests/unit/collapse.js +++ b/js/tests/unit/collapse.js @@ -79,7 +79,7 @@ $(function () { $('<div id="test1"/>') .appendTo('#qunit-fixture') - .on('show.bs.collapse', function () { + .on('shown.bs.collapse', function () { ok(!$target.hasClass('collapsed')) start() }) @@ -94,7 +94,7 @@ $(function () { $('<div id="test1" class="in"/>') .appendTo('#qunit-fixture') - .on('hide.bs.collapse', function () { + .on('hidden.bs.collapse', function () { ok($target.hasClass('collapsed')) start() }) @@ -137,12 +137,12 @@ $(function () { test('should remove "collapsed" class from active accordion target', function () { stop() - var accordionHTML = '<div id="accordion">' - + '<div class="accordion-group"/>' - + '<div class="accordion-group"/>' - + '<div class="accordion-group"/>' + var accordionHTML = '<div class="panel-group" id="accordion">' + + '<div class="panel"/>' + + '<div class="panel"/>' + + '<div class="panel"/>' + '</div>' - var $groups = $(accordionHTML).appendTo('#qunit-fixture').find('.accordion-group') + var $groups = $(accordionHTML).appendTo('#qunit-fixture').find('.panel') var $target1 = $('<a data-toggle="collapse" href="#body1" data-parent="#accordion"/>').appendTo($groups.eq(0)) @@ -156,7 +156,7 @@ $(function () { $('<div id="body3"/>') .appendTo($groups.eq(2)) - .on('show.bs.collapse', function () { + .on('shown.bs.collapse', function () { ok($target1.hasClass('collapsed'), 'inactive target 1 does have class "collapsed"') ok($target2.hasClass('collapsed'), 'inactive target 2 does have class "collapsed"') ok(!$target3.hasClass('collapsed'), 'active target 3 does not have class "collapsed"') @@ -170,12 +170,12 @@ $(function () { test('should allow dots in data-parent', function () { stop() - var accordionHTML = '<div class="accordion">' - + '<div class="accordion-group"/>' - + '<div class="accordion-group"/>' - + '<div class="accordion-group"/>' + var accordionHTML = '<div class="panel-group accordion">' + + '<div class="panel"/>' + + '<div class="panel"/>' + + '<div class="panel"/>' + '</div>' - var $groups = $(accordionHTML).appendTo('#qunit-fixture').find('.accordion-group') + var $groups = $(accordionHTML).appendTo('#qunit-fixture').find('.panel') var $target1 = $('<a data-toggle="collapse" href="#body1" data-parent=".accordion"/>').appendTo($groups.eq(0)) @@ -189,7 +189,7 @@ $(function () { $('<div id="body3"/>') .appendTo($groups.eq(2)) - .on('show.bs.collapse', function () { + .on('shown.bs.collapse', function () { ok($target1.hasClass('collapsed'), 'inactive target 1 does have class "collapsed"') ok($target2.hasClass('collapsed'), 'inactive target 2 does have class "collapsed"') ok(!$target3.hasClass('collapsed'), 'active target 3 does not have class "collapsed"') @@ -207,7 +207,7 @@ $(function () { $('<div id="test1"/>') .appendTo('#qunit-fixture') - .on('show.bs.collapse', function () { + .on('shown.bs.collapse', function () { equal($target.attr('aria-expanded'), 'true', 'aria-expanded on target is "true"') start() }) @@ -222,7 +222,7 @@ $(function () { $('<div id="test1" class="in"/>') .appendTo('#qunit-fixture') - .on('hide.bs.collapse', function () { + .on('hidden.bs.collapse', function () { equal($target.attr('aria-expanded'), 'false', 'aria-expanded on target is "false"') start() }) @@ -233,12 +233,12 @@ $(function () { test('should change aria-expanded from active accordion target to "false" and set the newly active one to "true"', function () { stop() - var accordionHTML = '<div id="accordion">' - + '<div class="accordion-group"/>' - + '<div class="accordion-group"/>' - + '<div class="accordion-group"/>' + var accordionHTML = '<div class="panel-group" id="accordion">' + + '<div class="panel"/>' + + '<div class="panel"/>' + + '<div class="panel"/>' + '</div>' - var $groups = $(accordionHTML).appendTo('#qunit-fixture').find('.accordion-group') + var $groups = $(accordionHTML).appendTo('#qunit-fixture').find('.panel') var $target1 = $('<a data-toggle="collapse" href="#body1" data-parent="#accordion"/>').appendTo($groups.eq(0)) @@ -252,7 +252,7 @@ $(function () { $('<div id="body3" aria-expanded="false"/>') .appendTo($groups.eq(2)) - .on('show.bs.collapse', function () { + .on('shown.bs.collapse', function () { equal($target1.attr('aria-expanded'), 'false', 'inactive target 1 has aria-expanded="false"') equal($target2.attr('aria-expanded'), 'false', 'inactive target 2 has aria-expanded="false"') equal($target3.attr('aria-expanded'), 'true', 'active target 3 has aria-expanded="false"') @@ -298,4 +298,32 @@ $(function () { }, 1) }) + test('should add "collapsed" class to target when collapse is hidden via manual invocation', function () { + stop() + + var $target = $('<a data-toggle="collapse" href="#test1"/>').appendTo('#qunit-fixture') + + $('<div id="test1" class="in"/>') + .appendTo('#qunit-fixture') + .on('hidden.bs.collapse', function () { + ok($target.hasClass('collapsed')) + start() + }) + .bootstrapCollapse('hide') + }) + + test('should remove "collapsed" class from target when collapse is shown via manual invocation', function () { + stop() + + var $target = $('<a data-toggle="collapse" class="collapsed" href="#test1"/>').appendTo('#qunit-fixture') + + $('<div id="test1"/>') + .appendTo('#qunit-fixture') + .on('shown.bs.collapse', function () { + ok(!$target.hasClass('collapsed')) + start() + }) + .bootstrapCollapse('show') + }) + }) diff --git a/js/tests/unit/dropdown.js b/js/tests/unit/dropdown.js index 335795fde..3cdf637ee 100644 --- a/js/tests/unit/dropdown.js +++ b/js/tests/unit/dropdown.js @@ -224,4 +224,45 @@ $(function () { $(document.body).click() }) + test('should ignore keyboard events within <input>s and <textarea>s', function () { + stop() + + var dropdownHTML = '<ul class="tabs">' + + '<li class="dropdown">' + + '<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>' + + '<ul class="dropdown-menu" role="menu">' + + '<li><a href="#">Secondary link</a></li>' + + '<li><a href="#">Something else here</a></li>' + + '<li class="divider"/>' + + '<li><a href="#">Another link</a></li>' + + '<li><input type="text" id="input"></li>' + + '<li><textarea id="textarea"/></li>' + + '</ul>' + + '</li>' + + '</ul>' + var $dropdown = $(dropdownHTML) + .appendTo('#qunit-fixture') + .find('[data-toggle="dropdown"]') + .bootstrapDropdown() + + var $input = $('#input') + var $textarea = $('#textarea') + + $dropdown + .parent('.dropdown') + .on('shown.bs.dropdown', function () { + ok(true, 'shown was fired') + + $input.focus().trigger($.Event('keydown', { which: 38 })) + ok($(document.activeElement).is($input), 'input still focused') + + $textarea.focus().trigger($.Event('keydown', { which: 38 })) + ok($(document.activeElement).is($textarea), 'textarea still focused') + + start() + }) + + $dropdown.click() + }) + }) diff --git a/js/tests/visual/affix.html b/js/tests/visual/affix.html index 40a55ab51..4d772dc73 100644 --- a/js/tests/visual/affix.html +++ b/js/tests/visual/affix.html @@ -1,8 +1,11 @@ <!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" type="text/css" href="../../../dist/css/bootstrap.min.css"> + <link rel="stylesheet" href="../../../dist/css/bootstrap.min.css"> <style> /* Test Styles */ @@ -37,6 +40,13 @@ 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> diff --git a/js/tests/visual/alert.html b/js/tests/visual/alert.html index 688e6362c..0070315a2 100644 --- a/js/tests/visual/alert.html +++ b/js/tests/visual/alert.html @@ -1,8 +1,18 @@ <!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>Alert</title> - <link rel="stylesheet" type="text/css" href="../../../dist/css/bootstrap.min.css"> + <link rel="stylesheet" href="../../../dist/css/bootstrap.min.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:// --> + <!--[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> diff --git a/js/tests/visual/button.html b/js/tests/visual/button.html index 01c7dd4b3..d92a08329 100644 --- a/js/tests/visual/button.html +++ b/js/tests/visual/button.html @@ -1,8 +1,18 @@ <!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>Button</title> - <link rel="stylesheet" type="text/css" href="../../../dist/css/bootstrap.min.css"> + <link rel="stylesheet" href="../../../dist/css/bootstrap.min.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:// --> + <!--[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> diff --git a/js/tests/visual/carousel.html b/js/tests/visual/carousel.html index aaf48b059..8dede0921 100644 --- a/js/tests/visual/carousel.html +++ b/js/tests/visual/carousel.html @@ -1,8 +1,18 @@ <!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>Carousel</title> - <link rel="stylesheet" type="text/css" href="../../../dist/css/bootstrap.min.css"> + <link rel="stylesheet" href="../../../dist/css/bootstrap.min.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:// --> + <!--[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> diff --git a/js/tests/visual/collapse.html b/js/tests/visual/collapse.html index 792ba796d..b7a151516 100644 --- a/js/tests/visual/collapse.html +++ b/js/tests/visual/collapse.html @@ -1,8 +1,18 @@ <!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>Collapse</title> - <link rel="stylesheet" type="text/css" href="../../../dist/css/bootstrap.min.css"> + <link rel="stylesheet" href="../../../dist/css/bootstrap.min.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:// --> + <!--[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> diff --git a/js/tests/visual/dropdown.html b/js/tests/visual/dropdown.html index 6c7f52b2f..02090b6cc 100644 --- a/js/tests/visual/dropdown.html +++ b/js/tests/visual/dropdown.html @@ -1,8 +1,18 @@ <!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>Dropdown</title> - <link rel="stylesheet" type="text/css" href="../../../dist/css/bootstrap.min.css"> + <link rel="stylesheet" href="../../../dist/css/bootstrap.min.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:// --> + <!--[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> diff --git a/js/tests/visual/modal.html b/js/tests/visual/modal.html index f4f61f47f..0af79cc55 100644 --- a/js/tests/visual/modal.html +++ b/js/tests/visual/modal.html @@ -1,8 +1,18 @@ <!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>Modal</title> - <link rel="stylesheet" type="text/css" href="../../../dist/css/bootstrap.min.css"> + <link rel="stylesheet" href="../../../dist/css/bootstrap.min.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:// --> + <!--[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> diff --git a/js/tests/visual/popover.html b/js/tests/visual/popover.html index c09739ff9..0e84f5cee 100644 --- a/js/tests/visual/popover.html +++ b/js/tests/visual/popover.html @@ -1,8 +1,18 @@ <!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>Popover</title> - <link rel="stylesheet" type="text/css" href="../../../dist/css/bootstrap.min.css"> + <link rel="stylesheet" href="../../../dist/css/bootstrap.min.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:// --> + <!--[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> diff --git a/js/tests/visual/scrollspy.html b/js/tests/visual/scrollspy.html index 2611337f5..5952b7e59 100644 --- a/js/tests/visual/scrollspy.html +++ b/js/tests/visual/scrollspy.html @@ -1,11 +1,22 @@ <!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>Scrollspy</title> - <link rel="stylesheet" type="text/css" href="../../../dist/css/bootstrap.min.css"> - <style type="text/css"> + <link rel="stylesheet" href="../../../dist/css/bootstrap.min.css"> + + <style> body { padding-top: 70px; } </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 data-spy="scroll" data-target=".navbar" data-offset="70"> diff --git a/js/tests/visual/tab.html b/js/tests/visual/tab.html index 28757df6e..a3fed1e9f 100644 --- a/js/tests/visual/tab.html +++ b/js/tests/visual/tab.html @@ -1,16 +1,28 @@ <!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>Tab</title> - <link rel="stylesheet" type="text/css" href="../../../dist/css/bootstrap.min.css"> - <style type="text/css"> + <link rel="stylesheet" href="../../../dist/css/bootstrap.min.css"> + + <style> h4 { margin: 40px 0 10px; } + .nav-tabs { margin-bottom: 15px; } </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> diff --git a/js/tests/visual/tooltip.html b/js/tests/visual/tooltip.html index aaf4b767d..8d10871c9 100644 --- a/js/tests/visual/tooltip.html +++ b/js/tests/visual/tooltip.html @@ -1,8 +1,18 @@ <!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>Tooltip</title> - <link rel="stylesheet" type="text/css" href="../../../dist/css/bootstrap.min.css"> + <link rel="stylesheet" href="../../../dist/css/bootstrap.min.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:// --> + <!--[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> diff --git a/js/tooltip.js b/js/tooltip.js index 6af0e7d72..68163c17a 100644 --- a/js/tooltip.js +++ b/js/tooltip.js @@ -1,5 +1,5 @@ /* ======================================================================== - * Bootstrap: tooltip.js v3.2.0 + * Bootstrap: tooltip.js v3.3.0 * http://getbootstrap.com/javascript/#tooltip * Inspired by the original jQuery.tipsy by Jason Frame * ======================================================================== @@ -25,7 +25,7 @@ this.init('tooltip', element, options) } - Tooltip.VERSION = '3.2.0' + Tooltip.VERSION = '3.3.0' Tooltip.TRANSITION_DURATION = 150 diff --git a/js/transition.js b/js/transition.js index 83f85bf45..81993834a 100644 --- a/js/transition.js +++ b/js/transition.js @@ -1,5 +1,5 @@ /* ======================================================================== - * Bootstrap: transition.js v3.2.0 + * Bootstrap: transition.js v3.3.0 * http://getbootstrap.com/javascript/#transitions * ======================================================================== * Copyright 2011-2014 Twitter, Inc. |
