はじめに
たまに出ることがありますが、珍しいエラーメッセージです。
このエラーが出るのは、excuteScript()をbackground.jsで出力したときにconsole.js側のコンソールに表示されています。いざ、実行しようとしたが、その時にexcuteScript()が取得できないようです。background.js側では、excuteScript()を生成しているのですが。
原因はいまのところ、不明です。
特別なことは行っていません。この時のアクションは、サイトページで、ctrlKey+clickを行ったときです。
ctrlKey+clickを行ったときは、ポップアップ画面をページのbody要素にアペンドしています。ポップアップ画面には、各種ボタンを表示しています。この時、同時に、background.jsへ"clickSet"メッセージを送信しています。background.jsは、executeScript()で、ctrlKey+clickのイベントリスナーを登録しています。
テストサイト
https://tecoyan-net.jimdofree.com/2024/09/07/%E3%83%86%E3%82%B9%E3%83%88/
実行タイミングに問題があるのか?
すべて、リセットして、再度、タブをリブートして行うと、うまく行きます。
コンソールには、一見、VMxxxxxが表示されていて、うまくいっているように見えますが、クリックして見て見ると、次の画面が表示されます。
ここに、executeScript()のスクリプトコードが表示されていないということは、この時点で、スクリプトコードをフェッチ(取得)できないということです。その原因を知りたいのですが。background.jsからcontent.js側へ渡すときに、何らかの理由で、渡すことができなかったということです。このexecuteScript()関数にはVMxxxxxというファイル名が自動で付けられています。このファイルを開くときに開けなかったということです。しかし、ある時には正常に開けているのです。その差は何なんでしょう。
せめて、エラーの理由が書かれていれば
この時のエラーメッセージは、非常にそっけないものです。これだけでは、何をチェックしてエラーとしたかが知らされていません。もう少し、親切なエラーメッセージにしてもらいたいです。
executeScript()を使用した背景
executeScript()は、プラグインのbackground.jsで使用しています。
このインジェクションスクリプトは、タブに含まれている動画のiframe要素のドキュメントオブジェクトへアクセスする必要がある時に使用できる大変便利なスクリプトです。
今回、タブには複数のyoutube動画がiframeを用いて埋め込まれています。
このiframeのドキュメントオブジェクトは、親フレームのタブのドキュメントオブジェクトとは別空間にあります。その空間の要素に、アクセスするためにexecuteSCript()を用いています。
成功した画面
うまくいった場合は、この画面のようになります。background.jsで生成したexecuteScript()が表示されています。
中間報告
今のままでは、自力解決は難しい気がしていますが、試行錯誤を重ねながら、ネットでヒントを探すことも続けて行きたいと思います。
ヒントは、1,2回続けるとエラーは取れるというところにあるような気がしています。これは、初期化とか、一度実行すると何らかの設定が行われて、次回からはエラーが取れるようなことかとも思っています。
よくよく、テストをして見ると、VMxxxxxが生成されていないケースもありました。これも原因不明です。
再現性:あり
初回のctrlKey+clickではVMxxxxが正常にロードされず、2回目のctrlKey+clickでは正しく、VMxxxxがロードされています。
あとがき
このように、システムから警告されるエラーメッセージには、何が悪くてエラーになったかの理由がついていません。ただ、「エラーです」だけでは、対策のしようがありません。ネットで検索しましたが、同じようなエラーメッセージは、ヒットしません。
どこかに、ヒントが出てくるのを待ちたいと思います。
ご報告
ついに、原因が判明しました。おそらく、これが原因かと思われます。対処後、今のところ、順調に動作しています。
わかってみれば、なるほど、と思うことでした。このことは、これまでも何度も経験していたことですが、今回は、見落としていました。
原因は、ボタンにイベントリスナーを登録するときに、そのボタンの表示が間に合わなくて、一回目のctrl+click実行でリスナーが登録できていませんでした。
2回目のctrl+clickの時には、すでにpopup画面が表示され、ボタンも表示されています。そのため、ボタンにリスナーを登録できました。
そこで、簡単な方法ですが、1秒タイマーで、表示されるまでリスナー登録を遅らせました。これで、1回目のctrl+clickでも、ホバーイベント他のリスナーも登録され、タイトルにある、「スクリプト ソースをフェッチできません。」というエラーはなくなりました。お騒がせいたしました。
それにしても、このエラーメッセージでは、この原因にはたどりつけないです。
動的生成の要素にリスナーを登録するときは
忘れがちですが、あらためて気を付けたいと思います。
ボタンなどにリスナーを登録するときは、必ず、表示を確認してから実行する。
この「スクリプト ソースをフェッチできません。」というエラーの真の原因は、スクリプトコードを正常に出力できなかったという意味ではと。それは、先の理由で、イベントリスナーのスクリプトコードを対象とする要素がまだ、存在していなかった時点で、登録しようとしたためではないかと思います。