Skip to content

Instantly share code, notes, and snippets.

@snc

snc/devtools-page.html

Created August 6, 2011 13:36
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save snc/1129343 to your computer and use it in GitHub Desktop.
Save snc/1129343 to your computer and use it in GitHub Desktop.
Download ZIP
Chrome Developer Tools Panel
Raw
devtools-page.html
<!doctype html>
<html>
<head>
<script>
(function(dt) {
var requestUrl;
dt.panels.create("Panel", "logo_24.png", "panel.html");
dt.resources.onNavigated.addListener(function(url) {
requestUrl = url;
});
dt.resources.onFinished.addListener(function(resource) {
if (resource.request.url === requestUrl) {
// TODO handle request, communicate with panel.html to modify its content
}
});
})(chrome.experimental.devtools);
</script>
</head>
<body>
</body>
</html>
Raw
manifest.json
{
"name": "Panel",
"version": "1.0",
"minimum_chrome_version": "10.0",
"description": "Panel",
"icons": {
"24": "logo_24.png",
"32": "logo_32.png",
"64": "logo_64.png",
"128": "logo_128.png"
},
"permissions": [
"experimental",
"tabs",
"http://*/*",
"https://*/*"
],
"devtools_page": "devtools-page.html"
}
Raw
notes.txt
How can I call code or modify the panel content from within the devtools-page.html?
Raw
panel.html
<!doctype html>
<html>
<head>
<script>
(function() {
// some code
})();
</script>
</head>
<body>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment