Vuejs jQuery sortable example

HTML

<script src="http://rubaxa.github.io/Sortable/Sortable.js"></script>
<h2>Reproduction</h2>
<ol>
    <li>Click add row</li>
    <li>Drag topmost item (item 1) below last item (item 2)</li>
    <li>Repeat previous step. Verify <code>&lt;!-- v-repeat--&gt;</code> comment now appears above first list item</li>
    <li>Repeat one more time</li>
    <li>Verify console error: <code>Uncaught TypeError: Cannot read property '__vue__' of null</code></li>
</ol>

 <div id="ex-sortable">    
    <div v-component="my-sortable" v-with="model: list"></div>
    <button v-on="click: add">Add row</button>
    
    <pre>{{log.message}}</pre>
</div>

<script type="text/x-template" id="sort-template">
    <ul>
        <li v-repeat="model" data-id="{{$index}}">{{$value}}</li>
    </ul>
</script>

CSS

ul {
    list-style: none;
    padding: 0;
    margin: 30px;
}

ul li {
    padding: 10px;
    display: block;
    background: #EFEFEF;
    border: solid 1px #CCC;
    margin-bottom: 5px;
}

JavaScript

var list =  ['Item 1'];
var log = { message: '' }
var index = 1;


Vue.component('my-sortable', {
    template: "#sort-template",
    ready: function (value) {
        var el = this.$el.firstChild;
        
        Sortable.create(el, {
            draggable: 'li',
            onEnd: function () {
                var comment = el.firstChild;
                do {
                    if (comment.nodeType == 8) {
                        console.log('!!!!');
                        el.removeChild(comment);
                        el.appendChild(comment);
                    }
                } while (comment = comment.nextSibling);
            },
            onUpdate: function(e) {
                var oldPosition = e.item.getAttribute('data-id');
                var newPosition = this.toArray().indexOf(oldPosition);
                log.message = "Moving " + oldPosition + " to " + newPosition;
                list.splice(newPosition, 0, list.splice(oldPosition, 1)[0]);
            }
        });          
    }
});

new Vue({
    el: '#ex-sortable',
    data: {
        list: list,
        log: log
    },
    methods: {
        add: function() {
            list.push('Item ' + (++index));
        }
    }
});