He integrado razorpay con angular 9 pero aparece el error no se puede leer la propiedad postMessage of null. Mientras intenta hacer clic en la segunda vez después del primer pago exitoso . Investigué un poco y sugiere que, debido a que proviene de XDM, del cual no sé mucho, parece que crea un iframe para la comunicación. He proporcionado mi código a continuación Ver captura de pantalla err aquí
clickitem() { this.req2.key = payment.razorpayKey; this.req2.name = payment.name; this.req2.email = payment.email; this.req2.address = payment.address; this.req2.order_id = payment.orderId; this.req2.clientQuotationid = payment.clientQuotationid; this.req2.amount = payment.amount; this.handle: function (response) { paass(response.razorpay_payment_id, response.razorpay_order_id, response.razorpay_signature, PaymentComponent.amount); var event = new CustomEvent("payment.success", { detail: response, bubbles: true, cancelable: false } ); window.dispatchEvent(event); } PaymentComponent.amount = payment.amount; this.req2.contactnumber = payment.contactNumber; var rzp1 = new Razorpay(this.req2); rzp1.open(); // ---------- This line gives error on clicing 2nd time rzp1.on('payment.failed', function (response) { // Todo - store this information in the server //console.log('Error Code:- ' +response.error.code); const StatusNew = 'failed'; const u_pgID = 'undefined'; rzp1.close(); if (response.error.metadata.payment_id === undefined) { faill(u_pgID, response.error.metadata.order_id, response.error.code, response.error.description, response.error.source, response.error.step, response.error.reason, StatusNew); } else { faill(response.error.metadata.payment_id, response.error.metadata.order_id, response.error.code, response.error.description, response.error.source, response.error.step, response.error.reason, StatusNew); } }); } paass(){} // ------- to store success in db faill(){}// ------- to store Failure in db button.btnPrimary((click)='clickitem();' pButton='', pRipple='', type='button', label='Pay Now')