"Uncaught (in promise) TypeError: Cannot set property 'className' of undefined"

[countryroadgraphics]

Getting this error when calling SWAL inside .then() after an ajax call. Using v 6.2.3.

Here's the code in question

swal({
  input: 'text',
    allowOutsideClick: false,
    showCancelButton: false,
    confirmButtonText: 'Verify!',
    title: 'Reference Number',
    allowEscapeKey: false,
    showLoaderOnConfirm: true,
    html:
    '<p>One or more products in your cart require a reference number. Please provide the reference number in order to continue.</p>',               
    preConfirm: function(reference) {
        return new Promise(function(resolve, reject) {
            $.ajax({
                type: 'POST',
                url: ajaxUrl,
                data: {
                    action: 'verify_reference_number',
                    reference: reference,
                    nonce: lifex.nonce
                },
                cache: false,
                success: function(data) {
                    var scan = JSON.parse(data);
                    resolve(scan);
                },
                error:function (xhr, ajaxOptions, thrownError){                               
                    reject(xhr.responseText);
                }
            });
        });
    }
}).then(function(scan){
   swal({
        title: "Is this correct?",
        allowOutsideClick: false,
        showCancelButton: true,
        confirmButtonText: 'Correct!',
        html: '<p> ' +
        'Provider: ' + scan.wholesaler + '<br>' +
        'Name: ' + scan.name + '<br>' +
        'Reference: ' + scan.reference + '<br>' +
        '</p>',
    });
}).catch(swal.noop);

[countryroadgraphics]

sweetalert2.js?ver=6.2.3:1383 Uncaught (in promise) TypeError: Cannot set property 'className' of undefined at sweetalert2.js?ver=6.2.3:1383 at modalDependant (sweetalert2.js?ver=6.2.3:958) at sweetAlert (sweetalert2.js?ver=6.2.3:1545)

This appears to happen as soon as the second SWAL call is made after the first promise is resolved via ajax.

[countryroadgraphics]

Just tried in a fiddle and appeared to work. Will check if there is a conflict with other scripts.

As a side note, the second SWAL does load and display the info, however the .then() function never fires for it.

[limonte]

reopen with jsfiddle if needed

[bdourado]

Add the sweet alert in a timeout:

}).then(function(scan){
   setTimeout(()=> {
     swal({
          title: "Is this correct?",
          allowOutsideClick: false,
          showCancelButton: true,
          confirmButtonText: 'Correct!',
          html: '<p> ' +
          'Provider: ' + scan.wholesaler + '<br>' +
          'Name: ' + scan.name + '<br>' +
          'Reference: ' + scan.reference + '<br>' +
          '</p>',
      });
    }, 200);
}).catch(swal.noop);