@paypal/connect-loader-component

accelerated-checkout-loader

Provides a static asset loader to fetch the latest PayPal Accelerated-Checkout components.

This version (1.x.x) loads AXO SDK v0.6 (boba).

Installation

npm install -S @paypal/connect-loader-component

Usage

The minified accelerated-checkout-loader is available for most uses; in addition, an unminified accelerated-checkout-loader is available for development or testing.

Minified

Serves the minified version of the AXO script.

import { loadAxo } from "@paypal/connect-loader-component";

loadAxo({ minified: true })
  .then(() => {
    console.log("minified script loaded");
    return;
  })
  .catch((err) => {
    console.log("There was an error: ", err);
  });

If no options are passed, the minified script is served by default

import { loadAxo } from "@paypal/connect-loader-component";

loadAxo()
  .then(() => {
    console.log("minified script loaded");
    return;
  })
  .catch((err) => {
    console.log("There was an error: ", err);
  });

Unminified

Serves the unminified version of the AXO script.

import { loadAxo } from "@paypal/connect-loader-component";

loadAxo({ minified: false })
  .then(() => {
    console.log("script loaded");
    return;
  })
  .catch((err) => {
    console.log("There was an error: ", err);
  });

Testing

In order to test our accelerated checkout loader, we'll need to install braintree.js repo locally, which creates the final connect.js build for us to be consumed by accelerated checkout.

Run npm link in the accelerated-checkout-loader folder, then in the braintree repo, install node_modules and then npm run build. This should create a connect.js file under dist/hosted/web/{VERSION}, which should include your loader changes.

Now you can either stage it using web stage or just store it locally to be replaced whereever you were originally calling the connect file.