Testing an aria-disabled button

Why aria-disabled instead of disabled? The native disabled attribute removes a button from the tab order, and if the button has keyboard focus at the moment it becomes disabled, focus is forced away, typically to the document body, leaving a keyboard user without a clear sense of where they are until focus is later redirected elsewhere. aria-disabled="true" keeps the button focusable and in place throughout, so a keyboard or screen reader user never loses their position. The trade-off: aria-disabled does not stop the button from being activated. Unlike disabled, which blocks form submission automatically, aria-disabled requires the developer to manually check its state and block the action in JavaScript, which this example does.