aboutsummaryrefslogtreecommitdiff
path: root/js
diff options
context:
space:
mode:
authorMark Otto <[email protected]>2017-05-01 21:54:50 -0700
committerGitHub <[email protected]>2017-05-01 21:54:50 -0700
commit8c7fe6cf147e98fb5d8096f6e6536bcb4e207586 (patch)
treed33635083f70814945e92cb17957b6c522073379 /js
parentca44f5b03a9707dda74e1aa3f92a1b54de3ec6d5 (diff)
parente00de46540818fa11feb6d1f0e8b0089ba56f082 (diff)
downloadbootstrap-8c7fe6cf147e98fb5d8096f6e6536bcb4e207586.tar.xz
bootstrap-8c7fe6cf147e98fb5d8096f6e6536bcb4e207586.zip
Merge branch 'v4-dev' into form-tweaks
Diffstat (limited to 'js')
-rw-r--r--js/src/button.js6
-rw-r--r--js/src/collapse.js16
-rw-r--r--js/src/tab.js2
-rw-r--r--js/tests/unit/button.js17
-rw-r--r--js/tests/unit/collapse.js76
5 files changed, 95 insertions, 22 deletions
diff --git a/js/src/button.js b/js/src/button.js
index 6295d0db0..722fd489d 100644
--- a/js/src/button.js
+++ b/js/src/button.js
@@ -90,6 +90,12 @@ const Button = (($) => {
}
if (triggerChangeEvent) {
+ if (input.hasAttribute('disabled') ||
+ rootElement.hasAttribute('disabled') ||
+ input.classList.contains('disabled') ||
+ rootElement.classList.contains('disabled')) {
+ return
+ }
input.checked = !$(this._element).hasClass(ClassName.ACTIVE)
$(input).trigger('change')
}
diff --git a/js/src/collapse.js b/js/src/collapse.js
index dec272297..bf1c738f5 100644
--- a/js/src/collapse.js
+++ b/js/src/collapse.js
@@ -56,9 +56,8 @@ const Collapse = (($) => {
}
const Selector = {
- ACTIVES : '.card > .show, .card > .collapsing',
- DATA_TOGGLE : '[data-toggle="collapse"]',
- DATA_CHILDREN : 'data-children'
+ ACTIVES : '.show, .collapsing',
+ DATA_TOGGLE : '[data-toggle="collapse"]'
}
@@ -78,20 +77,13 @@ const Collapse = (($) => {
`[data-toggle="collapse"][href="#${element.id}"],` +
`[data-toggle="collapse"][data-target="#${element.id}"]`
))
+
this._parent = this._config.parent ? this._getParent() : null
if (!this._config.parent) {
this._addAriaAndCollapsedClass(this._element, this._triggerArray)
}
- this._selectorActives = Selector.ACTIVES
- if (this._parent) {
- const childrenSelector = this._parent.hasAttribute(Selector.DATA_CHILDREN) ? this._parent.getAttribute(Selector.DATA_CHILDREN) : null
- if (childrenSelector !== null) {
- this._selectorActives = `${childrenSelector} > .show, ${childrenSelector} > .collapsing`
- }
- }
-
if (this._config.toggle) {
this.toggle()
}
@@ -129,7 +121,7 @@ const Collapse = (($) => {
let activesData
if (this._parent) {
- actives = $.makeArray($(this._parent).find(this._selectorActives))
+ actives = $.makeArray($(this._parent).children().children(Selector.ACTIVES))
if (!actives.length) {
actives = null
}
diff --git a/js/src/tab.js b/js/src/tab.js
index 6f8187d17..c7bc520df 100644
--- a/js/src/tab.js
+++ b/js/src/tab.js
@@ -140,7 +140,7 @@ const Tab = (($) => {
}
dispose() {
- $.removeClass(this._element, DATA_KEY)
+ $.removeData(this._element, DATA_KEY)
this._element = null
}
diff --git a/js/tests/unit/button.js b/js/tests/unit/button.js
index abc04e10a..489d400a6 100644
--- a/js/tests/unit/button.js
+++ b/js/tests/unit/button.js
@@ -156,4 +156,21 @@ $(function () {
assert.ok($btn2.is(':not([aria-pressed])'), 'label for nested radio input has not been given an aria-pressed attribute')
})
+ QUnit.test('should handle disabled attribute on non-button elements', function (assert) {
+ assert.expect(2)
+ var groupHTML = ' <div class="btn-group disabled" data-toggle="buttons" aria-disabled="true" disabled>'
+ + '<label class="btn btn-danger disabled" aria-disabled="true" disabled>'
+ + '<input type="checkbox" aria-disabled="true" autocomplete="off" disabled class="disabled"/>'
+ + '</label>'
+ + '</div>'
+ var $group = $(groupHTML).appendTo('#qunit-fixture')
+
+ var $btn = $group.children().eq(0)
+ var $input = $btn.children().eq(0)
+
+ $btn.trigger('click')
+ assert.ok($btn.is(':not(.active)'), 'button did not become active')
+ assert.ok(!$input.is(':checked'), 'checkbox did not get checked')
+ })
+
})
diff --git a/js/tests/unit/collapse.js b/js/tests/unit/collapse.js
index 35fcf2108..2b9d0e58f 100644
--- a/js/tests/unit/collapse.js
+++ b/js/tests/unit/collapse.js
@@ -491,27 +491,85 @@ $(function () {
})
QUnit.test('should allow accordion to use children other than card', function (assert) {
- assert.expect(2)
+ assert.expect(4)
var done = assert.async()
- var accordionHTML = '<div id="accordion" data-children=".item">'
+ var accordionHTML = '<div id="accordion">'
+ '<div class="item">'
+ '<a id="linkTrigger" data-parent="#accordion" data-toggle="collapse" href="#collapseOne" aria-expanded="false" aria-controls="collapseOne"></a>'
+ '<div id="collapseOne" class="collapse" role="tabpanel" aria-labelledby="headingThree"></div>'
+ '</div>'
+ '<div class="item">'
- + '<a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"></a>'
+ + '<a id="linkTriggerTwo" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"></a>'
+ '<div id="collapseTwo" class="collapse show" role="tabpanel" aria-labelledby="headingTwo"></div>'
+ '</div>'
+ '</div>'
$(accordionHTML).appendTo('#qunit-fixture')
- var $target = $('#linkTrigger')
- $('#collapseOne').on('shown.bs.collapse', function () {
- assert.ok($(this).hasClass('show'))
- assert.ok(!$('#collapseTwo').hasClass('show'))
- done()
+ var $trigger = $('#linkTrigger')
+ var $triggerTwo = $('#linkTriggerTwo')
+ var $collapseOne = $('#collapseOne')
+ var $collapseTwo = $('#collapseTwo')
+ $collapseOne.on('shown.bs.collapse', function () {
+ assert.ok($collapseOne.hasClass('show'), '#collapseOne is shown')
+ assert.ok(!$collapseTwo.hasClass('show'), '#collapseTwo is not shown')
+ $collapseTwo.on('shown.bs.collapse', function () {
+ assert.ok(!$collapseOne.hasClass('show'), '#collapseOne is not shown')
+ assert.ok($collapseTwo.hasClass('show'), '#collapseTwo is shown')
+ done()
+ })
+ $triggerTwo.trigger($.Event('click'))
})
- $target.trigger($.Event('click'))
+ $trigger.trigger($.Event('click'))
+ })
+
+ QUnit.test('should collapse accordion children but not nested accordion children', function (assert) {
+ assert.expect(9)
+ var done = assert.async()
+ $('<div id="accordion">'
+ + '<div class="item">'
+ + '<a id="linkTrigger" data-parent="#accordion" data-toggle="collapse" href="#collapseOne" aria-expanded="false" aria-controls="collapseOne"></a>'
+ + '<div id="collapseOne" class="collapse" role="tabpanel" aria-labelledby="headingThree">'
+ + '<div id="nestedAccordion">'
+ + '<div class="item">'
+ + '<a id="nestedLinkTrigger" data-parent="#nestedAccordion" data-toggle="collapse" href="#nestedCollapseOne" aria-expanded="false" aria-controls="nestedCollapseOne"></a>'
+ + '<div id="nestedCollapseOne" class="collapse" role="tabpanel" aria-labelledby="headingThree">'
+ + '</div>'
+ + '</div>'
+ + '</div>'
+ + '</div>'
+ + '</div>'
+ + '<div class="item">'
+ + '<a id="linkTriggerTwo" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"></a>'
+ + '<div id="collapseTwo" class="collapse show" role="tabpanel" aria-labelledby="headingTwo"></div>'
+ + '</div>'
+ + '</div>').appendTo('#qunit-fixture')
+ var $trigger = $('#linkTrigger')
+ var $triggerTwo = $('#linkTriggerTwo')
+ var $nestedTrigger = $('#nestedLinkTrigger')
+ var $collapseOne = $('#collapseOne')
+ var $collapseTwo = $('#collapseTwo')
+ var $nestedCollapseOne = $('#nestedCollapseOne')
+
+
+ $collapseOne.one('shown.bs.collapse', function () {
+ assert.ok($collapseOne.hasClass('show'), '#collapseOne is shown')
+ assert.ok(!$collapseTwo.hasClass('show'), '#collapseTwo is not shown')
+ assert.ok(!$('#nestedCollapseOne').hasClass('show'), '#nestedCollapseOne is not shown')
+ $nestedCollapseOne.one('shown.bs.collapse', function () {
+ assert.ok($collapseOne.hasClass('show'), '#collapseOne is shown')
+ assert.ok(!$collapseTwo.hasClass('show'), '#collapseTwo is not shown')
+ assert.ok($nestedCollapseOne.hasClass('show'), '#nestedCollapseOne is shown')
+ $collapseTwo.one('shown.bs.collapse', function () {
+ assert.ok(!$collapseOne.hasClass('show'), '#collapseOne is not shown')
+ assert.ok($collapseTwo.hasClass('show'), '#collapseTwo is shown')
+ assert.ok($nestedCollapseOne.hasClass('show'), '#nestedCollapseOne is shown')
+ done()
+ })
+ $triggerTwo.trigger($.Event('click'))
+ })
+ $nestedTrigger.trigger($.Event('click'))
+ })
+ $trigger.trigger($.Event('click'))
})
QUnit.test('should not prevent event for input', function (assert) {