cpojer/main-panel.html

## main-panel.html
<!doctype html>
<html>
  <head>
    <style type="text/css">
      body {
        margin: 0;
      }

      iframe {
        bottom: 0;
        left: 0;
        position: absolute;
        right: 0;
        top: 0;
      }
    </style>
  </head>
  <body>
    <iframe src="/path/to/devtools" width="100%" height="100%" seamless></iframe>
  </body>
</html>

## main.html
<!doctype html>
<html>
  <head>
    <script type="text/javascript" src="main.js"></script>
  </head>
  <body>
  </body>
</html>

## main.js
function createMainPanel() {
  chrome.devtools.panels.create('My DevTools', 'icon.png', 'main-panel.html', function(panel) {});
}

createMainPanel();

## manifest.json
{
  "manifest_version": 2,
  "name": "My Devtools",
  "description": "Devtools.",
  "version": "0.0.1",
  "icons": {
    "48": "icons/icon48.png",
    "128": "icons/icon128.png"
  },
  "devtools_page": "main.html",
  "content_security_policy": "script-src 'self' 'unsafe-eval' https://some.domain; object-src 'self' https://some.domain",
  "permissions": ["https://*.some.domain/", "*://*/*"]
}
	<!doctype html>
	<html>
	<head>
	<style type="text/css">
	body {
	margin: 0;
	}

	iframe {
	bottom: 0;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	}
	</style>
	</head>
	<body>
	<iframe src="/path/to/devtools" width="100%" height="100%" seamless></iframe>
	</body>
	</html>
	function createMainPanel() {
	chrome.devtools.panels.create('My DevTools', 'icon.png', 'main-panel.html', function(panel) {});
	}

	createMainPanel();
	{
	"manifest_version": 2,
	"name": "My Devtools",
	"description": "Devtools.",
	"version": "0.0.1",
	"icons": {
	"48": "icons/icon48.png",
	"128": "icons/icon128.png"
	},
	"devtools_page": "main.html",
	"content_security_policy": "script-src 'self' 'unsafe-eval' https://some.domain; object-src 'self' https://some.domain",
	"permissions": ["https://.some.domain/", ":///"]
	}