nyxtom/reconcile.js

Ordering issue

Opened this issue · 0 comments

matthewma7 commented 
<html>

<head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src='reconcile.umd.js'></script>
</head>

<body>
    <div id='target'>
    </div>
    <script>
        var content1 = `
            <div>
                <div id="div1">abc</div>
                <div>123</div>
            </div>
        `;

        var content2 = `
            <div>
                <div>123</div>
                <div id="div1">xyz</div>
            </div>
        `;

        $el1 = $(content1);
        $el2 = $(content2);
        $target = $('#target');

        $el1.appendTo($target);

        setTimeout(() => {
            var changes = reconcile.diff($el2[0], $el1[0]);
            reconcile.apply(changes, $el1[0]);
        }, 2000);
    </script>
</body>
</html>

The xyz should come after 123, but it comes before 123 after applying the changes.