1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
|
---
title: devtools.panels
slug: Mozilla/Add-ons/WebExtensions/API/devtools/panels
tags:
- API
- Add-ons
- Extensions
- Reference
- WebExtensions
- devtools.panels
translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels
original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels
---
<div>{{AddonSidebar}}</div>
<div class="note">
<p>このAPI は <a href="https://developer.chrome.com/extensions/devtools">Chrome devtools APIs</a> に基づいていますが、Firefoxでは実装されていない多くの機能があり、よってここに文書化されていません。現在欠けている機能を見るには、 <a href="/ja/Add-ons/WebExtensions/Using_the_devtools_APIs#Limitations_of_the_devtools_APIs">Limitations of the devtools APIs</a> を見てください。</p>
</div>
<p><code>devtools.panels</code> API によって開発ツール拡張機能では開発ツールウィンドウ内のユーザーインターフェイスの定義ができます。</p>
<p>開発ツールウィンドウにはいくつもの個別のツールがあります - JavaScript デバッガー、ネットワークモニター、などが。最上位のタブの行でユーザーは色々なツールを切り替えられます。ツールのUIをホストするこのウィンドウは「パネル」と呼ばれます。</p>
<p><code>devtools.panels</code> API にて開発ツールウィンドウ内の新規パネルを作成できます。</p>
<p>すべての <code>devtools</code> API と同様に、この API はmanifest.json <a href="/ja/docs/Mozilla/Add-ons/WebExtensions/manifest.json/devtools_page">devtools_page</a> キー内に定義されたドキュメントや、拡張機能が作成するその他の開発ツールドキュメント(例えばパネル自身のドキュメント)の中だけでコードを利用できます。これ以上は <a href="/ja/docs/Mozilla/Add-ons/WebExtensions/Extending_the_developer_tools">開発ツールを拡張する</a>を見てください。</p>
<h2 id="Types" name="Types">型</h2>
<dl>
<dt><code><a href="/ja/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel">devtools.panels.ElementsPanel</a></code></dt>
<dd>ブラウザーの開発ツールの HTML/CSS インスペクターを表す</dd>
<dt><code><a href="/ja/Add-ons/WebExtensions/API/devtools.panels/ExtensionPanel">devtools.panels.ExtensionPanel</a></code></dt>
<dd>拡張機能によって作られた開発ツールパネルを表す</dd>
<dt><code><a href="/ja/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane">devtools.panels.ExtensionSidebarPane</a></code></dt>
<dd>ブラウザーの開発ツールの HTML/CSS インスペクターに、拡張機能が追加したペインを表す</dd>
</dl>
<h2 id="Properties" name="Properties">プロパティ</h2>
<dl>
<dt><code><a href="/ja/Add-ons/WebExtensions/API/devtools.panels/elements">devtools.panels.elements</a></code></dt>
<dd><code><a href="/ja/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel">ElementsPanel</a></code> オブジェクトの参照</dd>
<dt><code><a href="/ja/Add-ons/WebExtensions/API/devtools.panels/themeName">devtools.panels.themeName</a></code></dt>
<dd>現在の開発ツールテーマの名前</dd>
</dl>
<h2 id="Functions" name="Functions">関数</h2>
<dl>
<dt><code><a href="/ja/Add-ons/WebExtensions/API/devtools.panels/create">devtools.panels.create()</a></code></dt>
<dd>開発ツールを作成する</dd>
</dl>
<h2 id="Events" name="Events">イベント</h2>
<dl>
<dt><code><a href="/ja/Add-ons/WebExtensions/API/devtools.panels/onThemeChanged">devtools.panels.onThemeChanged</a></code></dt>
<dd>開発ツールテーマが変更された時に発火する</dd>
</dl>
<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザ実装状況</h2>
<p>{{Compat("webextensions.api.devtools.panels", 2)}}</p>
<p>{{WebExtExamples("h2")}}</p>
<div class="note"><strong>謝辞</strong>
<p>この API は Chromium の <a href="https://developer.chrome.com/extensions/devtools_panels"><code>chrome.devtools.panels</code></a> API に基づいています。</p>
<p>Microsoft Edge での実装状況は Microsoft Corporation から提供されたものであり、ここでは Creative Commons Attribution 3.0 United States License に従っています。</p>
<p> </p>
</div>
<div class="hidden">
<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
//
// Redistribution and use in source and binary forms, with or without
// modification, are permitted provided that the following conditions are
// met:
//
// * Redistributions of source code must retain the above copyright
// notice, this list of conditions and the following disclaimer.
// * Redistributions in binary form must reproduce the above
// copyright notice, this list of conditions and the following disclaimer
// in the documentation and/or other materials provided with the
// distribution.
// * Neither the name of Google Inc. nor the names of its
// contributors may be used to endorse or promote products derived from
// this software without specific prior written permission.
//
// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
// "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
// LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
// A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
// OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
// LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
// DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
// THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
// (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
</pre>
</div>
|
