Valor inválido “nope” para o atributo “autocomplete” no elemento “input”: A string “nope” não é um nome de campo de preenchimento automático válido.

O atributo autocomplete diz ao navegador como lidar com o preenchimento automático para um campo de formulário. A especificação HTML define um conjunto restrito de valores válidos, que incluem "on", "off", e uma lista de nomes de campos de preenchimento automático como "username", "new-password", "cc-number", "postal-code", e muitos outros. Quando você usa um valor que não está nesta lista — como "nope", "false", "none", ou qualquer outra string inventada — o validador W3C reporta-o como um nome de campo de preenchimento automático inválido.

Uma razão comum para os programadores usarem valores como "nope" é como uma solução alternativa porque alguns navegadores historicamente ignoravam autocomplete="off". Em versões mais antigas do Chrome e Firefox, o navegador ainda mostraria sugestões de preenchimento automático mesmo quando off estava definido, então os programadores descobriram que usar um valor não reconhecido como "nope" efetivamente enganava o navegador para não mostrar sugestões. Embora este truque possa ter funcionado na prática, produz HTML inválido e não é uma solução confiável a longo prazo, já que o comportamento do navegador em relação a valores não reconhecidos pode mudar a qualquer momento.

Por que isso é importante

• Conformidade com padrões: Valores de atributo inválidos tornam o seu HTML não conforme, o que pode causar problemas com ferramentas, pipelines de teste e auditores de acessibilidade.
• Acessibilidade: Leitores de ecrã e tecnologias assistivas dependem de valores autocomplete válidos para ajudar os utilizadores a preencher formulários. Usar um nome de campo de preenchimento automático correto como "given-name" ou "email" pode melhorar significativamente a experiência para utilizadores com deficiências. De facto, o Critério de Sucesso 1.3.5 do WCAG 2.1 recomenda especificamente o uso de valores de preenchimento automático válidos para campos que recolhem informações do utilizador.
• Comportamento do navegador: Os navegadores modernos melhoraram o seu tratamento de autocomplete="off". Usar o valor padrão é agora mais confiável do que era antes, e usá-lo corretamente garante um comportamento previsível entre navegadores.

Como corrigir

1. Para desativar o preenchimento automático, substitua o valor inválido por "off".
2. Para ativar o preenchimento automático inteligente, use o nome de campo de preenchimento automático apropriado da lista de nomes de campos de preenchimento automático da especificação HTML. Esta é a abordagem preferida para a maioria dos formulários voltados para o utilizador.
3. Para novas palavras-passe (por exemplo, formulários de registo ou alteração de palavra-passe), use "new-password" — isto diz ao navegador para sugerir uma palavra-passe gerada em vez de preencher uma guardada.

Exemplos

Inválido: valor de preenchimento automático inventado

<input type="text" name="firstName" autocomplete="nope">

Outros valores inválidos comuns que desencadeiam o mesmo erro incluem "false", "none", "disable", e "no".

Corrigido: desativar o preenchimento automático com "off"

<input type="text" name="firstName" autocomplete="off">

Corrigido: usar um nome de campo de preenchimento automático válido

Usar um nome de campo de preenchimento automático específico é frequentemente melhor do que "off" porque ajuda navegadores e tecnologias assistivas a compreender o propósito do campo:

<input type="text" name="firstName" autocomplete="given-name">

Corrigido: valores de preenchimento automático válidos comuns num formulário

<form method="post" action="/register">
  <label for="name">Nome Completo</label>
  <input type="text" id="name" name="name" autocomplete="name">

  <label for="email">Email</label>
  <input type="email" id="email" name="email" autocomplete="email">

  <label for="newpass">Palavra-passe</label>
  <input type="password" id="newpass" name="password" autocomplete="new-password">

  <label for="tel">Telefone</label>
  <input type="tel" id="tel" name="phone" autocomplete="tel">

  <button type="submit">Registar</button>
</form>

Alguns dos valores válidos mais comumente usados incluem: "name", "given-name", "family-name", "email", "username", "new-password", "current-password", "street-address", "postal-code", "country", "tel", "cc-number", e "organization". Consulte a lista completa na especificação HTML para todas as opções disponíveis.

Saiba mais:

WHATWG Spec

HTML Spec: autocomplete

→