diff options
author | Patrick H. Lauke <redux@splintered.co.uk> | 2021-03-17 11:52:40 +0300 |
---|---|---|
committer | GitHub <noreply@github.com> | 2021-03-17 11:52:40 +0300 |
commit | 3ce0a8d3ecc05ac43fa5f5da0c5fc1aaea7742d5 (patch) | |
tree | 401b22206ceef2f6701dc336edae13dd71726d82 /js/tests/unit/tab.spec.js | |
parent | b9f30903a5a916904c873bd078240b3df743e093 (diff) |
Dynamic tab should not show when triggered on `disabled` element (#33257)
* show() should bail if the trigger has `disabled` attribute
* use 'isDisabled' helper
Co-authored-by: GeoSot <geo.sotis@gmail.com>
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
Diffstat (limited to 'js/tests/unit/tab.spec.js')
-rw-r--r-- | js/tests/unit/tab.spec.js | 34 |
1 files changed, 30 insertions, 4 deletions
diff --git a/js/tests/unit/tab.spec.js b/js/tests/unit/tab.spec.js index 35d17e16b9..231cf894c0 100644 --- a/js/tests/unit/tab.spec.js +++ b/js/tests/unit/tab.spec.js @@ -198,11 +198,37 @@ describe('Tab', () => { }, 30) }) - it('should not fire shown when tab is disabled', done => { + it('should not fire shown when tab has disabled attribute', done => { fixtureEl.innerHTML = [ '<ul class="nav nav-tabs" role="tablist">', - ' <li class="nav-item" role="presentation"><button type="button" data-bs-target="#home" class="nav-link active" role="tab" aria-selected="true">Home</button></li>', - ' <li class="nav-item" role="presentation"><button type="button" data-bs-target="#profile" class="nav-link disabled" role="tab">Profile</button></li>', + ' <li class="nav-item" role="presentation"><button type="button" data-bs-target="#home" class="nav-link active" role="tab" aria-selected="true">Home</button></li>', + ' <li class="nav-item" role="presentation"><button type="button" data-bs-target="#profile" class="nav-link" disabled role="tab">Profile</button></li>', + '</ul>', + '<div class="tab-content">', + ' <div class="tab-pane active" id="home" role="tabpanel"></div>', + ' <div class="tab-pane" id="profile" role="tabpanel"></div>', + '</div>' + ].join('') + + const triggerDisabled = fixtureEl.querySelector('button[disabled]') + const tab = new Tab(triggerDisabled) + + triggerDisabled.addEventListener('shown.bs.tab', () => { + throw new Error('should not trigger shown event') + }) + + tab.show() + setTimeout(() => { + expect().nothing() + done() + }, 30) + }) + + it('should not fire shown when tab has disabled class', done => { + fixtureEl.innerHTML = [ + '<ul class="nav nav-tabs" role="tablist">', + ' <li class="nav-item" role="presentation"><a href="#home" class="nav-link active" role="tab" aria-selected="true">Home</a></li>', + ' <li class="nav-item" role="presentation"><a href="#profile" class="nav-link disabled" role="tab">Profile</a></li>', '</ul>', '<div class="tab-content">', ' <div class="tab-pane active" id="home" role="tabpanel"></div>', @@ -210,7 +236,7 @@ describe('Tab', () => { '</div>' ].join('') - const triggerDisabled = fixtureEl.querySelector('button.disabled') + const triggerDisabled = fixtureEl.querySelector('a.disabled') const tab = new Tab(triggerDisabled) triggerDisabled.addEventListener('shown.bs.tab', () => { |