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 (2,946 forks)batch import
help wanted

Repository metrics

Stars
 (22,338 stars)
PR merge metrics
 (No merged PRs in 30d)

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