ステップ

javascript window.focusが効かない場合の対策

javascript window.focus 効かない、ほかの実現方法

window.focusが効かない場合の対策を紹介したいと思います。

要件

・印刷機能で、全ての帳票を同一のウインドウ(タブ)で出力し、フォーカス(focus)すること

実現方法その1:ChromeはOK

上記の実装は、昔のブラウザなら、問題なく、正常に動いていましたが、最近のメジャーブラウザは、window.focusをサポートしないため、実行すると、window.focusの部分は全く効かない、javascriptエラーが発生してしまいました。(2019年7月17現時点で、Chromeが問題なく、動いている)
企業社内WebアプリケーションシステムはIEを使っているケースが圧倒的に多いため、この方法では、今の時代はもう使えません。

実現方法その2:ほぼOK

上記の実装は、最近のメジャーブラウザでは、正常に動いていますが、IE(Edgeも?)ではたまに、フォーカスされない場合があるので、この方法は、社内システムに向いていないですね。

実現方法その3:EdgeはNG

この実現方法は、すごくシンプルで、筆者が大好きですが、なぜかEdgeは、10回に1回くらい、新しいウィンドウを開けなかったり、javascriptエラー(SCRIPT16386:インターフェイスがサポートされていません)が発生したり、しましたので、Edgeサポートも必要のシステムにおいて、この方法は使いません。

実現方法その4:OKですが、微妙

実現方法その3の対策版です。実現方法その3は、非同期処理の原因で、処理のスピードによって、たまに不具合が発生するのではないかと考えて、setTimeoutを入れて、0.8秒を待った後に、次の処理を行うことを試したら、Edgeで50回くらい印刷しても、問題なく、動作しました。
Timeout時間は0.8にしろか、1秒にしろか、皆さんのご自身に調整してみてください。(筆者の場合、最初0.5秒にしましたが、また同じ不具合が発生しましたため、0.8秒にしました。)

まとめ

いかがでしょうか。javascriptでwindow.focusが効かない場合、ほかの実現方法をご理解されたでしょうか。4つの実現方法をここに挙げましたが、もっといい方法はまだあるはずと思います。例えば、Promise。皆さんに完璧な実現方法があれば、是非筆者にご連絡ください。