DocumentationRulesno-missing-button-type

no-missing-button-type

Full Name in eslint-plugin-react-dom

react-dom/no-missing-button-type

Full Name in @eslint-react/eslint-plugin

@eslint-react/dom/no-missing-button-type

Features

🔍

Presets

  • dom
  • recommended
  • recommended-typescript
  • recommended-type-checked

What it does

Enforces explicit type attribute for <button> elements.

Why is this bad?

The type attribute of the button element needs to be specified. The default value is type="submit", which can easily lead to unexpected behavior, especially when used in a form.

Examples

Failing

import React from "react";
 
function Example() {
  return <button>Click me</button>;
  //     ^^^^^^^^^^^^^^^^^^^^^^^^^
  //     - Missing 'type' attribute on button component.
}

Passing

import React from "react";
 
function Example() {
  return <button type="button">Click me</button>;
}

Further Reading