const skate = window.skate;

const h = skate.vdom.builder();

const [ img, em, div ] = skate.vdom.builder('img', 'em', 'div');

​

​

var element = {

  attached(el){

    console.log("hey")

  },

  render(el) {

    return [h('h1',el.innerHTML),

            h('div',h("slot",{

      onSlotchange: (e)=>{console.clear(); console.log("update slot",el.innerHTML)}

    }))]

  },

  rendered(el){

    console.log('rendered')

  }

}

​

​

skate.define('test-element', element);

​

var el = document.querySelector('test-element')

​

setTimeout(()=>{el.innerHTML = "<h1>what's</h1>"},1000)

setTimeout(()=>{el.innerHTML = "<h1>going</h1>"},2000)

setTimeout(()=>{el.innerHTML = "<h1>on</h1>"},3000)

setTimeout(()=>{el.innerHTML = "abc"},4000)

setTimeout(()=>{el.innerHTML = "defg"},5000)

setTimeout(()=>{el.innerHTML = "hijk"},6000)

setTimeout(()=>{el.innerHTML = "lmnop\n qrs"},7000)

setTimeout(()=>{el.innerHTML = "tuv\n wxyz"},8000)

setTimeout(()=>{el.innerHTML = "<h3>for some reason, the slotupdate event isn't getting fired on text changes in Chromium 53.0.2785.143</h3>"},9000)

​