@rebilly/instruments 1.0.2-beta.8 → 2.1.1-beta.0

package/dist/functions/purchase.js

@@ -3,39 +3,156 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.Purchase = Purchase;
+exports.makePayment = makePayment;
+exports.makePurchase = makePurchase;
+exports.handleApprovalUrl = handleApprovalUrl;
+exports.purchase = purchase;
+
+var _purchase = require("../storefront/purchase");
 
 var _events = _interopRequireDefault(require("../events"));
 
+var _modal = require("../views/modal");
+
+var _fetchData = require("./mount/fetch-data");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-async function Purchase(purchasePayload) {
+async function makePayment({
+  state,
+  payload
+}) {
+  const {
+    _raw: {
+      id: token
+    }
+  } = payload;
+  const data = {
+    token,
+    ...payload
+  };
+
+  if (state.options.invoiceId) {
+    data.invoiceId = state.options.invoiceId;
+  }
+
+  if (state.options.transactionId) {
+    data.transactionId = state.options.transactionId;
+  }
+
+  if (state.options.money) {
+    data.websiteId = state.options.websiteId;
+    data.amount = state.options.money.amount;
+    data.currency = state.options.money.currency;
+  }
+
+  let {
+    fields
+  } = await (0, _purchase.postPayment)({
+    state,
+    data
+  });
+  fields = {
+    transaction: fields,
+    token: fields.token || state.options.customerJwt
+  };
+
+  if (state.data.invoice) {
+    fields.invoice = state.data.invoice;
+  }
+
+  return fields;
+}
+
+async function makePurchase({
+  state,
+  payload
+}) {
+  const {
+    fields
+  } = await (0, _purchase.postPurchase)({
+    state,
+    data: {
+      websiteId: state.options.websiteId,
+      items: state.options.items,
+      paymentInstruction: {
+        token: payload._raw.id
+      },
+      ...payload
+    }
+  });
+  return fields;
+}
+
+function handleApprovalUrl({
+  state,
+  fields
+}) {
+  const {
+    paymentMethodsUrl
+  } = state.options._computed;
+  const model = {};
+
+  if (state.data.isPayment) {
+    model.payment = fields;
+  } else {
+    model.purchase = fields;
+  }
+
+  state.data = new _fetchData.DataInstance({
+    state,
+    ...fields
+  });
+  (0, _modal.mountModal)({
+    state,
+    name: 'rebilly-instruments-approval-url',
+    url: `${paymentMethodsUrl}/approval-url`,
+    model,
+    close: updatedPurchase => {
+      _events.default.purchaseCompleted.dispatch(updatedPurchase);
+    }
+  });
+}
+
+async function purchase({
+  state,
+  payload
+}) {
   try {
-    const {
-      fields: purchase
-    } = await this._postPurchase(purchasePayload);
-
-    if (purchase.transaction.approvalUrl) {
-      const {
-        paymentMethodsUrl
-      } = this.options._computed;
-
-      this._mountModal({
-        name: 'rebilly-instruments-approval-url',
-        url: `${paymentMethodsUrl}/approval-url`,
-        model: {
-          purchase
-        },
-        close: updatedPurchase => {
-          // TODO: Check if this is purchase...
-          _events.default.purchaseCompleted.dispatch(updatedPurchase);
-        }
+    var _fields$transaction;
+
+    let fields;
+
+    if (state.data.isPayment) {
+      fields = await makePayment({
+        state,
+        payload
+      });
+    } else {
+      fields = await makePurchase({
+        state,
+        payload
+      });
+    }
+
+    if ((_fields$transaction = fields.transaction) !== null && _fields$transaction !== void 0 && _fields$transaction.approvalUrl) {
+      handleApprovalUrl({
+        state,
+        fields
       });
     } else {
-      _events.default.purchaseCompleted.dispatch(purchase);
+      _events.default.purchaseCompleted.dispatch(fields);
     }
+
+    return fields;
   } catch (error) {
     // TODO: Display error to customer
+    console.error(error);
+
+    if (error.status === 422) {
+      error.details.forEach(e => console.error(e));
+    }
+
     return error;
   }
 }

package/dist/functions/purchase.spec.js

@@ -1,29 +1,27 @@
 "use strict";
 
-var _rebillyInstrumentsMock = require("tests/mocks/rebilly-instruments-mock");
+var _rebillyInstrumentsMock = require("../../tests/mocks/rebilly-instruments-mock");
 
 var _mswWhenThen = require("msw-when-then");
 
-var _server = require("tests/msw/server");
+var _server = require("../../tests/msw/server");
 
-var _storefrontApiMock = require("tests/mocks/storefront-api-mock");
+var _storefrontApiMock = require("../../tests/mocks/storefront-api-mock");
 
 var _events = _interopRequireDefault(require("../events"));
 
+var _asyncUtilities = require("../../tests/async-utilities");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 describe('RebillyInstruments purchase', () => {
   it('should be able to make a purchase', async () => {
-    const configs = {
-      websiteId: 'test-website-id'
-    };
     const options = {
-      intent: {
-        items: [{
-          planId: 'test-plan-id',
-          quantity: 1
-        }]
-      }
+      websiteId: 'test-website-id',
+      items: [{
+        planId: 'test-plan-id',
+        quantity: 1
+      }]
     };
     const token = {
       id: 'test-token-id'
@@ -44,14 +42,19 @@ describe('RebillyInstruments purchase', () => {
       }
     };
     (0, _server.when)((0, _mswWhenThen.post)(`${_storefrontApiMock.storefrontURL}/purchase`)).thenReturn((0, _mswWhenThen.ok)(fields));
-    const rebillyInstruments = (0, _rebillyInstrumentsMock.MockRebillyInstruments)(configs, options);
-    jest.spyOn(rebillyInstruments.storefront.purchase, 'purchase');
+    const rebillyInstruments = await (0, _rebillyInstrumentsMock.RenderMockRebillyInstruments)(options);
+    const spyStorefrontPurchase = jest.spyOn(rebillyInstruments.state.storefront.purchase, 'purchase');
     jest.spyOn(_events.default.purchaseCompleted, 'dispatch');
     const purchaseCompletedListener = jest.fn();
     rebillyInstruments.on('purchase-completed', purchaseCompletedListener);
     const purchasePayload = {
-      websiteId: rebillyInstruments.configs.websiteId,
-      items: rebillyInstruments.options.intent.items,
+      billingAddress,
+      deliveryAddress,
+      _raw: token
+    };
+    const purchasePayloadParsed = {
+      websiteId: rebillyInstruments.state.options.websiteId,
+      items: rebillyInstruments.state.options.items,
       billingAddress,
       deliveryAddress,
       paymentInstruction: {
@@ -59,12 +62,13 @@ describe('RebillyInstruments purchase', () => {
       }
     };
     await rebillyInstruments.purchase(purchasePayload);
-    expect(rebillyInstruments.storefront.purchase.purchase).toBeCalledTimes(1);
-    expect(rebillyInstruments.storefront.purchase.purchase).toBeCalledWith(expect.objectContaining({
-      data: purchasePayload
+    expect(spyStorefrontPurchase).toBeCalledTimes(1);
+    expect(spyStorefrontPurchase).toBeCalledWith(expect.objectContaining({
+      data: purchasePayloadParsed
     }));
     expect(_events.default.purchaseCompleted.dispatch).toBeCalledTimes(1);
     expect(purchaseCompletedListener).toBeCalledTimes(1);
     expect(purchaseCompletedListener).toBeCalledWith(expect.objectContaining(fields));
+    await (0, _asyncUtilities.avoidUnhandledPromises)();
   });
 });

package/dist/functions/setup.js

@@ -0,0 +1,85 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.setup = setup;
+
+var _paymentInstruments = require("../storefront/payment-instruments");
+
+var _events = _interopRequireDefault(require("../events"));
+
+var _modal = require("../views/modal");
+
+var _fetchData = require("./mount/fetch-data");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+async function setup({
+  state,
+  payload
+}) {
+  try {
+    var _state$options;
+
+    const {
+      instrument,
+      transaction
+    } = await (0, _paymentInstruments.setupPaymentInstrument)({
+      state,
+      data: {
+        token: payload._raw.id,
+        websiteId: (_state$options = state.options) === null || _state$options === void 0 ? void 0 : _state$options.websiteId,
+        ...payload
+      }
+    });
+    state.data = new _fetchData.DataInstance({
+      state,
+      instrument,
+      transaction
+    });
+
+    if (transaction.approvalUrl) {
+      const {
+        paymentMethodsUrl
+      } = state.options._computed;
+      (0, _modal.mountModal)({
+        state,
+        name: 'rebilly-instruments-approval-url',
+        url: `${paymentMethodsUrl}/approval-url`,
+        model: {
+          setup: {
+            transaction
+          }
+        },
+        close: ({
+          transaction: updatedTransaction = transaction
+        }) => {
+          _events.default.setupCompleted.dispatch({
+            instrument,
+            transaction: updatedTransaction
+          });
+        }
+      });
+    } else {
+      _events.default.setupCompleted.dispatch({
+        instrument,
+        transaction
+      });
+    }
+
+    return {
+      instrument,
+      transaction
+    };
+  } catch (error) {
+    // TODO: Display error to customer
+    console.error(error);
+
+    if (error.status === 422) {
+      error.details.forEach(e => console.error(e));
+    }
+
+    return error;
+  }
+}

package/dist/functions/setup.spec.js

@@ -0,0 +1,87 @@
+"use strict";
+
+var _rebillyInstrumentsMock = require("../../tests/mocks/rebilly-instruments-mock");
+
+var _mswWhenThen = require("msw-when-then");
+
+var _server = require("../../tests/msw/server");
+
+var _storefrontApiMock = require("../../tests/mocks/storefront-api-mock");
+
+var _events = _interopRequireDefault(require("../events"));
+
+var _asyncUtilities = require("../../tests/async-utilities");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+describe('RebillyInstruments setup', () => {
+  it('should be able to setup a payment instrument', async () => {
+    const options = {
+      websiteId: 'test-website-id',
+      money: {
+        amount: 30,
+        currency: 'USD'
+      },
+      transactionType: 'setup'
+    };
+    const token = {
+      id: 'test-token-id'
+    };
+    const billingAddress = {
+      billing: 'address'
+    };
+    const deliveryAddress = {
+      delivery: 'address'
+    };
+    const paymentInstrumentFields = {
+      id: 'payment-instrument-id'
+    };
+    const paymentInstrumentSetupFields = {
+      id: 'payment-instrument-id',
+      approvalUrl: null
+    };
+    (0, _server.when)((0, _mswWhenThen.post)(`${_storefrontApiMock.storefrontURL}/payment-instruments`)).thenReturn((0, _mswWhenThen.ok)(paymentInstrumentFields));
+    (0, _server.when)((0, _mswWhenThen.post)(`${_storefrontApiMock.storefrontURL}/payment-instruments/*/setup`)).thenReturn((0, _mswWhenThen.ok)(paymentInstrumentSetupFields));
+    const rebillyInstruments = await (0, _rebillyInstrumentsMock.RenderMockRebillyInstruments)(options);
+    const spyCreatePaymentInstrument = jest.spyOn(rebillyInstruments.state.storefront.paymentInstruments, 'create');
+    const spySetupPaymentInstrument = jest.spyOn(rebillyInstruments.state.storefront.paymentInstruments, 'setup');
+    const spyDispatchSetupCompleted = jest.spyOn(_events.default.setupCompleted, 'dispatch');
+    const setupCompletedListener = jest.fn();
+    rebillyInstruments.on('setup-completed', setupCompletedListener);
+    const setupPayload = {
+      billingAddress,
+      deliveryAddress,
+      ...options.money,
+      _raw: token
+    };
+    rebillyInstruments.mock.data({
+      previewPurchase: {
+        currency: 'USD',
+        total: 30
+      }
+    });
+    await rebillyInstruments.setup(setupPayload);
+    expect(spyCreatePaymentInstrument).toBeCalledTimes(1);
+    expect(spyCreatePaymentInstrument).toBeCalledWith(expect.objectContaining({
+      data: expect.objectContaining({
+        token: token.id
+      })
+    }));
+    expect(spySetupPaymentInstrument).toBeCalledTimes(1);
+    expect(spySetupPaymentInstrument).toBeCalledWith(expect.objectContaining({
+      id: expect.stringContaining(paymentInstrumentFields.id),
+      data: expect.objectContaining({
+        websiteId: rebillyInstruments.state.options.websiteId,
+        currency: 'USD',
+        amount: 30
+      })
+    }));
+    expect(spyDispatchSetupCompleted).toBeCalledTimes(1);
+    expect(setupCompletedListener).toBeCalledTimes(1);
+    expect(setupCompletedListener).toBeCalledWith(expect.objectContaining({
+      instrument: paymentInstrumentFields,
+      transaction: paymentInstrumentSetupFields
+    }));
+    await (0, _asyncUtilities.avoidUnhandledPromises)();
+  });
+});

package/dist/functions/show.js

@@ -3,33 +3,50 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.Show = Show;
+exports.show = show;
+
+var _confirmation = require("../views/confirmation");
+
+var _result = require("../views/result");
+
+/**
+ @typedef ShowParams
+ @type {Object}
+ @property {string} componentName - The name of the component to render to the form.
+ @property {object} payload - The extra data to provide the component.
+ @property {object} state - The global state.
+ */
 
 /**
  * Register events that will be triggered
- * @param {string} componentName - The name of the component to render to the form
- * @param {function} payload - The extra data to provide the component
+ * @param {ShowParams} params
  */
-async function Show(componentName, payload = {}) {
+async function show({
+  componentName,
+  payload,
+  state
+}) {
   switch (componentName) {
     case 'result':
-      this.iframeComponents = this.iframeComponents.filter(iframe => {
-        iframe.component.destroy();
+      state.iframeComponents = state.iframeComponents.filter(iframe => {
+        iframe.destroy();
         return false;
       });
-
-      this._mountResult.call(this, payload);
-
+      (0, _result.mountResult)({
+        payload,
+        state
+      });
       break;
 
     case 'confirmation':
-      this.iframeComponents = this.iframeComponents.filter(iframe => {
-        iframe.component.destroy();
+      state.iframeComponents = state.iframeComponents.filter(iframe => {
+        iframe.destroy();
         return false;
       });
-
-      this._mountConfirmation.call(this, payload);
-
+      (0, _confirmation.mountConfirmation)({
+        payload,
+        state
+      });
       break;
 
     default:

package/dist/functions/show.spec.js

@@ -1,32 +1,61 @@
 "use strict";
 
-var _rebillyInstrumentsMock = require("tests/mocks/rebilly-instruments-mock");
+var result = _interopRequireWildcard(require("../views/result"));
 
+var confirmation = _interopRequireWildcard(require("../views/confirmation"));
+
+var _rebillyInstrumentsMock = require("../../tests/mocks/rebilly-instruments-mock");
+
+var _index = require("../index");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+const iframeMock = {
+  destroy: jest.fn()
+};
 describe('RebillyInstruments show', () => {
-  it('should show result component', () => {
+  it('should show result component', async () => {
+    const mountResult = jest.spyOn(result, 'mountResult').mockReturnValue(Promise.resolve());
+    const instance = new _index.RebillyInstrumentsInstance();
+    instance.state.iframeComponents.push(iframeMock);
     const payload = {
       test: 'value'
     };
-    const rebillyInstruments = (0, _rebillyInstrumentsMock.MockRebillyInstruments)();
-    rebillyInstruments._mountResult = jest.fn();
-    rebillyInstruments.show('result', payload);
-    expect(rebillyInstruments._mountResult).toBeCalledTimes(1);
-    expect(rebillyInstruments._mountResult).toBeCalledWith(payload);
+    await instance.show('result', payload);
+    expect(mountResult).toBeCalledTimes(1);
+    expect(mountResult).toBeCalledWith({
+      payload,
+      state: instance.state
+    });
+    expect(instance.state.iframeComponents).toEqual([]);
   });
-  it('should show confirmation component', () => {
+  it('should show confirmation component', async () => {
+    const mountConfirmation = jest.spyOn(confirmation, 'mountConfirmation').mockReturnValue(Promise.resolve());
+    const instance = new _index.RebillyInstrumentsInstance();
+    instance.state.iframeComponents.push(iframeMock);
     const payload = {
       test: 'value'
     };
-    const rebillyInstruments = (0, _rebillyInstrumentsMock.MockRebillyInstruments)();
-    rebillyInstruments._mountConfirmation = jest.fn();
-    rebillyInstruments.show('confirmation', payload);
-    expect(rebillyInstruments._mountConfirmation).toBeCalledTimes(1);
-    expect(rebillyInstruments._mountConfirmation).toBeCalledWith(payload);
+    await instance.show('confirmation', payload);
+    expect(mountConfirmation).toBeCalledTimes(1);
+    expect(mountConfirmation).toBeCalledWith({
+      payload,
+      state: instance.state
+    });
+    expect(instance.state.iframeComponents).toEqual([]);
   });
-  it('should fail for non supported component', () => {
-    const rebillyInstruments = (0, _rebillyInstrumentsMock.MockRebillyInstruments)();
-    expect(async () => {
-      rebillyInstruments.show('not-a-component');
-    }).rejects.toEqual(new Error(`'not-a-component' not a supported component`));
+  it('should fail for non supported component', async () => {
+    const rebillyInstruments = new _index.RebillyInstrumentsInstance();
+    let error;
+
+    try {
+      await rebillyInstruments.show('not-a-component', 'any payload');
+    } catch (e) {
+      error = e;
+    }
+
+    expect(error.toString()).toBe(`Error: 'not-a-component' not a supported component`);
   });
 });

package/dist/functions/update.js

@@ -3,16 +3,37 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.Update = Update;
+exports.update = update;
 
 var _lodash = _interopRequireDefault(require("lodash.merge"));
 
-var _lodash2 = _interopRequireDefault(require("lodash.isequal"));
+var _destroy = require("./destroy");
+
+var _mount = require("./mount");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-async function Update(newConfig) {
-  if (!this.hasMounted) {
+function sanitizeOldPurchaseData({
+  newOptions
+}) {
+  let purchaseData = {};
+  const hasPurchaseDataKeys = Object.keys(newOptions).some(key => ['items', 'money', 'invoiceId', 'transactionId'].includes(key));
+  purchaseData = hasPurchaseDataKeys ? {
+    items: null,
+    money: null,
+    invoiceId: null,
+    transactionId: null
+  } : purchaseData;
+  return purchaseData;
+}
+
+;
+
+async function update({
+  state,
+  newOptions = {}
+}) {
+  if (!state.hasMounted) {
     throw Error('Update method cannot be called before mounting instruments');
   }
   /**
@@ -20,29 +41,34 @@ async function Update(newConfig) {
    * https://github.com/Rebilly/framepay/issues/450
    * That's why this toggle disables real time locale update until that issue is fixed.
    */
+  // const updatingJustLocale =
+  //   newOptions?.options && isEqual(Object.keys(newOptions), ['locale']);
+  // if (updatingJustLocale) {
+  //   const updatedOptions = merge(state.options, newOptions);
+  //   const newLocale = newOptions?.locale;
+  //   state.options = updatedOptions;
+  //   state.translate.updateTranslationsToNewLocale(newLocale);
+  //   state.iframeComponents.forEach((iframe) =>
+  //     iframe.component.call('changeLocale', newLocale)
+  //   );
+  //   return;
+  // }
 
 
-  const temporaryDisableRealTimeLocaleUpdate = true;
-  const updatingJustLocale = (newConfig === null || newConfig === void 0 ? void 0 : newConfig.options) && (0, _lodash2.default)(Object.keys(newConfig === null || newConfig === void 0 ? void 0 : newConfig.options), ['locale']);
-
-  if (updatingJustLocale && !temporaryDisableRealTimeLocaleUpdate) {
-    const updatedOptions = (0, _lodash.default)(this.options, newConfig.options);
-    const newLocale = newConfig === null || newConfig === void 0 ? void 0 : newConfig.options.locale;
-    this.options = updatedOptions;
-    this.translate.updateTranslationsToNewLocale(newLocale);
-    this.iframeComponents.forEach(iframe => iframe.component.call('changeLocale', newLocale));
-    return;
-  }
-
-  const updatedOptions = (0, _lodash.default)(this.options, newConfig.options);
-  await this.destroy();
-  this.initialize(this.configs);
-  this.mount({
-    form: this.form,
-    summary: this.summary,
-    options: updatedOptions,
-    _dev: this._dev
+  const oldOptions = { ...state.options,
+    ...sanitizeOldPurchaseData({
+      newOptions
+    })
+  };
+  const updatedOptions = (0, _lodash.default)({ ...oldOptions
+  }, newOptions);
+  await (0, _destroy.destroy)({
+    state
   });
-}
-
-;
+  (0, _mount.mount)({
+    state,
+    form: state.form,
+    summary: state.summary,
+    ...updatedOptions
+  });
+}