simbathesailor
diff --git a/‎README.md
+10-2 b/‎README.md
+10-2
diff --git a/‎contentScripts/main.js
+1-1 b/‎contentScripts/main.js
+1-1
diff --git a/‎devtools.js b/‎devtools.js
diff --git a/‎devtools.css ‎devtools/devtools.css b/‎devtools.css ‎devtools/devtools.css
diff --git a/‎devtools.html ‎devtools/devtools.html b/‎devtools.html ‎devtools/devtools.html
diff --git a/‎devtools/devtools.js
+28 b/‎devtools/devtools.js
+28
diff --git a/‎devtools/sidebar.html
+12 b/‎devtools/sidebar.html
+12
diff --git a/‎manifest.json
+1-1 b/‎manifest.json
+1-1
@@ -119,6 +119,10 @@ Life time of extension can be seen , by looking at task managers
 
 For last minute cleanup, similar to useEffect return statments , make use of below code
 
+## Very great set of boilerplate
+
+https://github.com/googlearchive/devtools-extension-boilerplate
+
 ```js
 chrome.runtime.onSuspend.addListener(function () {
   console.log("Unloading.");
@@ -129,6 +133,12 @@ chrome.runtime.onSuspend.addListener(function () {
 manifest is verry very important to get it right:
 https://developer.chrome.com/extensions/manifest
 
+## Devtools:
+
+https://developer.chrome.com/extensions/devtools_panels
+
+Each extension panel and sidebar is displayed as a separate HTML page. All extension pages displayed in the Developer Tools window have access to all modules in chrome.devtools API, as well as to chrome.extension API. Other extension APIs are not available to the pages within Developer Tools window, but you may invoke them by sending a request to the background page of your extension, similarly to how it's done in the content scripts.
+
 Video Link:
 
 https://www.youtube.com/watch?v=YQnRSa8MGwM
@@ -141,5 +151,3 @@ https://www.youtube.com/watch?v=YQnRSa8MGwM
 "js": ["pages/suspendedpage.js"]
 }
 ]
-
-Manifers
 
@@ -1,4 +1,4 @@
-let limit = 10 * 1000000000000000000; // in seconds
+let limit = 10000000000000000000; // in seconds
 
 console.log("some value");
 
 
@@ -0,0 +1,28 @@
+/**
+ * Code to generate a devtool panel
+ */
+
+chrome.devtools.panels.create(
+  "Test Panel ",
+  "images/get_started16.png",
+  "devtools/devtools.html",
+  function (panel) {
+    // code invoked on panel creation
+
+    console.log(panel, "panel got created");
+  }
+);
+
+/**
+ * [createSidebarPane description]
+ *
+ * @return  {[type]}  [return description]
+ * Code to generate the side panel in elements tabs
+ */
+chrome.devtools.panels.elements.createSidebarPane(
+  "Test Panel SideBar",
+  function (sidebar) {
+    sidebar.setPage("devtools/sidebar.html");
+    sidebar.setHeight("8ex");
+  }
+);
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <!-- <link rel="stylesheet" href="devtools.css" /> -->
+  </head>
+  <body>
+    <div id="buttonDiv"></div>
+    <div>
+      <p>I am side bar</p>
+    </div>
+  </body>
+</html>
@@ -42,7 +42,7 @@
 
   "content_security_policy": "object-src 'self'; child-src 'self'; default-src 'self';",
   "options_page": "options.html",
-  "devtools_page": "devtools.html",
+  "devtools_page": "devtools/devtools.html",
   "content_scripts": [
     {
       "matches": ["https://developer.chrome.com/*"],
Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-let limit = 10 * 1000000000000000000; // in seconds`
	`1`	`+let limit = 10000000000000000000; // in seconds`
`2`	`2`
`3`	`3`	`console.log("some value");`
`4`	`4`
Original file line number	Diff line number	Diff line change
`@@ -42,7 +42,7 @@`
`42`	`42`
`43`	`43`	`"content_security_policy": "object-src 'self'; child-src 'self'; default-src 'self';",`
`44`	`44`	`"options_page": "options.html",`
`45`		`- "devtools_page": "devtools.html",`
	`45`	`+ "devtools_page": "devtools/devtools.html",`
`46`	`46`	`"content_scripts": [`
`47`	`47`	`{`
`48`	`48`	`"matches": ["https://developer.chrome.com/*"],`