diff options
| -rw-r--r-- | js/src/tab.js | 12 | ||||
| -rw-r--r-- | js/tests/unit/tab.js | 15 |
2 files changed, 18 insertions, 9 deletions
diff --git a/js/src/tab.js b/js/src/tab.js index 5e5a83118d..4c30914951 100644 --- a/js/src/tab.js +++ b/js/src/tab.js @@ -45,6 +45,7 @@ const Tab = (($) => { DROPDOWN : '.dropdown', NAV_LIST_GROUP : '.nav, .list-group', ACTIVE : '.active', + ACTIVE_UL : '> li > .active', DATA_TOGGLE : '[data-toggle="tab"], [data-toggle="pill"], [data-toggle="list"]', DROPDOWN_TOGGLE : '.dropdown-toggle', DROPDOWN_ACTIVE_CHILD : '> .dropdown-menu .active' @@ -87,7 +88,8 @@ const Tab = (($) => { const selector = Util.getSelectorFromElement(this._element) if (listElement) { - previous = $.makeArray($(listElement).find(Selector.ACTIVE)) + const itemSelector = listElement.nodeName === 'UL' ? Selector.ACTIVE_UL : Selector.ACTIVE + previous = $.makeArray($(listElement).find(itemSelector)) previous = previous[previous.length - 1] } @@ -148,7 +150,13 @@ const Tab = (($) => { // private _activate(element, container, callback) { - const activeElements = callback ? $(container).children(Selector.ACTIVE) : $(container).find(Selector.ACTIVE) + let activeElements + if (container.nodeName === 'UL') { + activeElements = $(container).find(Selector.ACTIVE_UL) + } else { + activeElements = $(container).children(Selector.ACTIVE) + } + const active = activeElements[0] const isTransitioning = callback && Util.supportsTransitionEnd() diff --git a/js/tests/unit/tab.js b/js/tests/unit/tab.js index 3a7c1bb785..6f52e4042f 100644 --- a/js/tests/unit/tab.js +++ b/js/tests/unit/tab.js @@ -182,13 +182,14 @@ $(function () { assert.expect(2) var done = assert.async() - var dropHTML = '<ul class="drop nav">' - + '<li class="dropdown"><a data-toggle="dropdown" href="#">1</a>' - + '<ul class="dropdown-menu">' - + '<li><a href="#1-1" data-toggle="tab">1-1</a></li>' - + '<li><a href="#1-2" data-toggle="tab">1-2</a></li>' - + '</ul>' - + '</li>' + var dropHTML = + '<ul class="drop nav">' + + ' <li class="dropdown"><a data-toggle="dropdown" href="#">1</a>' + + ' <ul class="dropdown-menu nav">' + + ' <li><a href="#1-1" data-toggle="tab">1-1</a></li>' + + ' <li><a href="#1-2" data-toggle="tab">1-2</a></li>' + + ' </ul>' + + ' </li>' + '</ul>' $(dropHTML) |