a11y: make the sidebar button a <button>

[hugovk]

Purpose

The sidebar button should be a semantic <button> and not a <div>.

This is needed for accessibility via keyboard and assistive technology.

For example, try this before and after this fix:

cd tests/roots/test-tocdepth
rm -rf _build
python -m sphinx -b html -D html_theme=classic -D html_theme_options.collapsiblesidebar=true . _build/html
open _build/html/index.html

Then press tab repeatedly.

Before, the <div> "button" can not be selected: _build-master.zip

After, the real <button> can be selected, and you can press space to open and close the side menu: _build-fixed.zip

References

• https://theadminbar.com/accessibility-weekly/divs-are-not-buttons/
• The element div#sidebar requires the attribute role="button" python/python-docs-theme#248

[hugovk]

The ty and 3.15 failures are unrelated and also occur in main master.

[gastmaier]

Welcome change, useful for both keyboard savvys and people with disabilities :)

[timhoffm]

This is fundamentally reasonable. However, it is a breaking change for downstream templates.

This will beak users who have styled the button with a div#sidebarbutton CSS filter, e.g. https://github.com/search?q=div%23sidebarbutton+language%3ACSS+NOT+is%3Afork&type=code

This needs a prominent change note and advice to change the style filter to #sidebarbutton.

[hugovk]

Added!

I put 9.2.0 as the version, but I don't mind if this needs a major bump. Some other semantic improvements have been done as bug fixes: #13689.

[themavik]

nit: add type="button" on #sidebarbutton so it does not default to submit if this block ever sits inside a <form>.