4

Chrome devtoolsウィンドウにパネルUIを追加し、現在ロードされているページに関する情報を表示したいと思います。情報を取得するために、ページが読み込まれる前にJavaScriptコードを挿入して、いくつかのメソッドの動作を変更できるようにします。

次のコードでテストしました。

マニフェスト.json

{
  "name": "Test Dev Panel",
  "version": "0.1",
  "description": "Extends the Developer Tools, replacing Array.toString() with a bogus one.",
  "devtools_page": "devtools.html",
  "manifest_version": 2,
  "permissions": ["<all_urls>"],
  "content_scripts": [{
    "matches": ["http://*/*"],
    "js": ["bogusarray.js"],
    "run_at": "document_start"
  }]
}

devtools.js

chrome.devtools.panels.create("Text Dev Panel",
                          "img/iconDev.png",
                          "panel.html");

bogusarray.js

Array.prototype.toString = function () {
    return 'Injected!';
  };

ただし、Array.toString（）の動作は変更されないため、JavaScript（bogusarray.js）がロードされたページに挿入されることはないようです。これについて何かアドバイスはありますか？

4

2 に答える 2

6

挿入されたスクリプトbogusarray.jsは、ページのスクリプトを作成しません。実行されるのは別の実行コンテキストであり、ページのDOMのみを表示できます。コンテンツスクリプトからDOMにタグを挿入することでページのスクリプトを作成できますが、<script>それでもArrayのプロトタイプなどの関数をオーバーライドするには遅すぎます。

目標を達成するには、を使用してDevTools拡張機能内から検査済みページをリロードする必要がありますchrome.devtools.inspectedWindow.reload()。injectedScriptパラメータを使用してオーバーライドを渡すだけです。

于 2013-03-01T17:51:16.103 に答える
4

あなたはこのようにそれを行うことができます：

  • スクリプトの最初の行にブレークポイントを設定します
  • スクリプトを編集する
  • デバッグを続行します
于 2013-03-01T08:52:47.010 に答える