Invisible Recaptcha expiration error - recaptcha

Question

am facing a weird issue with Invisible recaptcha. After 2 minutes when Recaptcha is getting expired its throwing script error "Object not found". Even tried using WidgetID but showing the same behavior. The only difference is I have an extra step in between the Recaptcha submit and my form submit. After successful recaptcha Submit on a button click a Pop up div opens on the page and the final submit happens on the click of pop up div submit button. All the submit process is working properly but when captcha expires in case form is left as idle for more than 2 minutes over the pop up div then it throws the error. Below is the code snippet:
<div>
<div>
...................
<div class="form__group">
<label class="text captcha"></label>
<div class="g-recaptcha" data-badge="inline" data-sitekey="{$CaptchaWebsiteKey}" data-size="invisible" data-expired-callback="validateExpire" data-callback="onSubmit"></div>
</div>
<div class="form__group">
<input id="btnPopUp" type="submit" class="btn btn--primary btn--full btn--xs-full" value="Submit your details"/>
</div>
</div>
</div>
<div id="modal" style="visibility:hidden;" class="modal">
<div class="modal-content">
<div class="modal-space">
...................
<div class="modal-space1">
<input type="submit" id="btnSubmit" value="Submit" class="modal-btn modal-space2 btn btn--primary btn--xs-full" disabled="true"/>
<input type="submit" value="Cancel" onclick="return closePopup();" class="modal-btn modal-space2 btn btn--primary btn--xs-full" />
</div>
</div>
</div>
</div>
<div class="overlay"></div>
<script language="javascript" type="text/javascript">
onload();
function onload() {
var element = document.getElementById('btnPopUp');
element.onclick = validate;
}
var captchaResponse='';
function onSubmit(response){
captchaResponse = response;
openPopup();
}
function validateExpire() {
grecaptcha.reset();
captchaResponse='';
}
</script>
Can anyone help regarding this issue? Thanks in advance.