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
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
|
[
{
"namespace": "devtools.panels",
"allowedContexts": ["devtools", "devtools_only"],
"defaultContexts": ["devtools", "devtools_only"],
"description": "Use the <code>chrome.devtools.panels</code> API to integrate your extension into Developer Tools window UI: create your own panels, access existing panels, and add sidebars.",
"nocompile": true,
"types": [
{
"id": "ElementsPanel",
"type": "object",
"description": "Represents the Elements panel.",
"events": [
{
"name": "onSelectionChanged",
"type": "function",
"description": "Fired when an object is selected in the panel."
}
],
"functions": [
{
"name": "createSidebarPane",
"async": "callback",
"type": "function",
"description": "Creates a pane within panel's sidebar.",
"parameters": [
{
"name": "title",
"type": "string",
"description": "Text that is displayed in sidebar caption."
},
{
"name": "callback",
"type": "function",
"description": "A callback invoked when the sidebar is created.",
"optional": true,
"parameters": [
{
"name": "result",
"description": "An ExtensionSidebarPane object for created sidebar pane.",
"$ref": "ExtensionSidebarPane"
}
]
}
]
}
]
},
{
"id": "SourcesPanel",
"type": "object",
"description": "Represents the Sources panel.",
"events": [
{
"name": "onSelectionChanged",
"unsupported": true,
"description": "Fired when an object is selected in the panel."
}
],
"functions": [
{
"name": "createSidebarPane",
"unsupported": true,
"type": "function",
"description": "Creates a pane within panel's sidebar.",
"parameters": [
{
"name": "title",
"type": "string",
"description": "Text that is displayed in sidebar caption."
},
{
"name": "callback",
"type": "function",
"description": "A callback invoked when the sidebar is created.",
"optional": true,
"parameters": [
{
"name": "result",
"description": "An ExtensionSidebarPane object for created sidebar pane.",
"$ref": "ExtensionSidebarPane"
}
]
}
]
}
]
},
{
"id": "ExtensionPanel",
"type": "object",
"description": "Represents a panel created by extension.",
"functions": [
{
"name": "createStatusBarButton",
"unsupported": true,
"description": "Appends a button to the status bar of the panel.",
"type": "function",
"parameters": [
{
"name": "iconPath",
"type": "string",
"description": "Path to the icon of the button. The file should contain a 64x24-pixel image composed of two 32x24 icons. The left icon is used when the button is inactive; the right icon is displayed when the button is pressed."
},
{
"name": "tooltipText",
"type": "string",
"description": "Text shown as a tooltip when user hovers the mouse over the button."
},
{
"name": "disabled",
"type": "boolean",
"description": "Whether the button is disabled."
}
],
"returns": { "$ref": "Button" }
}
],
"events": [
{
"name": "onSearch",
"unsupported": true,
"description": "Fired upon a search action (start of a new search, search result navigation, or search being canceled).",
"parameters": [
{
"name": "action",
"type": "string",
"description": "Type of search action being performed."
},
{
"name": "queryString",
"type": "string",
"optional": true,
"description": "Query string (only for 'performSearch')."
}
]
},
{
"name": "onShown",
"type": "function",
"description": "Fired when the user switches to the panel.",
"parameters": [
{
"name": "window",
"type": "object",
"isInstanceOf": "global",
"additionalProperties": { "type": "any" },
"description": "The JavaScript <code>window</code> object of panel's page."
}
]
},
{
"name": "onHidden",
"type": "function",
"description": "Fired when the user switches away from the panel."
}
]
},
{
"id": "ExtensionSidebarPane",
"type": "object",
"description": "A sidebar created by the extension.",
"functions": [
{
"name": "setHeight",
"unsupported": true,
"type": "function",
"description": "Sets the height of the sidebar.",
"parameters": [
{
"name": "height",
"type": "string",
"description": "A CSS-like size specification, such as <code>'100px'</code> or <code>'12ex'</code>."
}
]
},
{
"name": "setExpression",
"async": "callback",
"type": "function",
"description": "Sets an expression that is evaluated within the inspected page. The result is displayed in the sidebar pane.",
"parameters": [
{
"name": "expression",
"type": "string",
"description": "An expression to be evaluated in context of the inspected page. JavaScript objects and DOM nodes are displayed in an expandable tree similar to the console/watch."
},
{
"name": "rootTitle",
"type": "string",
"optional": true,
"description": "An optional title for the root of the expression tree."
},
{
"name": "callback",
"type": "function",
"optional": true,
"description": "A callback invoked after the sidebar pane is updated with the expression evaluation results."
}
]
},
{
"name": "setObject",
"async": "callback",
"type": "function",
"description": "Sets a JSON-compliant object to be displayed in the sidebar pane.",
"parameters": [
{
"name": "jsonObject",
"type": "string",
"description": "An object to be displayed in context of the inspected page. Evaluated in the context of the caller (API client)."
},
{
"name": "rootTitle",
"type": "string",
"optional": true,
"description": "An optional title for the root of the expression tree."
},
{
"name": "callback",
"type": "function",
"optional": true,
"description": "A callback invoked after the sidebar is updated with the object."
}
]
},
{
"name": "setPage",
"type": "function",
"async": true,
"description": "Sets an HTML page to be displayed in the sidebar pane.",
"parameters": [
{
"name": "path",
"$ref": "manifest.ExtensionURL",
"description": "Relative path of an extension page to display within the sidebar."
}
]
}
],
"events": [
{
"name": "onShown",
"type": "function",
"description": "Fired when the sidebar pane becomes visible as a result of user switching to the panel that hosts it.",
"parameters": [
{
"name": "window",
"type": "object",
"isInstanceOf": "global",
"additionalProperties": { "type": "any" },
"description": "The JavaScript <code>window</code> object of the sidebar page, if one was set with the <code>setPage()</code> method."
}
]
},
{
"name": "onHidden",
"type": "function",
"description": "Fired when the sidebar pane becomes hidden as a result of the user switching away from the panel that hosts the sidebar pane."
}
]
},
{
"id": "Button",
"type": "object",
"description": "A button created by the extension.",
"functions": [
{
"name": "update",
"unsupported": true,
"type": "function",
"description": "Updates the attributes of the button. If some of the arguments are omitted or <code>null</code>, the corresponding attributes are not updated.",
"parameters": [
{
"name": "iconPath",
"type": "string",
"optional": true,
"description": "Path to the new icon of the button."
},
{
"name": "tooltipText",
"type": "string",
"optional": true,
"description": "Text shown as a tooltip when user hovers the mouse over the button."
},
{
"name": "disabled",
"type": "boolean",
"optional": true,
"description": "Whether the button is disabled."
}
]
}
],
"events": [
{
"name": "onClicked",
"unsupported": true,
"type": "function",
"description": "Fired when the button is clicked."
}
]
}
],
"properties": {
"elements": {
"$ref": "ElementsPanel",
"description": "Elements panel."
},
"sources": {
"$ref": "SourcesPanel",
"description": "Sources panel."
},
"themeName": {
"type": "string",
"description": "The name of the current devtools theme."
}
},
"functions": [
{
"name": "create",
"type": "function",
"description": "Creates an extension panel.",
"async": "callback",
"parameters": [
{
"name": "title",
"type": "string",
"description": "Title that is displayed next to the extension icon in the Developer Tools toolbar."
},
{
"name": "iconPath",
"description": "Path of the panel's icon relative to the extension directory, or an empty string to use the default extension icon as the panel icon.",
"choices": [
{ "type": "string", "enum": [""] },
{ "$ref": "manifest.ExtensionURL" }
]
},
{
"name": "pagePath",
"$ref": "manifest.ExtensionURL",
"description": "Path of the panel's HTML page relative to the extension directory."
},
{
"name": "callback",
"type": "function",
"optional": true,
"description": "A function that is called when the panel is created.",
"parameters": [
{
"name": "panel",
"description": "An ExtensionPanel object representing the created panel.",
"$ref": "ExtensionPanel"
}
]
}
]
},
{
"name": "setOpenResourceHandler",
"unsupported": true,
"type": "function",
"description": "Specifies the function to be called when the user clicks a resource link in the Developer Tools window. To unset the handler, either call the method with no parameters or pass null as the parameter.",
"async": "callback",
"parameters": [
{
"name": "callback",
"type": "function",
"optional": true,
"description": "A function that is called when the user clicks on a valid resource link in Developer Tools window. Note that if the user clicks an invalid URL or an XHR, this function is not called.",
"parameters": [
{
"name": "resource",
"$ref": "devtools.inspectedWindow.Resource",
"description": "A $(ref:devtools.inspectedWindow.Resource) object for the resource that was clicked."
}
]
}
]
},
{
"name": "openResource",
"unsupported": true,
"type": "function",
"description": "Requests DevTools to open a URL in a Developer Tools panel.",
"async": "callback",
"parameters": [
{
"name": "url",
"type": "string",
"description": "The URL of the resource to open."
},
{
"name": "lineNumber",
"type": "integer",
"description": "Specifies the line number to scroll to when the resource is loaded."
},
{
"name": "callback",
"type": "function",
"optional": true,
"description": "A function that is called when the resource has been successfully loaded."
}
]
}
],
"events": [
{
"name": "onThemeChanged",
"type": "function",
"description": "Fired when the devtools theme changes.",
"parameters": [
{
"name": "themeName",
"type": "string",
"description": "The name of the current devtools theme."
}
]
}
]
}
]
|
