From: Emmanuel Bourgerie <emmanuel.bourgerie@teamaol.com>
Date: Mon, 16 Mar 2015 13:33:42 +0000 (+0000)
Subject: Fix #16072: Clicking into input field within dropdown no longer closes the dropdown
X-Git-Tag: v3.3.5~196
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=fa9d28b634dbcf057778cd755bc52aedebffbe22;p=thirdparty%2Fbootstrap.git

Fix #16072: Clicking into input field within dropdown no longer closes the dropdown

Closes #16073 by merging it
---

diff --git a/js/dropdown.js b/js/dropdown.js
index 5e6cefe843..1fbf74a317 100644
--- a/js/dropdown.js
+++ b/js/dropdown.js
@@ -99,6 +99,8 @@
 
       if (!$parent.hasClass('open')) return
 
+      if (e && e.type == 'click' && /input|textarea/i.test(e.target.tagName) && $.contains($parent[0], e.target)) return
+
       $parent.trigger(e = $.Event('hide.bs.dropdown', relatedTarget))
 
       if (e.isDefaultPrevented()) return
diff --git a/js/tests/unit/dropdown.js b/js/tests/unit/dropdown.js
index 40c428682f..e0d1df9700 100644
--- a/js/tests/unit/dropdown.js
+++ b/js/tests/unit/dropdown.js
@@ -350,4 +350,42 @@ $(function () {
 
     assert.ok(!$(document.activeElement).parent().is('.disabled'), '.disabled is not focused')
   })
+
+  QUnit.test('should not close the dropdown if the user clicks on a text field', function (assert) {
+    assert.expect(1)
+    var dropdownHTML = '<div class="btn-group">'
+        + '<button type="button" data-toggle="dropdown">Dropdown</button>'
+        + '<ul class="dropdown-menu" role="menu">'
+        + '<li><input id="textField" type="text" /></li>'
+        + '</ul>'
+        + '</div>'
+    var $dropdown = $(dropdownHTML)
+      .appendTo('#qunit-fixture')
+      .find('[data-toggle="dropdown"]')
+      .bootstrapDropdown()
+      .trigger('click')
+
+    $('#textField').trigger('click')
+
+    assert.ok($dropdown.parent('.btn-group').hasClass('open'), 'dropdown menu is open')
+  })
+
+  QUnit.test('should not close the dropdown if the user clicks on a textarea', function (assert) {
+    assert.expect(1)
+    var dropdownHTML = '<div class="btn-group">'
+        + '<button type="button" data-toggle="dropdown">Dropdown</button>'
+        + '<ul class="dropdown-menu" role="menu">'
+        + '<li><textarea id="textArea"></textarea></li>'
+        + '</ul>'
+        + '</div>'
+    var $dropdown = $(dropdownHTML)
+      .appendTo('#qunit-fixture')
+      .find('[data-toggle="dropdown"]')
+      .bootstrapDropdown()
+      .trigger('click')
+
+    $('#textArea').trigger('click')
+
+    assert.ok($dropdown.parent('.btn-group').hasClass('open'), 'dropdown menu is open')
+  })
 })