fix(background.js) destroy child scopes

Destroyed scopes were not being removed from the scope tree. The
background.js and inspectedApp code that handled the scope:destroy
message was buggy, referencing undefined variables and also not
tracking the descendants of the destroyed scopes. This code fixes both
issues. All descendants are now present on the scope:destroy message
broadcast throughout batarang. This should help clean up further tech
debt in future.

Author: gary-b

background.js

@@ -17,7 +17,7 @@ function bufferOrForward(message, sender) {
   }
 
   if (message !== 'refresh') {
-    setIsHintFlag(message);
+    addMessageHelperProperties(tabId, message);
     bufferData(tabId, message);
   }
   if (devToolsPort) {
@@ -32,14 +32,29 @@ function resetState(tabId) {
   };
 }
 
-function setIsHintFlag(message) {
+function addMessageHelperProperties(tabId, message) {
+  var scopes = data[tabId].scopes;
   var hintables = [
     'Controllers',
     'general',
     'Modules',
     'Events'
   ];
   message.isHint = (hintables.indexOf(message.module) > -1);
+
+  if(message.event === 'scope:destroy'){
+    message.data.subTree = getSubTree(scopes, message.data.id);
+  }
+}
+
+function getSubTree(scopes, id){
+  var subTree = [id], scope;
+  for(var i = 0; i < subTree.length; i++) {
+    if(scope = scopes[subTree[i]]) {
+      subTree.push.apply(subTree, scope.children);
+    }
+  }
+  return subTree;
 }
 
 function bufferData(tabId, message) {
@@ -62,9 +77,12 @@ function bufferData(tabId, message) {
   } else if (message.data.id && (scope = tabData.scopes[message.data.id])) {
     if (message.event === 'scope:destroy') {
       if (scope.parent) {
-        scope.parent.children.splice(scope.parent.children.indexOf(child), 1);
+        var parentScope = tabData.scopes[scope.parent];
+        parentScope.children.splice(parentScope.children.indexOf(message.data.id), 1);
+      }
+      for(var i = 0; i < message.data.subTree.length; i++){
+        delete tabData.scopes[message.data.subTree[i]];
       }
-      delete scopes[message.data.id];
     } else if (message.event === 'model:change') {
       scope.models[message.data.path] = (typeof message.data.value === 'undefined') ?
                                             undefined : message.data.value;

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

@@ -92,9 +92,12 @@ function inspectedAppService($rootScope, $q) {
         var scope = scopes[message.data.id];
         if (message.event === 'scope:destroy') {
           if (scope.parent) {
-            scope.parent.children.splice(scope.parent.children.indexOf(child), 1);
+            var parentScope = scopes[scope.parent];
+            parentScope.children.splice(parentScope.children.indexOf(message.data.id), 1);
+          }
+          for(var i = 0; i < message.data.subTree.length; i++){
+            delete scopes[message.data.subTree[i]];
           }
-          delete scopes[message.data.id];
         } else if (message.event === 'model:change') {
           scope.models[message.data.path] = (typeof message.data.value === 'undefined') ?
                                                 undefined : JSON.parse(message.data.value);

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

@@ -68,15 +68,37 @@ describe('inspectedApp', function() {
       expect(inspectedApp.scopes[id]).toEqual({ parent: parentId, children: [], models: {} });
     });
 
+    it('should track destruction of scopes', function () {
+      var id = 2, parentId = 1;
+      inspectedApp.scopes[id] = { parent: parentId };
+      inspectedApp.scopes[parentId] = {
+        children: [ 99, id, 100 ]
+      };
+      triggerAndFlush({ event: 'scope:destroy', data: { id: id, subTree: [id] } });
+
+      expect(inspectedApp.scopes.hasOwnProperty(id)).toBeFalsy();
+      expect(inspectedApp.scopes[parentId].children).toEqual([99, 100]);
+    });
+
     it('should track destruction of scopes without throwing error when parent scope not present', function () {
       var id = 1;
       inspectedApp.scopes[id] = true;
-      port.onMessage.trigger({ event: 'scope:destroy', data: { id: id } });
+      port.onMessage.trigger({ event: 'scope:destroy', data: { id: id, subTree: [id] } });
 
       expect($browser.defer.flush).not.toThrow();
       expect(inspectedApp.scopes.hasOwnProperty(id)).toBeFalsy();
     });
 
+    it('should delete subtree of destroyed scope', function () {
+      inspectedApp.scopes[1] = true;
+      inspectedApp.scopes[2] = true;
+      inspectedApp.scopes[3] = true;
+      inspectedApp.scopes[4] = true;
+
+      triggerAndFlush({ event: 'scope:destroy', data: { id: 1, subTree: [1, 3, 4] } });
+      expect(inspectedApp.scopes).toEqual({2: true});
+    });
+
     it('should track model changes', function () {
       var id = 1;
       inspectedApp.scopes[id] = { models: {} };