Integrate Cash App using Square API Event trigger issue

Question

I have integrated Cash App Payment through Square API SDKs.

I have used Javascript Web SDK & PHP SDK

I have mobile app for purchasing bucks and from mobile app it will open webview for cash app payment (for this I have used Square Javascript Web SDK)

• with this webSDK it will create CashApp Payment button
• On click on that button It will redirected to cash app page where there is 2 buttons
  1. Open Cash App
  2. Get Cash App
• On click "Open Cash App" button it will open the cash app application and redirect payment screen.
• In my case when it was redirected to the payment screen on the cash app my event ontokenization got triggered. Also I get status = OK and the token for further processing to make payment using PHP SDK.
• Even on the screen I don't click on the OK button then the event gets triggered. Also when I press the back button then the event is triggered too.

As per my knowledge the Ideal way is when I click on OK button then after the event will trigger and payment is processed.

Below is my code block.

const appId = 'MYAPPID';
        const locationId = 'MY LOCATION ID';

        function buildPaymentRequest(payments) {
            const paymentRequest = payments.paymentRequest({
                countryCode: 'US',
                currencyCode: 'USD',
                total: {
                    amount: '10',
                    label: 'Total',
                },
            });
            return paymentRequest;
        }

        async function initializeCashApp(payments) {
            const paymentRequest = buildPaymentRequest(payments);
            // console.log(paymentRequest)
            const cashAppPay = await payments.cashAppPay(paymentRequest, {
                redirectURL: window.location.href,
                referenceId: 'my-website-00000001'
            });
            const buttonOptions = {
                shape: 'semiround',
                width: 'full',
            };
            await cashAppPay.attach('#cash-app-pay', buttonOptions);
            return cashAppPay;
        }

        async function createPayment(token, resData) {
            const body = JSON.stringify({
                locationId,
                sourceId: token,
                temp_order_id: '123'
            });

            const paymentResponse = await fetch('/web/payment/cash-app-payment', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                },
                body,
            });

            if (paymentResponse.ok) {
                return paymentResponse.json();
            }

            const errorBody = await paymentResponse.text();
            throw new Error(errorBody);
        }

        async function paymentFail(tokenResponse) {
            const body = JSON.stringify({
                locationId,
                temp_order_id: '123',
                tokenResponse: tokenResponse
            });

            const paymentResponse = await fetch('/web/payment/cash-app-payment-fail', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                },
                body,
            });

            if (paymentResponse.ok) {
                return paymentResponse.json();
            }

            const errorBody = await paymentResponse.text();
            throw new Error(errorBody);
        }

        // status is either SUCCESS or FAILURE;
        function redirectToPaymentResults(status, errorMessage) {
            let redirectUrl = '';
            if (status === 'SUCCESS') {
                redirectUrl = 'api/payment/close?action=success';
            } else {
                redirectUrl = 'api/payment/close?action=error&message='+errorMessage;
            }

            window.location.href = redirectUrl;
        }



        document.addEventListener('DOMContentLoaded', async function () {
            if (!window.Square) {
                throw new Error('Square.js failed to load properly');
            }

            let payments;
            try {
                payments = window.Square.payments(appId, locationId);
            } catch (e) {
                const statusContainer = document.getElementById(
                    'payment-status-container'
                );
                statusContainer.className = 'missing-credentials';
                statusContainer.style.visibility = 'visible';
                console.log(e.message);
                return;
            }

            let cashAppPay;
            try {
                cashAppPay = await initializeCashApp(payments);
            } catch (e) {
                console.error('Initializing Cash App Pay failed', e);
            }
            if (cashAppPay) {
                cashAppPay.addEventListener(
                    'ontokenization',
                    async function ({ detail }) {
                        await paymentFail(detail);
                        const tokenResult = detail.tokenResult;
                        if (tokenResult.status === 'OK') {
                            const paymentResults = await createPayment(tokenResult.token, tokenResult);
                            
                            if(paymentResults.status === 'SUCCESS') {
                               
                                const msg = paymentResults.message || '';
                                
                                redirectToPaymentResults('SUCCESS', '');
                            } else if(paymentResults.status === 'ERROR') {
                                // await paymentFail();
                                const msg = paymentResults.message || '';
                               
                                redirectToPaymentResults('FAILURE', msg);
                            }

                        } else {
                            // const paymentFail = await paymentFail();
                            let errorMessage = `Tokenization failed with status: ${tokenResult.status}`;

                            if (tokenResult.errors) {
                                errorMessage += ` and errors: ${JSON.stringify(
                                    tokenResult.errors
                                )}`;
                            }

                            redirectToPaymentResults('FAILURE', errorMessage);
                        }
                    }
                );
            }
        });