かなり珍しい現象に出くわしたのでメモ。
GIFのような感じで、 input[type="text"]での文字削除の挙動がおかしくなるという不具合に出くわしました。
何が起こっているかというと、
-
cmd+deleteで全削除 => 削除されずにキャレットが先頭に -
fn+deleteでキャレット後の一文字を削除 => キャレット後の一文字を飛ばしてその次を削除、キャレットは削除した文字の位置に移動
エモいです。
結論
user-select: none をinputにつけるのをやめると正常に動作するようになりました。
今回現象が発生したサイトでは、全称セレクタに user-select: noneがついていたので、さらに解決する時間がかかったということでした...。
* {
user-select: none; /* ←があった */
}
ちなみに、user-select: autoで上書き(打ち消し)しても発生するので、素直にuser-select: noneを指定する範囲を狭めましょう。
(!important使っても発生しました)
以上です。