JSFiddle - React, Tailwind, and code Playground

by gRoberts

HTML

<script src="https://cdn.jsdelivr.net/npm/sweetalert2@8"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button>
  Click Me :)
</button>

<ul id="log">

</ul>

JavaScript

$(document).on('click', 'button', function() {
$('#log').append($('<li>Button clicked</li>'));
	Swal.fire({
  	title: 'Testing',
    input: 'text',
    showCancelButton: true,
    showLoaderOnConfirm: true,
    inputValidator: function() {
    	return new Promise(function(resolve) {
      	setTimeout(function() {
        	resolve();
        }, 4000);
      });
    },
    preConfirm: function(value) {
		$('#log').append($('<li>Initial Value: "' + value + '"</li>'));
    	return new Promise(function(resolve, reject) {
      	setTimeout(function() {
        	resolve(value);
        }, 10000);
      });
    }
  }).then(function(result) {
		$('#log').append($('<li>End Value: "' + result.value + '"</li>'));
  })
});