Fix Menu keyboard navigation inside nested submenus (#42804) * Fix Menu keyboard navigation inside nested submenus Arrow keys collected only the direct `.menu-item` children of `.menu`, so they skipped every submenu trigger, which sits at `.menu > .submenu > .menu-item`. A menu built entirely from submenus had no reachable items. Keys pressed inside an open submenu panel did nothing at all. The keydown handler is delegated on both the toggle and `.menu`, and delegation stops at the innermost match, so the handler ran on the nested `.menu`. From there the toggle is not a sibling, and the last-resort lookup only searched the `.submenu` wrapper. The handler bailed out before any branch, which killed the arrows, Home, End and Escape. Escape left the user unable to dismiss the menu by keyboard. The same lookup also picked the first toggle in the document when a menu used `container`, so an arrow key could open an unrelated menu. Resolve the owning menu from the open instances first, and treat submenu triggers as items of their parent level. Moving focus along a level now closes the submenus focus left behind, which matches hover and click. Two specs claimed to cover the submenu ArrowLeft and Escape paths but called the methods directly instead of dispatching keys, and a third asserted nothing. That is why the regression stayed hidden. All three now dispatch real events, and new specs cover the arrows, Home, End, ArrowLeft and Escape inside open submenus, a third level, and the `container` case. Co-authored-by: Aljo Joby <141745680+aljojoby9@users.noreply.github.com> * Merge the duplicate submenu open branches in Menu Enter, Space and the RTL-aware enter arrow each opened a submenu through their own copy of the same sixteen lines. Only the key test differed, so one guard covers all three. * Mark Menu submenu triggers as popups on init A submenu trigger only got `aria-haspopup` when its submenu first opened, and it never got a starting `aria-expanded`. Assistive technology therefore gave no hint that a submenu existed until the user had already opened it. Set both attributes on every `.submenu > .menu-item` that wraps a nested `.menu`, at any depth, when the instance is created. A closed menu is `display: none`, so the triggers enter the accessibility tree only after the toggle builds the instance, which keeps the lazy data API correct. An author supplied `aria-expanded` is left alone, for a submenu that must start open. * Raise the minified JS budgets by a quarter kilobyte The keyboard and aria work adds about 190 bytes to each minified bundle, which left both budgets with roughly a hundred bytes of room. The next small addition to any component would have failed CI for no reason of its own. Raise both by one step so the ceiling moves on purpose rather than during an unrelated review. --------- Co-authored-by: Aljo Joby <141745680+aljojoby9@users.noreply.github.com>
Our default branch is for development of our Bootstrap 6 release. Head to the v5-dev branch to view the readme, documentation, and source code for Bootstrap 5.
Several quick start options are available:
git clone https://github.com/twbs/bootstrap.gitnpm install bootstrap@6.0.0-alpha1yarn add bootstrap@6.0.0-alpha1bun add bootstrap@6.0.0-alpha1composer require twbs/bootstrap:6.0.0-alpha1Install-Package bootstrap Sass: Install-Package bootstrap.sassRead the Getting started page for information on the framework contents, templates, examples, and more.
Within the download you’ll find the following directories and files, logically grouping common assets and providing both compiled and minified variations.
bootstrap/ ├── css/ │ ├── bootstrap-grid.css │ ├── bootstrap-grid.css.map │ ├── bootstrap-grid.min.css │ ├── bootstrap-grid.min.css.map │ ├── bootstrap-reboot.css │ ├── bootstrap-reboot.css.map │ ├── bootstrap-reboot.min.css │ ├── bootstrap-reboot.min.css.map │ ├── bootstrap-utilities.css │ ├── bootstrap-utilities.css.map │ ├── bootstrap-utilities.min.css │ ├── bootstrap-utilities.min.css.map │ ├── bootstrap.css │ ├── bootstrap.css.map │ ├── bootstrap.min.css │ └── bootstrap.min.css.map └── js/ ├── bootstrap.bundle.js ├── bootstrap.bundle.js.map ├── bootstrap.bundle.min.js ├── bootstrap.bundle.min.js.map ├── bootstrap.js ├── bootstrap.js.map ├── bootstrap.min.js └── bootstrap.min.js.map
We provide compiled CSS and JS (bootstrap.*), as well as compiled and minified CSS and JS (bootstrap.min.*). Source maps (bootstrap.*.map) are available for use with certain browsers' developer tools. Bundled JS files (bootstrap.bundle.js and minified bootstrap.bundle.min.js) include Floating UI and Vanilla Calendar Pro. All CSS files work for both LTR and RTL layouts thanks to logical properties—simply set dir="rtl" on your HTML element.
Have a bug or a feature request? Please first read the issue guidelines and search for existing and closed issues. If your problem or idea is not addressed yet, please open a new issue.
Bootstrap’s documentation, included in this repo in the root directory, is built with Astro and publicly hosted on GitHub Pages at https://getbootstrap.com/. The docs may also be run locally.
Documentation search is powered by Pagefind.
npm install to install the Node.js dependencies, including Astro (the site builder).npm run test (or a specific npm script) to rebuild distributed CSS and JavaScript files, as well as our docs assets./bootstrap directory, run npm run docs-serve in the command line.Learn more about using Astro by reading its documentation.
You can find all our previous releases docs on https://getbootstrap.com/docs/versions/.
Previous releases and their documentation are also available for download.
Please read through our contributing guidelines. Included are directions for opening issues, coding standards, and notes on development.
Moreover, if your pull request contains JavaScript patches or features, you must include relevant unit tests. All HTML and CSS should conform to the Code Guide, maintained by Mark Otto.
Editor preferences are available in the editor config for easy use in common text editors. Read more and download plugins at https://editorconfig.org/.
Get updates on Bootstrap’s development and chat with the project maintainers and community members.
irc.libera.chat server, in the #bootstrap channel.bootstrap-5).bootstrap on packages which modify or add to the functionality of Bootstrap when distributing through npm or similar delivery mechanisms for maximum discoverability.For transparency into our release cycle and in striving to maintain backward compatibility, Bootstrap is maintained under the Semantic Versioning guidelines. Sometimes we screw up, but we adhere to those rules whenever possible.
See the Releases section of our GitHub project for changelogs for each release version of Bootstrap. Release announcement posts on the official Bootstrap blog contain summaries of the most noteworthy changes made in each release.
Thanks to Netlify for providing us with Deploy Previews!
Support this project by becoming a sponsor. Your logo will show up here with a link to your website. [Become a sponsor]
Thank you to all our backers! 🙏 [Become a backer]
Code and documentation copyright 2011-2026 the Bootstrap Authors. Code released under the MIT License. Docs released under Creative Commons.