]> git.ipfire.org Git - thirdparty/bootstrap.git/commitdiff
Fix skip element disabled via attribute when using keyboard navigation
authorvsn4ik <vsn4ik@gmail.com>
Mon, 22 Jan 2018 23:03:00 +0000 (02:03 +0300)
committerJohann-S <johann.servoire@gmail.com>
Mon, 26 Mar 2018 07:37:25 +0000 (09:37 +0200)
js/src/dropdown.js
js/tests/unit/dropdown.js

index 2f69298540b304d8be433738bc7931f1e985bff3..64d6b371766e16dcd2d4a0869cd6a57f85bdd155 100644 (file)
@@ -57,7 +57,7 @@ const Dropdown = (($) => {
     FORM_CHILD    : '.dropdown form',
     MENU          : '.dropdown-menu',
     NAVBAR_NAV    : '.navbar-nav',
-    VISIBLE_ITEMS : '.dropdown-menu .dropdown-item:not(.disabled)'
+    VISIBLE_ITEMS : '.dropdown-menu .dropdown-item:not(.disabled):not(:disabled)'
   }
 
   const AttachmentMap = {
index 3040e81b41aaebcb250412fb5fa4c79e3f5c2dc8..0e3d3704137d7bd559caf55dcca6de9a46debd07 100644 (file)
@@ -544,15 +544,15 @@ $(function () {
     $dropdown.trigger('click')
   })
 
-  QUnit.test('should skip disabled element when using keyboard navigation', function (assert) {
-    assert.expect(2)
+  QUnit.test('should focus next/previous element when using keyboard navigation', function (assert) {
+    assert.expect(4)
     var done = assert.async()
     var dropdownHTML = '<div class="tabs">' +
         '<div class="dropdown">' +
         '<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>' +
         '<div class="dropdown-menu">' +
-        '<a class="dropdown-item disabled" href="#">Disabled link</a>' +
-        '<a class="dropdown-item" href="#">Another link</a>' +
+        '<a id="item1" class="dropdown-item" href="#">A link</a>' +
+        '<a id="item2" class="dropdown-item" href="#">Another link</a>' +
         '</div>' +
         '</div>' +
         '</div>'
@@ -568,24 +568,32 @@ $(function () {
         $dropdown.trigger($.Event('keydown', {
           which: 40
         }))
-        $dropdown.trigger($.Event('keydown', {
+        assert.ok($(document.activeElement).is($('#item1')), 'item1 is focused')
+
+        $(document.activeElement).trigger($.Event('keydown', {
           which: 40
         }))
-        assert.ok(!$(document.activeElement).is('.disabled'), '.disabled is not focused')
+        assert.ok($(document.activeElement).is($('#item2')), 'item2 is focused')
+
+        $(document.activeElement).trigger($.Event('keydown', {
+          which: 38
+        }))
+        assert.ok($(document.activeElement).is($('#item1')), 'item1 is focused')
         done()
       })
     $dropdown.trigger('click')
   })
 
-  QUnit.test('should focus next/previous element when using keyboard navigation', function (assert) {
-    assert.expect(4)
+  QUnit.test('should skip disabled element when using keyboard navigation', function (assert) {
+    assert.expect(3)
     var done = assert.async()
     var dropdownHTML = '<div class="tabs">' +
         '<div class="dropdown">' +
         '<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>' +
         '<div class="dropdown-menu">' +
-        '<a id="item1" class="dropdown-item" href="#">A link</a>' +
-        '<a id="item2" class="dropdown-item" href="#">Another link</a>' +
+        '<a class="dropdown-item disabled" href="#">Disabled link</a>' +
+        '<button class="dropdown-item" type="button" disabled>Disabled button</button>' +
+        '<a id="item1" class="dropdown-item" href="#">Another link</a>' +
         '</div>' +
         '</div>' +
         '</div>'
@@ -601,17 +609,11 @@ $(function () {
         $dropdown.trigger($.Event('keydown', {
           which: 40
         }))
-        assert.ok($(document.activeElement).is($('#item1')), 'item1 is focused')
-
-        $(document.activeElement).trigger($.Event('keydown', {
+        assert.ok($(document.activeElement).is($('#item1')), '#item1 is focused')
+        $dropdown.trigger($.Event('keydown', {
           which: 40
         }))
-        assert.ok($(document.activeElement).is($('#item2')), 'item2 is focused')
-
-        $(document.activeElement).trigger($.Event('keydown', {
-          which: 38
-        }))
-        assert.ok($(document.activeElement).is($('#item1')), 'item1 is focused')
+        assert.ok($(document.activeElement).is($('#item1')), '#item1 is still focused')
         done()
       })
     $dropdown.trigger('click')