Close iframe on redirect

I have an iframe inside modal.

const ThreeDSecure = ({
    paymentRequest,
    md,
    termUrl,
    issuerUrl,
    source,
    promotions,
    products,
    userProfile
}) => {
    const dispatch = useDispatch();
    const formId = `${source}-form`;
    window.addEventListener(
        'message',
        function(event) {
           ...
        },
        false
    );
    
    const submitForm = () => {
        setTimeout(() => {
            if (document.forms[formId]) {
                document.forms[formId].submit();
            }
        }, 100);
    };
    
    return (
        <ThreeDSecureModal
            renderBodyContent={() => (
                <iframe
                    height="500"
                    width="100%"
                    name="threeDSiFrame"
                    title="threeDSiFrame"
                    frameBorder="0"
                    onLoad={submitForm()}
                >
                    <form
                        action={issuerUrl}
                        id={formId}
                        method="POST"
                        target="threeDSiFrame"
                    >
                        <input
                            type="hidden"
                            name="loadReq"
                            value={loadReq}
                        />
    
                    </form>
                </iframe>
            )}
        />
    );

The iframe renders banks challenge:

User then enters password and selects submit button.

While bank is redirecting to another backend server who will then call our front end, the iframe just sits blank until that back end api comes back saying user was authorized.

I would like to add request to listen on when bank redirects to this backend server and closes iframe, so I can show spinner.

I tried replacing:

document.forms[formId].submit() 

with following code in my submitForm():

fetch(issuerUrl, {
        method: 'POST',
        body: new FormData(document.forms[formId]),
        headers: {
            'Content-Type': 'application/x-www-form-urlencoded'
        }
    })
    .then(res => res.text())

But it throws CORS error:

Access to fetch at 'https://checkoutshopper-test.adyen.com/checkoutshopper/threeDS2.shtml' from origin 'https://checkout.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

Is there a way around this, because the bank is not going to whitelist us.