Search code examples
reactjsscrollbarreact-functional-componentrazorpay

Vertical Scroll bar goes away after razorpay payment window is closed in react-app


I am building a react app with razorpay payment. After the razorpay overlay is closed the vertical scroll bar goes away and is visible only after a hard refresh. This is the code for razorpay window :

async function DisplayRazorpay(payment) {
    const options = {
      key: '*****',
      currency:'INR',
      amount: 1000,
      order_id: '****',
      name: 'abcd',
      description: 'abcd',
      image: logo,
      handler(response) {
        .....
      },
      prefill: {
        name,
        email,
        contact,
      },
    };
    const paymentObject = new window.Razorpay(options);
    paymentObject.open();
    paymentObject.on('payment.failed', (err) => {
     .....
      paymentObject.close();
    });
  }

Everything else is working fine. How can I fix the scrollbar problem?


Solution

  • Added this to index.css and now it's working fine.

    body {
      overflow: visible !important;
    }