diff options
Diffstat (limited to 'js')
| -rw-r--r-- | js/src/collapse.js | 6 | ||||
| -rw-r--r-- | js/tests/unit/collapse.js | 58 |
2 files changed, 53 insertions, 11 deletions
diff --git a/js/src/collapse.js b/js/src/collapse.js index f4d140f27..eaad1be54 100644 --- a/js/src/collapse.js +++ b/js/src/collapse.js @@ -130,7 +130,11 @@ const Collapse = (($) => { let activesData if (this._parent) { - actives = $.makeArray($(this._parent).children().children(Selector.ACTIVES)) + actives = $.makeArray( + $(this._parent) + .find(Selector.ACTIVES) + .filter(`[data-parent="${this._config.parent}"]`) + ) if (!actives.length) { actives = null } diff --git a/js/tests/unit/collapse.js b/js/tests/unit/collapse.js index f20c0809c..337ec647b 100644 --- a/js/tests/unit/collapse.js +++ b/js/tests/unit/collapse.js @@ -516,12 +516,50 @@ $(function () { var done = assert.async() 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>' + + '<a id="linkTrigger" data-toggle="collapse" href="#collapseOne" aria-expanded="false" aria-controls="collapseOne"></a>' + + '<div id="collapseOne" class="collapse" role="tabpanel" aria-labelledby="headingThree" data-parent="#accordion"></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>' + + '<a id="linkTriggerTwo" data-toggle="collapse" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"></a>' + + '<div id="collapseTwo" class="collapse show" role="tabpanel" aria-labelledby="headingTwo" data-parent="#accordion"></div>' + + '</div>' + + '</div>' + + $(accordionHTML).appendTo('#qunit-fixture') + 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')) + }) + $trigger.trigger($.Event('click')) + }) + + QUnit.test('should allow accordion to contain nested elements', function (assert) { + assert.expect(4) + var done = assert.async() + var accordionHTML = '<div id="accordion">' + + '<div class="row">' + + '<div class="col-lg-6">' + + '<div class="item">' + + '<a id="linkTrigger" data-toggle="collapse" href="#collapseOne" aria-expanded="false" aria-controls="collapseOne"></a>' + + '<div id="collapseOne" class="collapse" role="tabpanel" aria-labelledby="headingThree" data-parent="#accordion"></div>' + + '</div>' + + '</div>' + + '<div class="col-lg-6">' + + '<div class="item">' + + '<a id="linkTriggerTwo" data-toggle="collapse" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"></a>' + + '<div id="collapseTwo" class="collapse show" role="tabpanel" aria-labelledby="headingTwo" data-parent="#accordion"></div>' + + '</div>' + + '</div>' + '</div>' + '</div>' @@ -548,20 +586,20 @@ $(function () { 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">' + + '<a id="linkTrigger" data-toggle="collapse" href="#collapseOne" aria-expanded="false" aria-controls="collapseOne"></a>' + + '<div id="collapseOne" data-parent="#accordion" 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">' + + '<a id="nestedLinkTrigger" data-toggle="collapse" href="#nestedCollapseOne" aria-expanded="false" aria-controls="nestedCollapseOne"></a>' + + '<div id="nestedCollapseOne" data-parent="#nestedAccordion" 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>' + + '<a id="linkTriggerTwo" data-toggle="collapse" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"></a>' + + '<div id="collapseTwo" data-parent="#accordion" class="collapse show" role="tabpanel" aria-labelledby="headingTwo"></div>' + '</div>' + '</div>').appendTo('#qunit-fixture') var $trigger = $('#linkTrigger') |