jQuery UI dialog stops resizing automatically after it has been dragged

I have a jQuery UI dialog which contains a form than can be expandable depending on the choices the user makes: http://i.imgur.com/KsskHBC.png.

For instance, if the user changes the "answer type" to numeric, content will be added to the dialog (or removed from it): http://i.imgur.com/qH3gmHP.png.

So if the user opens the dialog, makes choices that will expand the dialog without moving it, the dialog will resize normally, as you can see in the previous image. However, if the user drags the dialog and then makes choices that expands the dialog, it won't resize automatically as it should: http://i.imgur.com/0YEvD5t.png.

This is how I initialize my dialog:

var dialogToShow = isDeleteConfirmDialog ? $("#confirmDeleteDialog") : $("#customDialog");

dialogToShow.dialog({
    // autoResize: true, -- does not work neither
    resizable: false,
    title: "My title",
    modal: true,
    width: 'auto',
    height: 'auto',
    draggable: false,
    hide: { effect: 'scale', duration: 400 },
    open: function () {
        $('.ui-widget-overlay').bind('click', function () { dialogToShow.dialog('close'); });
    }
});
dialogToShow.parent().draggable();

I also tried setting the dialog's position to absolute, but it didn't change anything.

I made a JSFiddle to see if I could reproduce my issue and indeed I was able to: https://jsfiddle.net/BishopBarber/61jqhsgt/2/