Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(103)

Side by Side Diff: chrome/common/extensions/docs/static/experimental.devtools.inspectedWindow.html

Issue 8497027: This includes small updates to the inspectedWindow.html documentation. (Closed) Base URL: http://src.chromium.org/svn/trunk/src/
Patch Set: '' Created 9 years, 1 month ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
« no previous file with comments | « chrome/common/extensions/docs/experimental.devtools.inspectedWindow.html ('k') | no next file » | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <div id="pageData-name" class="pageData" 1 <div id="pageData-name" class="pageData"
2 >chrome.experimental.devtools.inspectedWindow.* APIs</div> 2 >chrome.experimental.devtools.inspectedWindow.* APIs</div>
3 3
4 <p> 4 <p>
5 Use <code>chrome.experimental.devtools.inspectedWindow</code> to interact with 5 Use <code>chrome.experimental.devtools.inspectedWindow</code>
6 the inspected window: obtain tab ID for the inspected page, evaluate the code 6 to interact with the inspected window:
7 in the context of inspected window, reload the page. 7 obtain the tab ID for the inspected page,
8 evaluate the code in the context of inspected window,
9 reload the page,
10 or obtain the list of resources within the page.
8 </p><p> 11 </p><p>
9 See <a href="experimental.devtools.html">DevTools APIs summary</a> for 12 See <a href="experimental.devtools.html">DevTools APIs summary</a> for
10 general introduction to using Developer Tools APIs. 13 general introduction to using Developer Tools APIs.
11 </p> 14 </p>
12 15
13 <h2>Notes</h2> 16 <h2>Overview</h2>
14 <p> 17 <p>
15 The <a href="#property-tabId"><code>tabId</code></a> property 18 The <a href="#property-tabId"><code>tabId</code></a> property
16 provides tab identifier that may be used with the <a href="tabs.html"> 19 provides the tab identifier that you can use with the
17 <code>chrome.tabs.*</code></a> API calls. 20 <a href="tabs.html"><code>chrome.tabs.*</code></a> API calls.
18 However, please note that <code>chrome.tabs.*</code> API is not 21 However, please note that <code>chrome.tabs.*</code> API is not
19 exposed to the Developer Tools extension pages due to security considerations 22 exposed to the Developer Tools extension pages due to security considerations
20 &mdash; you will need to pass the tab ID to the background page and invoke 23 &mdash; you will need to pass the tab ID to the background page and invoke
21 the <code>chrome.tabs.*</code> API functions from there. 24 the <code>chrome.tabs.*</code> API functions from there.
22 </p></p> 25 </p>
26 <p>
23 The <code>eval()</code> method provides the ability for extensions to execute 27 The <code>eval()</code> method provides the ability for extensions to execute
24 JavaScript code in the context of the main frame of the inspected page. 28 JavaScript code in the context of the main frame of the inspected page.
25 This method is different from 29 This method is powerful when used in the right context
26 <code>chrome.tabs.executeScript()</code> in the following aspects: 30 and dangerous when used inappropriately.
31 Use the <code>chrome.tabs.executeScript()</code> method
32 unless you need the specific functionality
33 that the <code>eval()</code> method provides.
34 </p>
35 <p>Here are the main differences between the
36 <code>eval()</code> and <code>chrome.tabs.executeScript()</code> methods:
27 </p><ul> 37 </p><ul>
28 <li>The <code>eval()</code> method does not 38 <li>The <code>eval()</code> method does not
29 use an isolated world for the code being evaluated, so the JavaScript state 39 use an isolated world for the code being evaluated, so the JavaScript state
30 of the inspected window is accessible to the code. 40 of the inspected window is accessible to the code.
41 Use this method when access to the JavaScript state of the inspected page
42 is required.
43 </li><li>
44 The execution context of the code being evaluated includes the
45 <a href="http://code.google.com/chrome/devtools/docs/console.html">Developer
46 Tools console API</a>.
47 For example,
48 the code can use <code>inspect()</code> and <code>$0</code>.
31 </li><li> 49 </li><li>
32 The evaluated code may return a value that is passed to the extension callback. 50 The evaluated code may return a value that is passed to the extension callback.
33 The returned value has to be a valid JSON object (i.e. may contain only 51 The returned value has to be a valid JSON object (it may contain only
34 primitive JavaScript types and acyclic references to other JSON 52 primitive JavaScript types and acyclic references to other JSON
35 objects). 53 objects).
36 54
37 <em>Please observe extra care while processing the data received from the 55 <em>Please observe extra care while processing the data received from the
38 inspected page &mdash; the execution context is essentially controlled by the 56 inspected page &mdash; the execution context is essentially controlled by the
39 inspected page; a malicious page may affect the data being returned to the 57 inspected page; a malicious page may affect the data being returned to the
40 extension.</em> 58 extension.</em>
41 </li><li> 59 </li></ul>
42 The execution context of the code being evaluated includes the
43 <a href="http://code.google.com/chrome/devtools/docs/console.html">Developer
44 Tools console API</a> (e.g. <code>inspect()</code>, <code>$0</code> etc).
45 </li>
46 </ul>
47 <p class="caution"> 60 <p class="caution">
48 <strong>Important:</strong> 61 <strong>Important:</strong>
49 Due to the security considerations explained above, the 62 Due to the security considerations explained above, the
50 <a href="tabs.html#method-executeScript"><code 63 <a href="tabs.html#method-executeScript"><code
51 >chrome.tabs.executeScript()</code></a> method is the preferred way for an 64 >chrome.tabs.executeScript()</code></a> method is the preferred way for an
52 extension to access DOM data of the inspected page in cases where the access to 65 extension to access DOM data of the inspected page in cases where the access to
53 JavaScript state of the inspected page is not required.</em> 66 JavaScript state of the inspected page is not required.</em>
54 </p><p> 67 </p><p>
55 The <code>reload()</code> method may be used to reload the inspected page. 68 The <code>reload()</code> method may be used to reload the inspected page.
56 Additionally, the caller can specify an override for the user agent string, 69 Additionally, the caller can specify an override for the user agent string,
57 a script that will be injected early upon page load, and an option to force 70 a script that will be injected early upon page load, and an option to force
58 reload of cached resources. 71 reload of cached resources.
59 </p><p> 72 </p><p>
60 Use the <code>getResources()</code> call and the <code>onResourceContent</code> 73 Use the <code>getResources()</code> call and the <code>onResourceContent</code>
61 event to obtain the list of resources (documents, stylesheets, scripts, images 74 event to obtain the list of resources (documents, stylesheets, scripts, images
62 etc) within the inspected page. The <code>getContent()</code> and <code 75 etc) within the inspected page. The <code>getContent()</code> and <code
63 >setContent()</code> methods of the <code>Resource</code> class along with the 76 >setContent()</code> methods of the <code>Resource</code> class along with the
64 <code>onResourceContentCommitted</code> event may be used to support 77 <code>onResourceContentCommitted</code> event may be used to support
65 modification of the resource content, e.g. by an external editor. 78 modification of the resource content, for example, by an external editor.
66 </p> 79 </p>
67 80
68 <h2 id="overview-examples">Examples</h2> 81 <h2 id="overview-examples">Examples</h2>
69 <p>The following code checks for the version of jQuery used by the inspected 82 <p>The following code checks for the version of jQuery used by the inspected
70 page: 83 page:
71 84
72 <pre> 85 <pre>
73 chrome.experimental.devtools.inspectedWindow.eval( 86 chrome.experimental.devtools.inspectedWindow.eval(
74 "jQuery.fn.jquery", 87 "jQuery.fn.jquery",
75 function(result, isException) { 88 function(result, isException) {
76 if (isException) 89 if (isException)
77 console.log("the page is not using jQuery"); 90 console.log("the page is not using jQuery");
78 else 91 else
79 console.log("The page is using jQuery v" + result); 92 console.log("The page is using jQuery v" + result);
80 } 93 }
81 ); 94 );
82 </pre> 95 </pre>
83 96
84 <p> 97 <p>
85 You can find more examples that use Developer Tools APIs in 98 You can find more examples that use Developer Tools APIs in
86 <a href="samples.html#devtools">Samples</a>. 99 <a href="samples.html#devtools">Samples</a>.
87 </p> 100 </p>
OLDNEW
« no previous file with comments | « chrome/common/extensions/docs/experimental.devtools.inspectedWindow.html ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698