maxlength を超えるテキストが <input><textarea> に貼り付けられた際に切り詰められなくなりました

公開日:

カテゴリー: HTML

リリース: Firefox 77

概要

Firefox 77 以降、<input><textarea> HTML 要素は、貼り付けられたりドロップされたりしたユーザーテキストが maxlength で指定された文字数を超える場合であっても、それを自動的に切り詰めなくなります。この変更は主に、パスワードマネージャーなど他のところから貼り付けられた長いパスワードが予期せず切り詰められ、その後サイトに保存されてしまうのを防ぐ目的で行われるものです。

テキストが maxlength より長かった場合、そのフォームコントロールは無効と判断されます。要素の validity DOM オブジェクトはそれを受けて更新され、valid プロパティは false に、tooLong プロパティは true に変わります。

ユーザーは通常、「テキストを 20 文字以下に短くしてください (現在 30 文字です)」といった検証メッセージととともに、テキスト入力欄の周りに赤い枠線を目にすることとなります。このメッセージの内容は、必要であれば setCustomValidity メソッドを用いてカスタマイズできます。

ユーザーが問題を修正するまでフォームは送信できないため、サーバーが極端に長いテキストやパスワードを受け取ることはありません (サーバーサイドの検証はいずれにしても実装すべきです)。しかしこれは、入力されたテキストが決して maxlength を超えないことを想定したフロントエンド実装があった場合に潜在的な影響を与える可能性があります。

参考資料