Next.js or Browser blocking redirection requests by Payment Provider after 3ds verification

I am implementing the MPGS payment gateway in my Next.js app. I provide the redirection URL to the MPGS API, which in turns provide me an HTML to be injected into this page. This html contains a form and an iframe. When the 3ds is successful the iframe tries to redirect the website to the redirect URL, I get a long list of redirection attempts in the Chrome Network tab but the page never actually redirects. Then I get the error in the iframe that
my-domain.com redirected you too many times. The redirection url is correct inside the Chrome Network tab but I cant figure out if the redirection is being blocked by Next.js or Chrome.

In my next.js client component, I fetch the three3ds HTML and display it as follows

<div
  ref={containerRef}
  dangerouslySetInnerHTML={{ __html: threeDSHtml }}
</div>

And in the useEffect I load the script provided by MPGS in the returned html

useEffect(() => {
    if (threeDSHtml) {
      setTimeout(() => {
        var e = document.getElementById("threedsChallengeRedirectForm")
        if (e) {
          e.submit()
          if (e.parentNode !== null) {
            e.parentNode.removeChild(e)
          }
        }
      }, 500)
    }
  }, [threeDSHtml])