feat(instrumentation): do not enable by default

inject.js

@@ -1,20 +1,26 @@
-var html = document.getElementsByTagName('html')[0];
+if (document.cookie.indexOf('__ngDebug=true') != -1) {
+  bootstrapHint();
+}
 
-var eventProxyElement = document.createElement('div');
-eventProxyElement.id = '__ngBatarangElement';
-eventProxyElement.style.display = 'none';
-html.appendChild(eventProxyElement);
+function bootstrapHint () {
+  var html = document.getElementsByTagName('html')[0];
 
-// inject into the application context from the content script context
+  var eventProxyElement = document.createElement('div');
+  eventProxyElement.id = '__ngBatarangElement';
+  eventProxyElement.style.display = 'none';
+  html.appendChild(eventProxyElement);
 
-var script = window.document.createElement('script');
-script.src = chrome.extension.getURL('dist/hint.js');
+  // inject into the application context from the content script context
 
-eventProxyElement.addEventListener('batarangDataEvent', function () {
-  var eventData = eventProxyElement.innerText;
-  chrome.extension.sendMessage(eventData);
-});
+  var script = window.document.createElement('script');
+  script.src = chrome.extension.getURL('dist/hint.js');
 
-html.setAttribute('ng-hint', '');
+  eventProxyElement.addEventListener('batarangDataEvent', function () {
+    var eventData = eventProxyElement.innerText;
+    chrome.extension.sendMessage(eventData);
+  });
 
-html.appendChild(script);
+  html.setAttribute('ng-hint', '');
+
+  html.appendChild(script);
+}

panel/components/inspected-app/inspected-app.js

@@ -21,6 +21,14 @@ function inspectedAppService($rootScope) {
     return invokeAngularHintMethod('assign', scopeId, path, value);
   };
 
+  this.enableInstrumentation = function (setting) {
+    setting = !!setting;
+    chrome.devtools.inspectedWindow.eval(
+      "window.document.cookie = '__ngDebug=" + setting + ";';" +
+      "window.document.location.reload();"
+    );
+  };
+
   /*
    * sets window.$scope to the scope of the given id
    */

panel/components/tabs/tabs.html

@@ -8,6 +8,16 @@
       sidebar"
     style="width: 200px;">
       <ol class="sidebar-tree" tabindex="0">
+        <li class="sidebar-tree-item
+                   profile-launcher-view-tree-item">
+            <img class="icon">
+            <div class="status"></div>
+            <div class="titles no-subtitle">
+              <span class="title ng-binding">Enable <input type="checkbox" ng-model="enabled"></span>
+              <span class="subtitle"></span>
+            </div>
+
+        </li>
         <li ng-repeat="pane in panes"
           ng-click="select(pane)"
           class="sidebar-tree-item

panel/components/tabs/tabs.js

@@ -1,6 +1,6 @@
 angular.module('batarang.tabs', []).
 
-directive('batTabs', function ($compile, $templateCache, $http) {
+directive('batTabs', function ($compile, $templateCache, $http, inspectedApp) {
   return {
     restrict: 'E',
     transclude: true,
@@ -14,6 +14,12 @@ directive('batTabs', function ($compile, $templateCache, $http) {
       this.addPane = function(pane) {
         panes.push(pane);
       };
+
+      $scope.$watch('enabled', function (newVal) {
+        if (newVal === !!newVal) {
+          inspectedApp.enableInstrumentation(newVal);
+        }
+      });
     },
     link: function (scope, element, attr) {