rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2024-11-29 11:24:18 +01:00
Code Issues Actions Packages Releases Activity

Add unit test for nested tabs

Browse Source
This commit is contained in:
Johann-S 2017-07-17 10:05:45 +02:00 committed by XhmikosR
parent 640c13062c
commit edf90c1bc4
1 changed files with 38 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
js/tests/unit/tab.js
View File

@ -343,4 +343,42 @@ $(function () {
assert.notOk($tabs.find('li:last > a').hasClass('active')) assert.notOk($tabs.find('li:last > a').hasClass('active'))
assert.notOk($tabs.find('li:last > .dropdown-menu > a:first').hasClass('active')) assert.notOk($tabs.find('li:last > .dropdown-menu > a:first').hasClass('active'))
}) })
QUnit.test('Nested tabs', function (assert) {
assert.expect(2)
var done = assert.async()
var tabsHTML =
'<nav class="nav nav-tabs" role="tablist">'
+ ' <a id="tab1" href="#x-tab1" class="nav-item nav-link" data-toggle="tab" role="tab" aria-controls="x-tab1">Tab 1</a>'
+ ' <a href="#x-tab2" class="nav-item nav-link active" data-toggle="tab" role="tab" aria-controls="x-tab2" aria-expanded="true">Tab 2</a>'
+ ' <a href="#x-tab3" class="nav-item nav-link" data-toggle="tab" role="tab" aria-controls="x-tab3">Tab 3</a>'
+ '</nav>'
+ '<div class="tab-content">'
+ ' <div class="tab-pane" id="x-tab1" role="tabpanel">'
+ ' <nav class="nav nav-tabs" role="tablist">'
+ ' <a href="#nested-tab1" class="nav-item nav-link active" data-toggle="tab" role="tab" aria-controls="x-tab1" aria-expanded="true">Nested Tab 1</a>'
+ ' <a id="tabNested2" href="#nested-tab2" class="nav-item nav-link" data-toggle="tab" role="tab" aria-controls="x-profile">Nested Tab2</a>'
+ ' </nav>'
+ ' <div class="tab-content">'
+ ' <div class="tab-pane active" id="nested-tab1" role="tabpanel">Nested Tab1 Content</div>'
+ ' <div class="tab-pane" id="nested-tab2" role="tabpanel">Nested Tab2 Content</div>'
+ ' </div>'
+ ' </div>'
+ ' <div class="tab-pane active" id="x-tab2" role="tabpanel">Tab2 Content</div>'
+ ' <div class="tab-pane" id="x-tab3" role="tabpanel">Tab3 Content</div>'
+ '</div>'
$(tabsHTML).appendTo('#qunit-fixture')
$('#tabNested2').on('shown.bs.tab', function () {
assert.ok($('#x-tab1').hasClass('active'))
done()
})
$('#tab1').on('shown.bs.tab', function () {
assert.ok($('#x-tab1').hasClass('active'))
$('#tabNested2').trigger($.Event('click'))
})
.trigger($.Event('click'))
})
}) })