diff options
author | Johann-S <johann.servoire@gmail.com> | 2017-08-25 11:14:18 +0300 |
---|---|---|
committer | Johann-S <johann.servoire@gmail.com> | 2017-08-25 11:48:35 +0300 |
commit | 5a90b4aa3e102e387839a39fbf0ab1444eebbc76 (patch) | |
tree | 7211cb13d94aa3d94cfa610d8cc66226a0e67452 /js | |
parent | 4571ab0e57a5d2ff251b8c174ab0f693c5892dce (diff) |
Collapse - preventDefault only on <a> elements not inside the collapsible
element
Diffstat (limited to 'js')
-rw-r--r-- | js/src/collapse.js | 3 | ||||
-rw-r--r-- | js/tests/unit/collapse.js | 25 | ||||
-rw-r--r-- | js/tests/visual/collapse.html | 2 |
3 files changed, 28 insertions, 2 deletions
diff --git a/js/src/collapse.js b/js/src/collapse.js index 718630bd37..7d1ba4c54f 100644 --- a/js/src/collapse.js +++ b/js/src/collapse.js @@ -361,7 +361,8 @@ const Collapse = (($) => { */ $(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) { - if (!/input|textarea/i.test(event.target.tagName)) { + // preventDefault only for <a> elements (which change the URL) not inside the collapsible element + if (event.target.tagName === 'A' && !$.contains(this, event.target)) { event.preventDefault() } diff --git a/js/tests/unit/collapse.js b/js/tests/unit/collapse.js index 4470a18c27..9ecb60994f 100644 --- a/js/tests/unit/collapse.js +++ b/js/tests/unit/collapse.js @@ -673,4 +673,29 @@ $(function () { }) $trigger3.trigger('click') }) + + QUnit.test('should not prevent interactions inside the collapse element', function (assert) { + assert.expect(2) + var done = assert.async() + + var $target = $('<input type="checkbox" data-toggle="collapse" data-target="#collapsediv1" />').appendTo('#qunit-fixture') + var htmlCollapse = + '<div id="collapsediv1" class="collapse">' + + ' <input type="checkbox" id="testCheckbox" />' + + '</div>' + + $(htmlCollapse) + .appendTo('#qunit-fixture') + .on('shown.bs.collapse', function () { + assert.ok($target.prop('checked'), '$trigger is checked') + var $testCheckbox = $('#testCheckbox') + $testCheckbox.trigger($.Event('click')) + setTimeout(function () { + assert.ok($testCheckbox.prop('checked'), '$testCheckbox is checked too') + done() + }, 5) + }) + + $target.trigger($.Event('click')) + }) }) diff --git a/js/tests/visual/collapse.html b/js/tests/visual/collapse.html index 1d61ef19c9..6b4e89bfb3 100644 --- a/js/tests/visual/collapse.html +++ b/js/tests/visual/collapse.html @@ -57,7 +57,7 @@ </div> </div> - <script src="../../../docs/assets/js/vendor/jquery-slim.min.js"></script> + <script src="../../../assets/js/vendor/jquery-slim.min.js"></script> <script src="../../dist/util.js"></script> <script src="../../dist/collapse.js"></script> </body> |