新ブログの該当記事に転送中です。少々お待ち下さい。
(転送されない場合は下記リンクからお進み下さい)

『Firefox:レスポンシブデザインモードでダイアログが出ないバグ』
https://at.sachi-web.com/blog-entry-1537.html

このブログのはてなブックマーク数 このエントリーをはてなブックマークに追加

知らなきゃ絶対損するPCマル秘ワザ

知らなくて損したPC情報とかを分かりやすくメモする個人ブログ。
『月,水,金』の週3回更新!(予定)

Firefox:レスポンシブデザインモードでダイアログが出ないバグ

このエントリーをはてなブックマークに追加
操作画面


こんにちは、さち です。

先日、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);

見た目はこんな感じです。
操作画面




レスポンシブデザインモードだとアラートが出ない

  1. レスポンシブデザインモード(Ctrl + Shift + M)にして、ボタンをクリック。
    操作画面

  2. しかし、アラート(ダイアログ)は出ません。
    アラートの処理をすっ飛ばして背景色がオレンジになってしまいました。
    操作画面

レスポンシブデザインモードでないときは
ちゃんとアラートが出るので、コードに問題はありません。
操作画面

場合によっては、alert() の部分で処理が中断されてしまい
それ以降のコードが実行されないこともあります。

今回の例は、「OK」をクリックするだけの alert() なので
不具合とはいえ、大きな支障はないですが
実は、confirm(), prompt() でも同様の症状が出ます。

本来、confirm() では「OK/キャンセル」の選択が行われますが
勝手に「キャンセル(false)」が送られてしまいます。
「OK」のときの動作テストができないので面倒です。

ちなみに、新規作成したプロファイルでも不具合が出たので
アドオンやその他の設定が原因である可能性は低いです。

すでに2年前から確認されているようですが、今も放置されています。
Developer Edititon(Firefox 61) でも直っていないですし
今後も放置され続ける可能性が高そうですね……。

スマホ用サイトの動作テストには Chrome を使った方がいいかもしれません。




このエントリーをはてなブックマークに追加




ブログ移転に伴い、コメント受付は終了しました。



記事別の週間アクセス数ランキングです。こちらの記事もぜひ読んでみて下さい。

2008-2019 知らなきゃ絶対損するPCマル秘ワザ  無断転載禁止

ブログパーツ