Warning Botón dentro de un formulario sin atributo type

Por qué un <button> sin atributo type usa por defecto type="submit" dentro de un formulario, y los envíos accidentales que eso causa.

El validador advierte sobre cualquier <button> dentro de un <form> que no tenga un atributo type explícito.

Ejemplo

<!-- Marcado: este botón envía el formulario, quizás sin querer -->
<form>
  <input type="text" name="q">
  <button>Limpiar</button>
</form>

<!-- Correcto: ser explícito -->
<button type="button">Limpiar</button>
<button type="submit">Buscar</button>

Por qué importa

Un elemento <button> usa por defecto type="submit" siempre que se omite su atributo type — esto es un comportamiento definido por la especificación, no un bug, pero sorprende a muchos desarrolladores que asumen que un <button> simple es inerte hasta que se conecta con JavaScript. El fallo típico: se agrega un botón de "limpiar", "cancelar" o solo con ícono dentro de un formulario para algún otro propósito, no recibe un type explícito, y termina enviando el formulario cada vez que se hace clic — a menudo disparando una recarga de página o una llamada a la API no deseada. Esto es especialmente fácil de pasar por alto durante el desarrollo si el formulario todavía no tiene un manejador de envío funcional que haga evidente el envío accidental.

Frequently asked questions

¿Cuáles son los valores válidos para el type de button?

submit (el valor por defecto), button (no hace nada por sí solo — para acciones manejadas por JavaScript) y reset (restablece los campos del formulario a sus valores por defecto, poco usado hoy en día).

¿Esto aplica a botones fuera de un <form>?

No — el validador solo marca botones que son descendientes de un elemento form, ya que un botón sin type fuera de cualquier formulario no tiene comportamiento de envío que pueda disparar por accidente.