Sweet Alert selectors issue

[antonioaltamura]

I notice there is a little problem testing this workflow:

• click on a button that opens a Sweet Alert modal
• click on the confirm button
• now the "callback alert" appears, but I cannot use the same selectors to check the content of the modal as Cypress will refer to the previous modal which is now detatched.

context("Login", () => {
    before(() => {
        cy.visit("http://localhost")
    })

    it("Swal DOM check", () => {
        cy.get("button").click();
        cy.get(".swal2-title").contains("Are you sure?");
        cy.get(".swal2-confirm").click(); //confirm action


        // This won't work
        cy.get(".swal2-title").contains("Deleted"); 
        cy.get(".swal2-confirm").click(); //dismiss confirmation modal

    })

})

<script type="text/javascript" src="../node_modules/jquery/dist/jquery.js"></script>
<script type="text/javascript" src="../node_modules/sweetalert2/dist/sweetalert2.js"></script>
<link rel="stylesheet" href="../node_modules/sweetalert2/dist/sweetalert2.css">

<script>

    let remoteRequest = ms => new Promise(resolve => {
        setTimeout(() => resolve(), 1000);
    })

    function req() {
        Swal.fire({
            title: "Are you sure?",
            icon: "warning",
            showCancelButton: true,
        }).then(result => {
            if (result.value) {
                remoteRequest()
                    .then(response => {
                        Swal.fire(
                            "Deleted!",
                            "Entry has been correctly deleted.",
                            "success"
                        );
                    })
            }
        });
    }
</script>
<button onclick="req()">Request</button>