useButtonType (since v0.10.0)
This rule is recommended by Rome.
Enforces the usage of the attribute type
for the element button
Examples
Invalid
<button>Do something</button>
a11y/useButtonType.js:1:1 lint/a11y/useButtonType ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
✖ Provide an explicit type prop for the button element.
> 1 │ <button>Do something</button>
│ ^^^^^^^^
2 │
ℹ The default type of a button is submit, which causes the submission of a form when placed inside a `form` element. This is likely not the behaviour that you want inside a React application.
ℹ Allowed button types are: submit, button or reset
<button type="incorrectType">Do something</button>
a11y/useButtonType.js:1:14 lint/a11y/useButtonType ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
✖ Provide a valid type prop for the button element.
> 1 │ <button type="incorrectType">Do something</button>
│ ^^^^^^^^^^^^^^^
2 │
ℹ The default type of a button is submit, which causes the submission of a form when placed inside a `form` element. This is likely not the behaviour that you want inside a React application.
ℹ Allowed button types are: submit, button or reset
React.createElement('button');
a11y/useButtonType.js:1:21 lint/a11y/useButtonType ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
✖ Provide an explicit type prop for the button element.
> 1 │ React.createElement('button');
│ ^^^^^^^^
2 │
ℹ The default type of a button is submit, which causes the submission of a form when placed inside a `form` element. This is likely not the behaviour that you want inside a React application.
ℹ Allowed button types are: submit, button or reset
Valid
<>
<button type="button">Do something</button>
<button type={buttonType}>Do something</button>
</>