Delayed image issue

Trying to reproduce the issue where an image is being blocked loading by an ajax call

by pvanhouten

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.3.0/knockout-debug.js"></script>
<test></test>

JavaScript

ko.components.register("test", {
    viewModel: function () {},
    template: "<image></image>"
});
ko.components.register("image", {
    viewModel: function (params) {
        var init = function () {
            console.log("init");
            $.ajax({
                url: '/echo/json/',
                data: {
                    delay: 5
                },
                crossDomain: true,
                contentType: "application/json",
                method: "POST",
                dataType: "json",
                beforeSend: function (xhr) {
                    xhr.setRequestHeader("X-CustomHeader", "Value");
                }
            }).done(function () {
                console.log("done");
            }).always(function () {
                console.log("always");
            });
            console.log("init complete");
        };
        
        init();
    },
    template: "testing<br /><img src='http://wakeupandcode.com/wp-content/uploads/2013/03/knockoutjs1.png' />"
});

var model = function () {
};

ko.applyBindings(new model());