destroy children

Author: Evan You

src/compiler.js

@@ -30,9 +30,12 @@ var Emitter     = require('./emitter'),
 function Compiler (vm, options) {
 
     var compiler = this
-    // indicate that we are intiating this instance
-    // so we should not run any transitions
-    compiler.init = true
+
+    // default state
+    compiler.init       = true
+    compiler.repeat     = false
+    compiler.destroyed  = false
+    compiler.delayReady = false
 
     // process and extend options
     options = compiler.options = options || makeHash()
@@ -55,7 +58,7 @@ function Compiler (vm, options) {
     compiler.deferred = []
     compiler.exps = []
     compiler.computed = []
-    compiler.childCompilers = []
+    compiler.children = []
     compiler.emitter = new Emitter()
     compiler.emitter._ctx = vm
     compiler.delegators = makeHash()
@@ -71,7 +74,7 @@ function Compiler (vm, options) {
         childId = utils.attr(el, 'ref')
     if (parentVM) {
         compiler.parent = parentVM.$compiler
-        parentVM.$compiler.childCompilers.push(compiler)
+        parentVM.$compiler.children.push(compiler)
         def(vm, '$parent', parentVM)
         if (childId) {
             compiler.childId = childId
@@ -254,7 +257,7 @@ CompilerProto.setupObserver = function () {
     }
 
     function broadcast (event) {
-        var children = compiler.childCompilers
+        var children = compiler.children
         if (children) {
             var child, i = children.length
             while (i--) {
@@ -806,7 +809,9 @@ CompilerProto.destroy = function () {
         directives  = compiler.dirs,
         exps        = compiler.exps,
         bindings    = compiler.bindings,
-        delegators  = compiler.delegators
+        delegators  = compiler.delegators,
+        children    = compiler.children,
+        parent      = compiler.parent
 
     compiler.execHook('beforeDestroy')
 
@@ -847,13 +852,17 @@ CompilerProto.destroy = function () {
         el.removeEventListener(key, delegators[key].handler)
     }
 
+    // destroy all children
+    i = children.length
+    while (i--) {
+        children[i].destroy()
+    }
+
     // remove self from parent
-    var parent = compiler.parent,
-        childId = compiler.childId
     if (parent) {
-        parent.childCompilers.splice(parent.childCompilers.indexOf(compiler), 1)
-        if (childId) {
-            delete parent.vm.$[childId]
+        parent.children.splice(parent.children.indexOf(compiler), 1)
+        if (compiler.childId) {
+            delete parent.vm.$[compiler.childId]
         }
     }
 

src/emitter.js

@@ -1,4 +1,6 @@
-function Emitter () {}
+function Emitter () {
+    this._ctx = this
+}
 
 var EmitterProto = Emitter.prototype,
     slice = [].slice
@@ -63,7 +65,7 @@ Emitter.prototype.emit = function(event){
     if (callbacks) {
         callbacks = callbacks.slice(0)
         for (var i = 0, len = callbacks.length; i < len; i++) {
-            callbacks[i].apply(this._ctx || this, args)
+            callbacks[i].apply(this._ctx, args)
         }
     }
 

src/viewmodel.js

@@ -83,7 +83,7 @@ def(VMProto, '$destroy', function () {
  *  broadcast an event to all child VMs recursively.
  */
 def(VMProto, '$broadcast', function () {
-    var children = this.$compiler.childCompilers,
+    var children = this.$compiler.children,
         i = children.length,
         child
     while (i--) {

test/unit/specs/api.js

@@ -635,22 +635,28 @@ describe('UNIT: API', function () {
             })
 
             describe('parent', function () {
+
+                var parent, child
 
-                it('should create parent-child relation between VMs', function () {
-                    
-                    var parent = new Vue({
+                it('should allow child to access parent bindings', function () {
+
+                    parent = new Vue({
                         data: {
                             test: 'from parent'
                         }
                     })
 
-                    var child = new Vue({
+                    child = new Vue({
                         parent: parent,
                         template: '{{test}}'
                     })
 
                     assert.strictEqual(child.$el.textContent, 'from parent')
 
+                })
+
+                it('should allow event communication between parent and child', function () {
+                    
                     var dispatched = false,
                         broadcasted = false
                     parent.$on('dispatch', function () {
@@ -667,6 +673,13 @@ describe('UNIT: API', function () {
 
                 })
 
+                it('should destroy the child when parent is destroyed', function () {
+                    
+                    parent.$destroy()
+                    assert.ok(child.$compiler.destroyed)
+
+                })
+
             })
 
             describe('directives', function () {

test/unit/specs/viewmodel.js

@@ -457,8 +457,9 @@ describe('UNIT: ViewModel', function () {
             }],
             bindings: bindingsMock,
             childId: 'test',
+            children: [],
             parent: {
-                childCompilers: [],
+                children: [],
                 vm: {
                     $: {
                         'test': true
@@ -487,7 +488,7 @@ describe('UNIT: ViewModel', function () {
             }
         }
 
-        compilerMock.parent.childCompilers.push(compilerMock)
+        compilerMock.parent.children.push(compilerMock)
 
         destroy.call(compilerMock)
 
@@ -523,7 +524,7 @@ describe('UNIT: ViewModel', function () {
 
         it('should remove self from parent', function () {
             var parent = compilerMock.parent
-            assert.ok(parent.childCompilers.indexOf(compilerMock), -1)
+            assert.ok(parent.children.indexOf(compilerMock), -1)
             assert.strictEqual(parent.vm.$[compilerMock.childId], undefined)
         })