Chrome(Windows版)でinput要素への入力中に変換未確定の状態でフォーカス移動すると文字列が二重入力される件について
再現方法
ChromeでGoogleのトップページを開く。
検索文字列入力欄に適当な文字列を入力する。
マウスでページ内の任意の場所をクリックして
検索文字列入力欄からフォーカスをはずす。TABキーをつかって検索文字列入力欄にフォーカスをいれる。
=>さきほど入力した適当な文字列が全選択状態になる(図1)日本語入力モードで適当な文字列を入力し、
変換確定せずに、(図2)
マウスでページ内の任意の場所をクリックして
検索文字列入力欄からフォーカスをはずす。
=>文字列が二重に入力された状態になる。(図3)
![](https://assets.st-note.com/img/1656664908988-ZT0SUB1lct.png?width=800)
![](https://assets.st-note.com/img/1656664809622-v9T7ZCPFVj.png?width=800)
![](https://assets.st-note.com/img/1656664846304-9PrjT43n9O.png?width=800)
Google先生で調べてみたところ、2020年に起票されている下記の不具合と同じような気がしないでもないです。
解決済じゃないのかな?再発なの?別の不具合?
補足
この事象は「フォーカス取得時の全選択状態」というところが肝で、一度全選択状態を解除してからCtrl+Aで再度全選択状態にした場合は再現しない。ソース読んでないけど(読めないけど)、フォーカス取得時に全選択状態になってると、なんかがダメなんだと思う。
英語圏の開発者にはどうでもいい話なんだろうな、きっと。
対応方法
この手の不具合があると、運用上めんどくさいトラブルが発生しがちなので、潰しておかないとまずいです。
根本解決にはならないけど、input要素のフォーカス取得イベントに下記のイベントハンドラをバインドしてみたら回避できた。
スクリプトで全選択状態を一旦解除する。
setTimeoutでちょっとほとぼりをさましてから、再度全選択状態にする。
これで、見た目的にはデフォルトと同じ挙動のまま二重入力を回避できる。そう信じたい。
この記事が気に入ったらサポートをしてみませんか?