Chrome と Firefox が minlength 属性に対応していた

input 要素と textarea 要素に minlength 属性が登場してから3年半が過ぎましたが（導入当時に書いた記事）、現在では Chrome と Firefox がツールチップを出す形で対応しています。

テストケースとして、8桁固定の会員番号入力欄で試してみます。マークアップはこんな感じ。

<p><label>会員番号（<strong>必須</strong>、8桁）
  <input name="id" required="" minlength="8" maxlength="8"/></label></p>

これを、わざと4文字しか入力しない状態で送信してみます。

Chrome 57

入力時点では何も起こりません。一応、入力欄をマウスオーバーするとツールチップが表示されるのですが、これに気付く人は稀でしょう。

送信ボタンを押すとアイコン付きのツールチップで「このテキストは○文字以上で指定してください（現在は○文字です）。」と表示されますが、5秒ほど経つと自動的に消えてしまいます。

入力を開始し、最小文字長を満たさない状態でフォーカスを外すと、入力欄が赤くなります。赤くなるだけなのでそのままでは何のエラーなのか分かりませんが、マウスオーバーするとツールチップで「少なくとも○文字以上に長くしてください（現在は○文字です）。」と表示されます。

送信ボタンを押すと、ツールチップで「少なくとも○文字以上に長くしてください（現在は○文字です）。」と表示されます。 Chrome と異なり、フォーカスを外さない限り自動的には消えません。

なお、 Windows 10 + Firefox 52 + NVDA 2017.1jp の組み合わせでは、ツールチップの内容が自動的に読み上げられました。

Windows版と同じ動作ですが、ツールチップの幅よりメッセージの方が長いため、電光掲示板のように自動横スクロールで表示されます。

対応していないようです。