t4t5/sweetalert

Edge: Icon doesn't animate when firing promise while rendering

Open

#716 opened on Sep 8, 2017

View on GitHub
 (3 comments) (1 reaction) (0 assignees)TypeScript (22,338 stars) (2,946 forks)batch import
help wanted

Description

This seems to be a MS Edge problem only. I have a confirmation alert that fires a function to restore a user. When the restore function receives a successful response from the server, I want to display a success alert while simultaneously fetching updated data from the server to refresh my view with in the background; however, the success icon animation stops as soon as I call my ajax function to fetch the new data.

            swal({
                title: 'Restore',
                text: 'Are you sure you want to restore this user?',
                icon: 'warning',
                buttons: {
                    cancel: {
                        closeOnClickOutside: false,
                        text: "Cancel",
                        value: false,
                        visible: true,
                        className: "",
                        closeModal: true
                    },
                    confirm: {
                        text: "Confirm",
                        value: true,
                        visible: true,
                        className: "btn-danger",
                        closeModal: true
                    }
                }
            }).then(confirmation => {
                if (confirmation) {
                    this.users[index].restore().done(() => {
                        swal({
                            closeOnClickOutside: false,
                            title: 'Success',
                            text: 'The user has been restored!',
                            icon: 'success',
                            buttons: {
                                confirm: {
                                    text: "Confirm",
                                    value: true,
                                    visible: true,
                                    className: "btn-success",
                                    closeModal: true
                                }
                            }
                        });
                        this.fetch(); // This Ajax function causes the animation to stop
                } else {
                    swal({
                        closeOnClickOutside: false,
                        title: 'Cancelled',
                        text: 'The user has not been restored!',
                        icon: 'error'
                    });
                }
            });

Contributor guide