2011-07-25 9 views
4

現在、ドキュメントインスペクタ(「devtools.css」)のCSSを変更する拡張機能を作成しようとしています。コンテンツスクリプトとパターンマッチを使用してCSSを他のWebページに挿入するのに問題はありませんでしたが、Inspectorをターゲットできないようです。私は何かを逃しているのですか?これにはより良いアプローチがありますか?Chrome拡張機能を使用してドキュメントインスペクタにCSSを挿入する

結果: Match Pattern documentation私が間違ったところに気づいた後、スキーマセクションはどのような種類のURLで許可されているか非常に厳しく、 "chrome-devtools"はその1つではありません。

更新: 私は実験的なAPIを使用してインスペクタで新しいパネルを生成することになりましたが、それでも親の中にCSSを挿入することはできません。

+0

(http://stackoverflow.com/questions/7149450/customise-the-look-of-the-chrome-web-inspector)[Chromeウェブインスペクタの外観をカスタマイズ]の可能な重複 –

答えて

2

Webkitでは、開発ツールにCSSやJavaScriptを挿入することはできません。 Chrome用の実験的なAPIがあり、タブなどを追加できます。http://code.google.com/chrome/extensions/trunk/experimental.devtools.html

+0

ちょっと読んで、私のように見える私が望んでいたことをそれをすることができるように...それは良い方法であるべきであるように思われる。私はそれを試して、それがどれほど苦しいかを見なければならないでしょう。 – ench

+1

私が間違ったところに気づいたパターン一致のドキュメントを調べたところ、スキーマのセクションはどのURLで許可されているかが非常に厳しく、 "chrome-devtools"はその1つではありません。 – ench

0

マニフェストに「all_frames」が設定されていて、適切なURL権限を使用していますか?デベロッパーツールURLコードブロック:

<a href="chrome-devtools://devtools/devTools.css" 
class="webkit-html-resource-link" 
title="chrome-devtools://devtools/devTools.css" style="max-width: 100%; 
" line_number="1828" preferred_panel="resources">devTools.css:1828</a> 
+0

権限を使って再生した後、必要な "chrome-devtools"を許可していない単純なスキーマのように見えます。私はAPIを使うことに移ります。 – ench

+0

@enchはあなたがやろうとしていることではありませんか? ==> http://stackoverflow.com/questions/6843495/how-to-save-css-changes-of-styles-panel-of-chrome-developer-tools – Darin

0

現時点では、拡張APIを使用してChrome DevTools CSSを調整する方法はありません。そのための機能要求はしかし、あります - あなたは、この問題を追跡することもできます。http://crbug.com/83030 、ここで説明したように今のところ唯一のオプションは、デベロッパーツールのローカルで修正されたコピーを持っているだろう:​​

2

方法が用意されましたChrome拡張機能ではできません。

スタイルは、すべてのページで実行されるCustom.cssに加えて、インスペクタのために十分にユニークなセレクタ(#-webkit-web-inspector)にすることができます。

http://darcyclarke.me/design/skin-your-chrome-inspector/

+0

私はこれを調べなければならないでしょう。 – ench

+1

これは残念ながらもはや真実ではありません。 – Rudie

関連する問題