🐙
React.StrictMode環境でMuiのTextFieldにautoFocusが効かない場面がある
Mui（MaterialUI）で<TextField autoFocus/>しているのが、いつの間にか効かなくなっていることに気付きました。
本番環境では起きないので、<React.StrictMode>周りが怪しいかなと思ったらドンピシャのissueが既に存在していました。
どうやら<Dialog>とかのモーダル系と組み合わせている場面で効かなくなっているようです。
なるほど確かにダイアログの外では普通に動いてるっぽい。
本番では発生しないので致命傷にはならないのだけど、手元で作業する時に効いてないと設定忘れと区別できないし、操作する時に普通に不便なので困ったものです。
参照が生えるタイミングとかが関係してるのかもしれないけど、今のところ未解決です。
Discussion
こちらの記事にあるように、setTimeoutで解決するようです。
コメントありがとうございます。
setTimeoutで解決するworkaroundはそうなのかもしれないけど、そもそもstrict mode起因の挙動はproductionで発生しないはずなので導入するかと言うと微妙な気がしています。development専用の対応をproductionに持ち込むよりは、開発時のちょっとした挙動の問題を受け入れる方が今のところは妥当なのかなぁ。