Bootstrap Quality Control & Assurance 3 — Questions and Answers
Question 1: Which Bootstrap JavaScript method programmatically disposes of a modal instance and removes its event listeners?
- Modal.getInstance().remove()
- Modal.getInstance().dispose() (Correct answer)
- Modal.getInstance().destroy()
- Modal.getInstance().close()
Correct answer: Modal.getInstance().dispose()
The dispose() method tears down a Bootstrap component instance and cleans up event listeners to prevent memory leaks.
Question 2: A QA engineer tests that a Bootstrap tooltip is destroyed after navigating away. Which static method retrieves an existing tooltip instance for inspection?
- Tooltip.get(element)
- Tooltip.find(element)
- Tooltip.getInstance(element) (Correct answer)
- Tooltip.fetch(element)
Correct answer: Tooltip.getInstance(element)
Tooltip.getInstance(element) returns the existing Tooltip instance attached to a DOM element, or null if none exists.
Question 3: During automated testing, an assertion checks whether a Bootstrap collapse is currently expanded. Which aria attribute reflects this state?
- aria-expanded (Correct answer)
- aria-open
- aria-visible
- aria-toggled
Correct answer: aria-expanded
Bootstrap sets aria-expanded='true' on the trigger element when the collapse is open and 'false' when closed.
Question 4: A test script fires a click on a Bootstrap dropdown toggle but the menu does not open. The most likely QA finding is that:
- Dropdowns require a double-click to open
- Bootstrap's JavaScript bundle is not loaded or initialized (Correct answer)
- The dropdown requires a data-bs-offset attribute
- data-bs-toggle='dropdown' must be replaced with role='button'
Correct answer: Bootstrap's JavaScript bundle is not loaded or initialized
Bootstrap dropdowns rely on JavaScript to handle toggle behavior; without the JS bundle the data attributes have no effect.
Question 5: Which Bootstrap event fires immediately when a modal begins to hide, before any transition completes?
- hide.bs.modal (Correct answer)
- hidden.bs.modal
- close.bs.modal
- beforehide.bs.modal
Correct answer: hide.bs.modal
hide.bs.modal fires at the start of the hide transition, while hidden.bs.modal fires after the transition finishes.
Question 6: A QA test verifies accessible tab navigation in a Bootstrap navbar. Which attribute should move keyboard focus through nav items correctly?
- tabindex='0' on each .nav-link (Correct answer)
- role='menuitem' on each .nav-link
- data-bs-keyboard='true' on the navbar
- aria-keyshortcuts on the nav
Correct answer: tabindex='0' on each .nav-link
Setting tabindex='0' ensures each nav link is reachable via sequential keyboard Tab navigation.
Question 7: When testing Bootstrap's offcanvas component, which class confirms the panel is currently visible to the user?
- .offcanvas-visible
- .show (Correct answer)
- .offcanvas-open
- .active
Correct answer: .show
Bootstrap adds the .show class to the .offcanvas element when it is fully open and visible.
Which Bootstrap JavaScript method programmatically disposes of a modal instance and removes its event listeners?