強みを持つトライコーン技術者によるブログです。HatenaPocketLINELINERSSFeedly開発グループのkatsuraです。Firefox57.0が先週リリースされましたね。Quantumとなり、見た目が変わったり、今まで利用していたアドオンが使えなくなったりして混乱もあるようですが、表示速度が改善されたり、見た目がモダンになったりしているので、個人的には期待しています。デフォルトのフォントの変更等はあったものの、レンダリングの動作・見た目の変更はほぼ無いとされているFireFox57.0ですが、一部イベント周りの動きが変更されている点があり、それが起因で今まで動いていたJavascriptの動作が変わってしまうパターンを偶然発見しました。今回はこの変更点について紹介させて頂きたいと思います。Firefox57.0で変更された動作について今回紹介するFirefox57.0での変更点とは、mousedownのイベント内でダイアログボックスを表示した場合、ダイアログボックス表示中でもmouseupの処理が必ず行われるようになった、というものです。mousedownのイベント内でダイアログボックスを表示した場合の処理について、以前のFirefoxでは以下のような流れで処理されていました。ユーザがマウスのボタンを押した段階で、mousedownイベントが発生しブラウザがダイアログボックスを表示ユーザがダイアログボックス表示中にマウスのボタンを離すユーザがマウス操作でダイアログボックスを閉じるmousedownイベント後、mouseupイベントは発生しないクリック対象がチェックボックス・ラジオボタンの場合でも、状態変更は行われない一方、Firefox57.0では、以下のような動作になります。ユーザの操作を受け付けている?)クリック対象がチェックボックスまたはラジオボタンだった場合には、チェックの状態変更などが行われる主に、チェックボックスやラジオボタンにmousedownイベントをセットしていた場合や、一つの要素にmousedown・mouseupイベントの両方をセットしていた場合に動作が異なる可能性があります。いう場合に困るのかでは、具体的にどのような場合に従来想定していたものと異なる動作になってしまうのか、チェックボックスの例で見ていきたいと思います。ブラウザ側でmouseupが実行されないので、想定した通りに動きます。Firefox57.0では、Javascript側でチェックボックスを変更後、ブラウザのmouseupが実行されてチェックボックスの状態が変更されてしまうので意図通りの動きをせず、下記のように想定と真逆に見える動作をしてしまいます。受け付けたブラウザもチェックボックスの状態を変化させてしまうため、相殺して元の状態に戻るわけです。受け付けたブラウザがチェックボックスの状態を変更するため、結果状態が変化された状態になります。対策について例えば、以下のように遅延処理を行うことで対策を行うことが出来ます。mousedownのイベントにて上手く分岐を行うことで、スマートな解決ができる可能性もあるかもしれません。/></body></html>最後に今回の動作変更について、Firefox57.0の変更点一覧には載せられていませんでしたので、意図しない動作変更の可能性もあり、今後のバージョンアップで元に戻る可能性もあるかと思います。現時点ではFirefox57.0以降で変更が行われるのかどうか判明しておりませんので、どちらの動作でも上手く動くような修正を行うのが良さそうです。katsura採用情報トライコーンでは一緒に働く仲間を募集中です!興味を持たれた方はぜひご応募ください。GTDこんばんわ、oktです。ツールを紹介してみます。ブックマークレットによるHTMLリンクチェッカはじめまして、入社半年のkatsuraです。