node with v-show inside v-if is reused in the adjacent v-else

[dolymood]

Vue.js version

2.1.6

Reproduction Link

http://codepen.io/dolymood/pen/gLQmwy

Steps to reproduce

Code

<div class="el el-if" v-if="bln"><span v-show="false">hidden content</span></div>
<div class="el el-else" v-else><span @click="toggle">visible  content</span></div>

1. bln=true, the span element in el-if is hidden

2. bln=false, the span element in el-else is hidden

What is Expected?

When bln=false, the span element should be visible

What is actually happening?

patchVnode will check the nodes is same:

function sameVnode (vnode1, vnode2) {
  return (
    vnode1.key === vnode2.key &&
    vnode1.tag === vnode2.tag &&
    vnode1.isComment === vnode2.isComment &&
    !vnode1.data === !vnode2.data
  )
}

Because the old vnode vnode1.data is

{
  directives: [{
     def: {bind: fn, update: fn}
     expression: "false"
     modifiers: {},
     name: "show",
     rawName: "v-show",
     value: false
  }]
}

and the new vnode vnode2.data is

{
  on: {click: fn}
}

So sameVnode(span1, span2) result is true, but updateDirectives will be call v-show directive's unbind hook function.

If the span elements have different key attributes, the result will be correct. But i think it will be better if:

When bln=false, the span element should be visible

[defcc]

Thanks, I'm looking into it.

[dolymood]

👍 Thanks