Hindert Nutzer daran, Inhalte in Eingabefelder einzufügen

Einige Websites behaupten, dass die Sicherheit beeinträchtigt wird, wenn Nutzer Passwörter einfügen dürfen. Das Einfügen von Passwörtern verbessert jedoch die Sicherheit. da dies die Nutzung von Passwortmanagern ermöglicht.

Passwortmanager erstellen in der Regel starke Passwörter für Nutzer, sicher speichern und dann automatisch einfügen. Passwortfelder ein, wenn sich Nutzer anmelden müssen. Dieser Ansatz ist in der Regel sicherer, als Nutzer dazu zu zwingen, Passwörter einzugeben, die kurz genug sind, um sich zu merken.

Im Allgemeinen sollten Nutzer nicht daran gehindert werden, Inhalte in <input>-Elemente einzufügen.

Gründe für das Scheitern dieser Lighthouse-Prüfung

Lighthouse meldet Code, der Nutzer daran hindert, Inhalte in nichtschreibgeschützte Eingabefelder einzufügen:

Lighthouse erfasst alle nicht nur lesbaren <input>-Elemente, fügt in jedes Element Text ein und prüft dann, ob das paste-Ereignis nicht durch einen benutzerdefinierten Ereignishandler verhindert wurde.

Es ist auch möglich, das Einfügen außerhalb eines paste-Ereignis-Listeners zu verhindern. Lighthouse erkennt dieses Szenario nicht.

Einfügen in Passwortfelder aktivieren

Code finden, der das Einfügen verhindert

So finden und prüfen Sie schnell den Code, der das Einfügen verhindert:

1. Maximieren Sie den Bereich Event-Listener-Haltepunkte.
2. Maximieren Sie die Liste Zwischenablage.
3. Markieren Sie das paste-Kästchen.
4. Fügen Sie Text in ein Passwortfeld auf Ihrer Seite ein.
5. Die Entwicklertools sollten in der ersten Codezeile pausieren im entsprechenden paste-Event-Listener hinzufügen.

Entferne den Code, der das Einfügen verhindert

Die Ursache des Problems ist häufig ein Aufruf von preventDefault() innerhalb des paste-Ereignislisteners, der mit dem Passworteingabeelement verknüpft ist:

let input = document.querySelector('input');

input.addEventListener('paste', (e) => {
  e.preventDefault(); // This is what prevents pasting.
});

Wenn Sie nur auf Ereignisse einfügen wollen, um sie zu beenden, entfernen Sie den gesamten Event-Listener.

Ressourcen

Quellcode für die Prüfung Hindert Nutzer daran, Inhalte in Eingabefelder einzufügen