Fix keep-alive components weird issue

__tests__/renderer/ViewNode.test.js

@@ -241,6 +241,8 @@ describe('ViewNode', () => {
     expect(prevChildNode.nextSibling).toEqual(nextChildNode)
     expect(nextChildNode.prevSibling).toEqual(prevChildNode)
     expect(childNode.parentNode).toBeNull()
+    expect(childNode.prevSibling).toBeNull()
+    expect(childNode.nextSibling).toBeNull()
   })
 
   test('nativeView can be set once', () => {

platform/nativescript/renderer/ViewNode.js

@@ -246,6 +246,12 @@ export default class ViewNode {
       childNode.nextSibling.prevSibling = childNode.prevSibling
     }
 
+    // reset the prevSibling and nextSibling. If not, a keep-alived component will
+    // still have a filled nextSibling attribute so vue will not
+    // insert the node again to the parent. See #220
+    childNode.prevSibling = null
+    childNode.nextSibling = null
+
     this.childNodes = this.childNodes.filter(node => node !== childNode)
 
     viewUtil.removeChild(this, childNode)

platform/nativescript/runtime/node-ops.js

@@ -41,19 +41,19 @@ export function appendChild(node, child) {
 }
 
 export function parentNode(node) {
-  trace(`ParentNode(${node})`)
+  trace(`ParentNode(${node}) -> ${node.parentNode}`)
 
   return node.parentNode
 }
 
 export function nextSibling(node) {
-  trace(`NextSibling(${node})`)
+  trace(`NextSibling(${node}) -> ${node.nextSibling}`)
 
   return node.nextSibling
 }
 
 export function tagName(elementNode) {
-  trace(`TagName(${elementNode})`)
+  trace(`TagName(${elementNode}) -> ${elementNode.tagName}`)
 
   return elementNode.tagName
 }

samples/app/220.js

@@ -5,14 +5,12 @@ Vue.config.silent = false
 
 const CompButton = {
   template: `
-    <Button @tap="counter++">{{label}}: {{counter}}</Button>
+    <Button>{{label}}: {{counter}}</Button>
   `,
   name: 'CompButton',
-  props: ['label'],
-  data() {
-    return {
-      counter: 0
-    }
+  props: ['label', 'counter'],
+  destroyed() {
+    console.log('Component destroyed. This should not happen')
   }
 }
 
@@ -27,8 +25,8 @@ new Vue({
         <StackLayout>
           <Button @tap="counter++">{{counter}}</Button>
           <keep-alive>
-            <CompButton v-if="counter % 2" key="odd" label="Odd" />
-            <CompButton v-else key="even" label="Even" />
+            <CompButton v-if="counter % 2" key="odd" label="Odd" :counter="counter" />
+            <CompButton v-else key="even" label="Even" :counter="counter" />
           </keep-alive>
         </StackLayout>
       </Page>