Stay organized with collections Save and categorize content based on your preferences.
DescriptionUse the chrome.devtools.inspectedWindow
API to interact with the inspected window: obtain the tab ID for the inspected page, evaluate the code in the context of the inspected window, reload the page, or obtain the list of resources within the page.
See DevTools APIs summary for general introduction to using Developer Tools APIs.
The tabId
property provides the tab identifier that you can use with the chrome.tabs.*
API calls. However, please note that chrome.tabs.*
API is not exposed to the Developer Tools extension pages due to security considerations—you will need to pass the tab ID to the background page and invoke the chrome.tabs.*
API functions from there.
The reload
method may be used to reload the inspected page. Additionally, the caller can specify an override for the user agent string, a script that will be injected early upon page load, or an option to force reload of cached resources.
Use the getResources
call and the onResourceContent
event to obtain the list of resources (documents, stylesheets, scripts, images etc) within the inspected page. The getContent
and setContent
methods of the Resource
class along with the onResourceContentCommitted
event may be used to support modification of the resource content, for example, by an external editor.
The following keys must be declared in the manifest to use this API.
"devtools_page"
The eval
method provides the ability for extensions to execute JavaScript code in the context of the inspected page. This method is powerful when used in the right context and dangerous when used inappropriately. Use the tabs.executeScript
method unless you need the specific functionality that the eval
method provides.
Here are the main differences between the eval
and tabs.executeScript
methods:
eval
method does not use an isolated world for the code being evaluated, so the JavaScript state of the inspected window is accessible to the code. Use this method when access to the JavaScript state of the inspected page is required.inspect
and $0
.scripting.executeScript
method is the preferred way for an extension to access DOM data of the inspected page in cases where the access to JavaScript state of the inspected page is not required.
Note that a page can include multiple different JavaScript execution contexts. Each frame has its own context, plus an additional context for each extension that has content scripts running in that frame.
By default, the eval
method executes in the context of the main frame of the inspected page.
The eval
method takes an optional second argument that you can use to specify the context in which the code is evaluated. This options object can contain one or more of the following keys:
frameURL
contextSecurityOrigin
useContentScriptContext
The following code checks for the version of jQuery used by the inspected page:
chrome.devtools.inspectedWindow.eval(
"jQuery.fn.jquery",
function(result, isException) {
if (isException) {
console.log("the page is not using jQuery");
} else {
console.log("The page is using jQuery v" + result);
}
}
);
To try this API, install the devtools API examples from the chrome-extension-samples repository.
Types ResourceA resource within the inspected page, such as a document, a script, or an image.
PropertiesThe URL of the resource.
Gets the content of the resource.
The getContent
function looks like:
(callback: function) => {...}
The callback
parameter looks like:
(content: string, encoding: string) => void
Content of the resource (potentially encoded).
Empty if the content is not encoded, encoding name otherwise. Currently, only base64 is supported.
Sets the content of the resource.
The setContent
function looks like:
(content: string, commit: boolean, callback?: function) => {...}
New content of the resource. Only resources with the text type are currently supported.
True if the user has finished editing the resource, and the new content of the resource should be persisted; false if this is a minor change sent in progress of the user editing the resource.
callback
function optional
The callback
parameter looks like:
(error?: object) => void
Set to undefined if the resource content was set successfully; describes error otherwise.
The ID of the tab being inspected. This ID may be used with chrome.tabs.* API.
Methods eval()chrome.devtools.inspectedWindow.eval(
expression: string,
options?: object,
callback?: function,
): void
Evaluates a JavaScript expression in the context of the main frame of the inspected page. The expression must evaluate to a JSON-compliant object, otherwise an exception is thrown. The eval function can report either a DevTools-side error or a JavaScript exception that occurs during evaluation. In either case, the result
parameter of the callback is undefined
. In the case of a DevTools-side error, the isException
parameter is non-null and has isError
set to true and code
set to an error code. In the case of a JavaScript error, isException
is set to true and value
is set to the string value of thrown object.
An expression to evaluate.
The options parameter can contain one or more options.
If specified, the expression is evaluated on the iframe whose URL matches the one specified. By default, the expression is evaluated in the top frame of the inspected page.
scriptExecutionContext
string optional
Evaluate the expression in the context of a content script of an extension that matches the specified origin. If given, scriptExecutionContext overrides the 'true' setting on useContentScriptContext.
useContentScriptContext
boolean optional
Evaluate the expression in the context of the content script of the calling extension, provided that the content script is already injected into the inspected page. If not, the expression is not evaluated and the callback is invoked with the exception parameter set to an object that has the isError
field set to true and the code
field set to E_NOTFOUND
.
callback
function optional
The callback
parameter looks like:
(result: object, exceptionInfo: object) => void
The result of evaluation.
An object providing details if an exception occurred while evaluating the expression.
Set if the error occurred on the DevTools side before the expression is evaluated.
Set if the error occurred on the DevTools side before the expression is evaluated.
Set if the error occurred on the DevTools side before the expression is evaluated, contains the array of the values that may be substituted into the description string to provide more information about the cause of the error.
Set if the error occurred on the DevTools side before the expression is evaluated.
Set if the evaluated code produces an unhandled exception.
Set if the evaluated code produces an unhandled exception.
chrome.devtools.inspectedWindow.getResources(
callback: function,
): void
Retrieves the list of resources from the inspected page.
ParametersThe callback
parameter looks like:
(resources: Resource[]) => void
The resources within the page.
chrome.devtools.inspectedWindow.reload(
reloadOptions?: object,
): void
Reloads the inspected page.
ParametersreloadOptions
object optional
ignoreCache
boolean optional
When true, the loader will bypass the cache for all inspected page resources loaded before the load
event is fired. The effect is similar to pressing Ctrl+Shift+R in the inspected window or within the Developer Tools window.
injectedScript
string optional
If specified, the script will be injected into every frame of the inspected page immediately upon load, before any of the frame's scripts. The script will not be injected after subsequent reloads—for example, if the user presses Ctrl+R.
userAgent
string optional
If specified, the string will override the value of the User-Agent
HTTP header that's sent while loading the resources of the inspected page. The string will also override the value of the navigator.userAgent
property that's returned to any scripts that are running within the inspected page.
chrome.devtools.inspectedWindow.onResourceAdded.addListener(
callback: function,
)
Fired when a new resource is added to the inspected page.
ParametersThe callback
parameter looks like:
(resource: Resource) => void
chrome.devtools.inspectedWindow.onResourceContentCommitted.addListener(
callback: function,
)
Fired when a new revision of the resource is committed (e.g. user saves an edited version of the resource in the Developer Tools).
ParametersThe callback
parameter looks like:
(resource: Resource, content: string) => void
Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 4.0 License, and code samples are licensed under the Apache 2.0 License. For details, see the Google Developers Site Policies. Java is a registered trademark of Oracle and/or its affiliates.
Last updated 2025-08-11 UTC.
[[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],["Last updated 2025-08-11 UTC."],[],[]]
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4