知らなきゃ絶対損するPCマル秘ワザ
『月，水，金』の週３回更新！（予定）
こんにちは、さち です。
先日、Firefox のレスポンシブデザインモードを使って
スマホ用サイトの動作テストをしていました。
しかし、alert() によってダイアログが出るはずのところで
何も起きないという問題が発生。
コードに問題があるのかと思い見直しましたが
タイプミスなどは見つかりません。
どゆこと？
サンプルページの作成
ボタンをクリックするとアラートが出て、背景色がオレンジに変化します。<div>
<button>かーん！かーん！</button>
</div>
var body = document.getElementsByTagName('body')[0];
var button = document.getElementsByTagName('button')[0];
button.addEventListener('click', function() {
alert('み・か・ん！');
body.style.backgroundColor = 'orange';
}, false);見た目はこんな感じです。
レスポンシブデザインモードだとアラートが出ない
- レスポンシブデザインモード（Ctrl + Shift + M）にして、ボタンをクリック。
- しかし、アラート（ダイアログ）は出ません。
アラートの処理をすっ飛ばして背景色がオレンジになってしまいました。
レスポンシブデザインモードでないときは
ちゃんとアラートが出るので、コードに問題はありません。
場合によっては、alert() の部分で処理が中断されてしまい
それ以降のコードが実行されないこともあります。
今回の例は、「OK」をクリックするだけの alert() なので
不具合とはいえ、大きな支障はないですが
実は、confirm(), prompt() でも同様の症状が出ます。
本来、confirm() では「OK／キャンセル」の選択が行われますが
勝手に「キャンセル（false）」が送られてしまいます。
「OK」のときの動作テストができないので面倒です。
ちなみに、新規作成したプロファイルでも不具合が出たので
アドオンやその他の設定が原因である可能性は低いです。
すでに2年前から確認されているようですが、今も放置されています。
Developer Edititon（Firefox 61） でも直っていないですし
今後も放置され続ける可能性が高そうですね……。
スマホ用サイトの動作テストには Chrome を使った方がいいかもしれません。
0
| ホーム |
