Search code examples
javascriptes6-promiserecaptcha

Promise resolving once


Promise in my code is resolving only at first execution, it is simple form submission with reCAPTCHA verification. From debugging I know the browser interpreter reaches line with await captchaVerification() and stops there. First execution works without any errors.

contactForm.addEventListener('submit', async (e) => {
    e.preventDefault();
    await captchaVerification()
    const data = new FormData(contactForm)
    _alert.innerHTML = 'Sending message...'
    _alert.setAttribute('class', `alert show`);
    ajax(contactForm.method, contactForm.action, data)
        .then(([r, t]) => outcome(r ? r = 'success' : r = 'error', t))
        .catch(e => outcome('error', e))
});

Full context on hastebin: https://hastebin.com/oyuvoyeluv.js


Solution

  • For everyone wondering, this is the piece of code that solved my issue. Basically Google API does not allow user to render same captcha object on same HTML Element more than once. I solved it by dynamically creating HTML Element for my captcha and removing it after I receive the response from the Google API server-side verification (success/error).

    https://gist.github.com/ANTOSzbk/75ed7003e914162550f61399122a3bd4