Mercury bug with vtree/vdom 0.0.21

index.js

// This code demonstrates a bug in mercury using vdom/vtree version 0.0.21
// After the page loads, open your dev console, and run showRed(). You can
// examine the datasets given to the boxes using getRedData or getGreenData.
// After running showRed() and letting it render, run hideRed()
//
// You can click the green box at this point, and see that it logs
// "I'm a red box" to the console, having been assigned the red boxes
// event when the red box was removed.

var h = require('mercury').h
var hg = require('mercury')
var events = hg.input(['red'])
var DataSet = require('data-set')

var redHandler = function(fn, value) {
  if (!(this instanceof redHandler)) {
    return new redHandler(fn, value)
  }
  this.fn = fn
  this.value = value || {}
  return this
}

redHandler.prototype.handleEvent = function(ev) {
  this.fn({data: this.value, ev: ev })
  return this
}

events.red = function(data) {
  console.log("I'm a red box")
}
var App = {
  init: function() {
    this.state = hg.struct({ app: hg.struct({ showRed: hg.value(0) }) }); 
    return this.state 
  },

  render: function(state) {
    return h('div#main', [buildView(state.app.showRed)]) 
  }
}

var buildView = function(showRed) {
  console.log('build view')
  var inner = []
  if (showRed) {
    inner.push(h("div.redBox", {id: "redBox", name: "my-red-box", style: { "backgroundColor": '#FF0000', width: "200px", height: "200px" }, "data-color": "red", "ev-mousedown": redHandler(events.red)} , null))
  }
  inner.push(h("div.greenBox", {id: "greenBox", style: { "backgroundColor": '#00FF00', width: "200px", height: "200px" }, "data-color": "green"}, null))
  return h('div.boxContainer', {style: {height: "400px", width: "200px"}}, inner)
}


window.showRed = function() {
  App.state.app.showRed.set(1)
}

window.hideRed = function() {
  App.state.app.showRed.set(0)
}

window.getRedData = function() {
  return DataSet(document.getElementById('redBox'))
}

window.getGreenData = function() {
  return DataSet(document.getElementById('greenBox'))
}

hg.app(document.body, App.init(), App.render)