I try to develop javascript codes that can give users a warning when the server too long to response the html form submitted. My codes works well in Chrome and Firefox desktop browser, but not in Safari desktop browser.
How to make this works in Safari ? Here are my codes:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<script type="text/javascript">
function handleTimeout() {
document.getElementById("retryButton").disabled = false;
document.getElementById("message").innerHTML = "Your card's bank 3DS OTP page might be having issue. Please \"Tap to retry\".";
}
function retry() {
setTimeout(handleTimeout, 5000);
submitForm();
}
function submitForm() {
return new Promise(function(resolve, reject) {
document.getElementById('requestForm').submit();
resolve("done");
});
}
function start() {
document.getElementById("retryButton").disabled = true;
setTimeout(handleTimeout, 5000);
submitForm();
}
window.addEventListener('load', (event) => {
start();
});
</script>
</head>
<body>
<form id="requestForm" method="post" action="http://localhost:10877/auth/pareq">
<input type="hidden" name="PaReq" value="eyJ2ZXJzaW9uIjoiMS4wLjIiLC"/>
<input type="hidden" name="uuid" value="ac456037-995b-4778-bba5-df614db7ebaa"/>
<input type="hidden" name="Status" value="Y"/>
</form>
<div id="message">Processing OTP</div>
<p>Tap the button below to Retry</p><br/>
<button id="retryButton" onclick="retry();">Tap to retry</button>
</body>
</html>
Function handleTimeout() is not working in Safari but works well in Chrome and Firefox browser.
How to make function handleTimeout() works well in Safari?