| OLD | NEW |
| 1 <p id="classSummary"> | 1 <p id="classSummary"> |
| 2 Use the <code>chrome.devtools.panels</code> module to integrate | 2 Use the <code>chrome.devtools.panels</code> module to integrate |
| 3 your extension into Developer Tools window UI: create your own panels, access | 3 your extension into Developer Tools window UI: create your own panels, access |
| 4 existing panels, and add sidebars. | 4 existing panels, and add sidebars. |
| 5 </p><p> | 5 </p><p> |
| 6 See <a href="devtools.html">DevTools APIs summary</a> for | 6 See <a href="devtools.html">DevTools APIs summary</a> for |
| 7 general introduction to using Developer Tools APIs. | 7 general introduction to using Developer Tools APIs. |
| 8 </p> | 8 </p> |
| 9 | 9 |
| 10 <h2>Overview</h2> | 10 <h2 id="overview">Overview</h2> |
| 11 | 11 |
| 12 <p> | 12 <p> |
| 13 Each extension panel and sidebar is displayed as a separate HTML page. All | 13 Each extension panel and sidebar is displayed as a separate HTML page. All |
| 14 extension pages displayed in the Developer Tools window have access to all | 14 extension pages displayed in the Developer Tools window have access to all |
| 15 modules in <code>chrome.devtools</code> API, as well as to | 15 modules in <code>chrome.devtools</code> API, as well as to |
| 16 <a href="extension.html">chrome.extension</a> API. Other extension APIs are not | 16 <a href="extension.html">chrome.extension</a> API. Other extension APIs are not |
| 17 available to the pages within Developer Tools window, but you may invoke them | 17 available to the pages within Developer Tools window, but you may invoke them |
| 18 by sending a request to the background page of your extension, similarly to how | 18 by sending a request to the background page of your extension, similarly to how |
| 19 it's done in the <a href="overview.html#contentScripts">content scripts</a>. | 19 it's done in the <a href="overview.html#contentScripts">content scripts</a>. |
| 20 </p><p> | 20 </p><p> |
| (...skipping 33 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 54 | 54 |
| 55 <img src="{{static}}/images/devtools-panels.png" | 55 <img src="{{static}}/images/devtools-panels.png" |
| 56 style="margin-left: 20px" | 56 style="margin-left: 20px" |
| 57 width="686" height="289" | 57 width="686" height="289" |
| 58 alt="Extension icon panel on DevTools toolbar" /> | 58 alt="Extension icon panel on DevTools toolbar" /> |
| 59 </p> | 59 </p> |
| 60 | 60 |
| 61 <p> | 61 <p> |
| 62 You can find examples that use this API in | 62 You can find examples that use this API in |
| 63 <a href="samples.html#Chrome Query">Samples</a>. | 63 <a href="samples.html#Chrome Query">Samples</a>. |
| 64 </p> | 64 </p> |
| OLD | NEW |