@grabjs/superapp-sdk
    Preparing search index...

    Class CheckoutModule

    JSBridge module for triggering native payment flows.

    Invokes the native Grab checkout/pay component to process payments. This code must run on the Grab SuperApp's WebView to function correctly.

    ES Module:

    import { CheckoutModule } from '@grabjs/superapp-sdk';
    const checkoutModule = new CheckoutModule();

    CDN (UMD):

    <script src="https://cdn.jsdelivr.net/npm/@grabjs/superapp-sdk/dist/index.js"></script>
    <script>
    const checkoutModule = new SuperAppSDK.CheckoutModule();
    </script>

    Hierarchy (View Summary)

    Index

    Constructors

    Methods

    Constructors

    Methods

    • Triggers the native checkout flow for payment processing.

      Parameters

      Returns Promise<TriggerCheckoutResponse>

      The checkout result, containing transaction status (success, failure, or pending) and transaction details.

      Simple usage

      import { CheckoutModule, isSuccess, isErrorResponse } from '@grabjs/superapp-sdk';

      // Initialize the checkout module
      const checkout = new CheckoutModule();

      // Trigger checkout with response params
      const transactionResponse = await createTransaction(); // Call POST /grabpay/partner/v4/charge/init from Grab API to create a transaction
      const response = await checkout.triggerCheckout(transactionResponse);

      // Handle the response
      if (isSuccess(response)) {
      console.log('Transaction ID:', response.result.transactionID);
      switch (response.result.status) {
      case 'success':
      console.log('Transaction successful');
      break;
      case 'failure':
      console.log('Transaction failed:', response.result.errorMessage, response.result.errorCode);
      break;
      case 'pending':
      console.log('Transaction pending');
      break;
      case 'userInitiatedCancel':
      console.log('User cancelled the checkout');
      break;
      }
      } else if (isErrorResponse(response)) {
      console.error(`Error ${response.status_code}: ${response.error}`);
      } else {
      console.error('Unhandled response');
      }