Advanced configuration

Advanced configuration options for the JavaScript SDK v6 help you customize the payment experience.

Prerequisites

Before you integrate:

• Get a client ID and secret.
• Set up the v6 SDK.

Configure presentation modes and fallback

For advanced use cases, you can choose a specific presentation mode. Then, implement your own fallback logic with the isRecoverable error property.

// Alternatively, set up a standard PayPal button with a custom order of presentation modes
async function configurePayPalButton(sdkInstance) {
  const paypalPaymentSession = sdkInstance.createPayPalOneTimePaymentSession(
    paymentSessionOptions,
  );

  const paypalButton = document.querySelector("paypal-button");
  paypalButton.removeAttribute("hidden");

  paypalButton.addEventListener("click", async () => {
    const createOrderPromiseReference = createOrder();
    const presentationModesToTry = ["payment-handler", "popup", "modal"];

    for (const presentationMode of presentationModesToTry) {
      try {
        await paypalPaymentSession.start(
          { presentationMode },
          createOrderPromiseReference,
        );
        // Exit early when start() successfully resolves
        break;
      } catch (error) {
        // Try another presentationMode for a recoverable error
        if (error.isRecoverable) {
          continue;
        }
        throw error;
      }
    }
  });
}