From 25b762440cffef8f6938e9218e6cfe03a7e15363 Mon Sep 17 00:00:00 2001
From: Carson <cpsievert1@gmail.com>
Date: Thu, 15 Apr 2021 10:21:14 -0500
Subject: [PATCH 1/2] Backport #33634: support .dropdown-item wrapped in li
 tags

---
 js/src/tab.js        |  7 ++++++-
 js/tests/unit/tab.js | 22 ++++++++++++++++++++++
 2 files changed, 28 insertions(+), 1 deletion(-)

diff --git a/js/src/tab.js b/js/src/tab.js
index e9a6f555fe61..bcbb5c5ea258 100644
--- a/js/src/tab.js
+++ b/js/src/tab.js
@@ -187,7 +187,12 @@ class Tab {
       element.classList.add(CLASS_NAME_SHOW)
     }
 
-    if (element.parentNode && $(element.parentNode).hasClass(CLASS_NAME_DROPDOWN_MENU)) {
+    let parent = element.parentNode
+    if (parent && parent.nodeName === 'LI') {
+      parent = parent.parentNode
+    }
+
+    if (parent && $(parent).hasClass(CLASS_NAME_DROPDOWN_MENU)) {
       const dropdownElement = $(element).closest(SELECTOR_DROPDOWN)[0]
 
       if (dropdownElement) {
diff --git a/js/tests/unit/tab.js b/js/tests/unit/tab.js
index a0c4ddf15547..3b6d7fa46c02 100644
--- a/js/tests/unit/tab.js
+++ b/js/tests/unit/tab.js
@@ -345,6 +345,28 @@ $(function () {
     assert.notOk($tabs.find('li:last-child .dropdown-menu a:first-child').hasClass('active'))
   })
 
+  QUnit.test('should support li > .dropdown-item', function (assert) {
+    assert.expect(2)
+    var tabsHTML = [
+      '<ul class="nav nav-tabs">',
+      '  <li class="nav-item"><a class="nav-link active" href="#home" data-toggle="tab">Home</a></li>',
+      '  <li class="nav-item"><a class="nav-link" href="#profile" data-toggle="tab">Profile</a></li>',
+      '  <li class="nav-item dropdown">',
+      '    <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#">Dropdown</a>',
+      '    <ul class="dropdown-menu">',
+      '      <li><a class="dropdown-item" href="#dropdown1" id="dropdown1-tab" data-toggle="tab">@fat</a></li>',
+      '      <li><a class="dropdown-item" href="#dropdown2" id="dropdown2-tab" data-toggle="tab">@mdo</a></li>',
+      '    </ul>',
+      '  </li>',
+      '</ul>'
+    ].join('')
+    var $tabs = $(tabsHTML).appendTo('#qunit-fixture')
+
+    $tabs.find('.dropdown-item').trigger('click')
+    assert.ok($tabs.find('.dropdown-item').hasClass('active'))
+    assert.notOk($tabs.find('.nav-link').hasClass('active'))
+  })
+
   QUnit.test('Nested tabs', function (assert) {
     assert.expect(2)
     var done = assert.async()

From 450bb76f388f4fa83216693e8c88a59d833ea6af Mon Sep 17 00:00:00 2001
From: Carson <cpsievert1@gmail.com>
Date: Mon, 19 Apr 2021 09:57:13 -0500
Subject: [PATCH 2/2] Fix unit test

---
 js/tests/unit/tab.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/js/tests/unit/tab.js b/js/tests/unit/tab.js
index 3b6d7fa46c02..9c9b286f04b9 100644
--- a/js/tests/unit/tab.js
+++ b/js/tests/unit/tab.js
@@ -364,7 +364,7 @@ $(function () {
 
     $tabs.find('.dropdown-item').trigger('click')
     assert.ok($tabs.find('.dropdown-item').hasClass('active'))
-    assert.notOk($tabs.find('.nav-link').hasClass('active'))
+    assert.notOk($tabs.find('.nav-link:not(.dropdown-toggle)').hasClass('active'))
   })
 
   QUnit.test('Nested tabs', function (assert) {