Um formulário pode parecer pronto, mas pode não entregar nada. Em um formulário estático, o botão responde e a mensagem chega a alguém são testes diferentes.
Campo Vazio: Deixe o Navegador Ajudar
Tente enviar vazio e depois com um endereço inválido. required e type="email" oferecem validação básica no navegador. Isso não verifica se a caixa postal existe nem substitui a validação no servidor.
Teclado: Teste Enter, Não Só o Clique
O comportamento está no evento submit do formulário. Assim, o fluxo também atende ao envio por teclado. Use Tab para chegar ao campo e ao botão; confira se o foco continua visível. O label associado dá nome ao campo, e role="status" identifica uma atualização de estado para tecnologias assistivas. Teste também com o leitor de tela usado pelo seu público.
Sucesso: Descreva o Que Realmente Aconteceu
No exemplo, o resultado é uma simulação. Não escreva “Recebemos seu pedido” se não existe serviço recebendo o pedido. Na revisão, isso evita que alguém digite dados reais acreditando ter contratado ou cadastrado algo.
Rede Lenta e Falha: São Estados Separados
Quando houver uma API real, revise pelo menos: enviando, concluído e falhou. Durante o envio, impeça submissões duplicadas; numa falha, preserve os campos e ofereça uma nova tentativa. Não anuncie sucesso antes de verificar a resposta da API. A validação e a proteção contra abuso também precisam existir no servidor.
Outro Navegador: Estado Local Não É uma Caixa de Entrada
Abra o link em um navegador sem a sua sessão. Uma resposta armazenada em localStorage fica naquele navegador e naquela origem; ela não aparece automaticamente no computador de quem criou a página. Não coloque chaves privadas de API no HTML ou no JavaScript entregue ao visitante.
Teste com Dois Botões
No formulário comum, um botão sem type pode virar o botão de envio padrão. A ordem relevante é a do documento, não a posição visual feita com CSS.
Para uma ação auxiliar, eu deixaria o tipo explícito:
type="button"para ações auxiliarestype="reset"para restaurar os valores iniciais do formulário
Referência sobre o Botão Padrão e Envio Implícito
O primeiro botão precisa do seu próprio comportamento de limpeza; type="button" apenas impede a submissão padrão. Se a intenção for restaurar os valores iniciais do formulário, existe `type="reset"", não é necessariamente “esvaziar tudo”.
Conclusão
Para encerrar a revisão, quem testa consegue distinguir uma prévia visual de uma ação que realmente envia dados.
Atualização em 10/10:
Obrigado ao Florian pelo complemento. Defina type="button" nas ações auxiliares e type="submit" no envio. Teste Enter com dois botões, inclusive trocando a ordem no documento. Confira a ação executada, não apenas a mensagem final. A regra de envio implícito explica a escolha do botão padrão.
HTML Standard.