html - Do I need role="button" on a <button>?

Question

I've noticed in all of Bootstrap's examples using button elements, they include role="button" (and type="button"), such as:

<div class="dropdown">
    <button id="dLabel" type="button" role="button" data-toggle="dropdown" 
     aria-haspopup="true" aria-expanded="false">
        Dropdown trigger <span class="caret"></span>
    </button>
    <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
    ...
    </ul>
</div>

Won't accessibility software already know that a button element is meant to act as a button? Is there any reason I should include role="button" and/or type="button" in my code?

Answer 1

Many HTML5 elements come with default implicit ARIA semantics, and explicitly setting these default values is "unnecessary and not recommended".

Looking at the button element, you can see that it has the button role by default.

So, setting role="button" is "not recommended", but allowed. It might help older user agents that support WAI-ARIA but not HTML5.