@rebilly/instruments 4.5.0 → 4.6.0

package/tests/mocks/rebilly-instruments-mock.js

@@ -13,125 +13,129 @@ import { sleep } from '@/utils';
 import setupFramepay from '@/functions/mount/setup-framepay';
 
 export const setupFramepayMock = async () => {
-  /*
-   * onload() is never called in JSDOM context but we want to test the rest of the setupFramepay code,
-   * so we run it asynchonously and wait for 10 ms
-   */
-  setupFramepay()
-  await sleep(10);
-}
+    /*
+     * onload() is never called in JSDOM context but we want to test the rest of the setupFramepay code,
+     * so we run it asynchonously and wait for 10 ms
+     */
+    setupFramepay();
+    await sleep(10);
+};
 
 export async function RenderMockRebillyInstruments(options = {}) {
-  const testInvoice = new InvoiceModel({
-    id: 'test-invoice-id'
-  });
-  const testPlan = new PlanModel({ name: 'Test Plan', id: 'test-plan-id-1' });
-  const testProduct = new ProductModel({
-    description: 'My Awesome Product',
-    id: 'test-product-1',
-    name: 'My Product'
-  });
-  const testSummary = new SummaryModel({
-    currency: 'USD',
-    lineItems: [
-      {
-        description: 'test-plan-id-1',
-        planId: 'test-plan-id-1',
-        productId: 'test-product-1',
-        quantity: 1
-      }
-    ]
-  });
-
-  when(get(`${storefrontURL}/invoices/*`)).thenReturn(
-    (() => ok(testInvoice))()
-  );
-
-  when(post(`${storefrontURL}/ready-to-pay`)).thenReturn(
-    (() => ok([
-        {
-          method: 'payment-card',
-          feature: {
-            name: 'Google Pay',
-            merchantName: 'google-pay-merchant-name',
-            merchantOrigin: 'google-pay-merchant-origin'
-          },
-          brands: ['Visa', 'MasterCard', 'American Express', 'Discover'],
-          filters: []
-        }
-      ]))()
-  );
-
-  when(post(`${storefrontURL}/preview-purchase`)).thenReturn(
-    (() => ok(testSummary))()
-  );
-
-  when(get(`${storefrontURL}/plans`)).thenReturn(
-    (() => ok([testPlan]))()
-  );
-
-  when(get(`${storefrontURL}/products`)).thenReturn(
-    (() => ok([testProduct]))()
-  );
-
-  const defaultOptions = {
-    form: '.form-selector',
-    summary: '.summary-selector',
-    locale: 'auto',
-    apiMode: 'sandbox',
-    _dev: {
-      paymentMethodsUrl: 'https://forms.test.rebilly.dev',
-      framePayStyleLink: 'https://dev.framepay.rebilly.com/rebilly.css'
-    },
-  };
-
-  const hasPurchaseData = [
-    'items',
-    'invoiceId',
-    'transactionId',
-    'money',
-    'jwt'
-  ].some(key => Object.keys(options).includes(key))
-  if(!hasPurchaseData) {
-    defaultOptions.items = [
-      {
-        planId: 'test-plan-id-1',
-        quantity: 1
-      }
-    ];
-  }
-
-  if ((options.invoiceId || options.transactionid) && !options.jwt) {
-    defaultOptions.jwt = 'test-jwt';
-  }
-
-  const mergedOptions = merge({...defaultOptions}, options);
-
-  const framepayMock = createFramepayMock();
-  global.Rebilly = framepayMock;
-
-  const form = document.createElement('div');
-  form.classList.add(`${mergedOptions.form.replace('.', '')}`);
-  document.body.appendChild(form);
-
-  const summary = document.createElement('div');
-  summary.classList.add(`${mergedOptions.summary.replace('.', '')}`);
-  document.body.appendChild(summary);
-
-  try {
-    await RebillyInstruments.mount({
-      setupFramepay: setupFramepayMock,
-      ...mergedOptions,
+    const testInvoice = new InvoiceModel({
+        id: 'test-invoice-id',
+    });
+    const testPlan = new PlanModel({ name: 'Test Plan', id: 'test-plan-id-1' });
+    const testProduct = new ProductModel({
+        description: 'My Awesome Product',
+        id: 'test-product-1',
+        name: 'My Product',
+    });
+    const testSummary = new SummaryModel({
+        currency: 'USD',
+        lineItems: [
+            {
+                description: 'test-plan-id-1',
+                planId: 'test-plan-id-1',
+                productId: 'test-product-1',
+                quantity: 1,
+            },
+        ],
     });
-  
-    RebillyInstruments.mock = {
-      data: (data) => {
-        RebillyInstruments.state.data = new DataInstance(data);
-      }
+
+    when(get(`${storefrontURL}/invoices/*`)).thenReturn(
+        (() => ok(testInvoice))(),
+    );
+
+    when(post(`${storefrontURL}/ready-to-pay`)).thenReturn(
+        (() =>
+            ok([
+                {
+                    method: 'payment-card',
+                    feature: {
+                        name: 'Google Pay',
+                        merchantName: 'google-pay-merchant-name',
+                        merchantOrigin: 'google-pay-merchant-origin',
+                    },
+                    brands: [
+                        'Visa',
+                        'MasterCard',
+                        'American Express',
+                        'Discover',
+                    ],
+                    filters: [],
+                },
+            ]))(),
+    );
+
+    when(post(`${storefrontURL}/preview-purchase`)).thenReturn(
+        (() => ok(testSummary))(),
+    );
+
+    when(get(`${storefrontURL}/plans`)).thenReturn((() => ok([testPlan]))());
+
+    when(get(`${storefrontURL}/products`)).thenReturn(
+        (() => ok([testProduct]))(),
+    );
+
+    const defaultOptions = {
+        form: '.form-selector',
+        summary: '.summary-selector',
+        locale: 'auto',
+        apiMode: 'sandbox',
+        _dev: {
+            paymentMethodsUrl: 'https://forms.test.rebilly.dev',
+            framePayStyleLink: 'https://dev.framepay.rebilly.com/rebilly.css',
+        },
     };
-  } catch(e) {
-    console.log(e);
-  }
 
-  return RebillyInstruments;
-}
+    const hasPurchaseData = [
+        'items',
+        'invoiceId',
+        'transactionId',
+        'money',
+        'jwt',
+    ].some((key) => Object.keys(options).includes(key));
+    if (!hasPurchaseData) {
+        defaultOptions.items = [
+            {
+                planId: 'test-plan-id-1',
+                quantity: 1,
+            },
+        ];
+    }
+
+    if ((options.invoiceId || options.transactionid) && !options.jwt) {
+        defaultOptions.jwt = 'test-jwt';
+    }
+
+    const mergedOptions = merge({ ...defaultOptions }, options);
+
+    const framepayMock = createFramepayMock();
+    global.Rebilly = framepayMock;
+
+    const form = document.createElement('div');
+    form.classList.add(`${mergedOptions.form.replace('.', '')}`);
+    document.body.appendChild(form);
+
+    const summary = document.createElement('div');
+    summary.classList.add(`${mergedOptions.summary.replace('.', '')}`);
+    document.body.appendChild(summary);
+
+    try {
+        await RebillyInstruments.mount({
+            setupFramepay: setupFramepayMock,
+            ...mergedOptions,
+        });
+
+        RebillyInstruments.mock = {
+            data: (data) => {
+                RebillyInstruments.state.data = new DataInstance(data);
+            },
+        };
+    } catch (e) {
+        console.log(e);
+    }
+
+    return RebillyInstruments;
+}

package/tests/mocks/storefront-api-mock.js

@@ -1,55 +1,62 @@
-import {ok, get, post} from 'msw-when-then';
+import { ok, get, post } from 'msw-when-then';
 
 export const storefrontURL = '*/storefront';
 
 export const initStoreFrontApiMocks = (when) => {
-  const mocks = [
-    /* GET */
-    {
-      url: '*/account',
-      method: get,
-      response: () => ok({})
-    }, {
-      url: '*/plans',
-      method: get,
-      response: () => ok([])
-    }, {
-      url: '*/payment-instruments',
-      method: get,
-      response: () => ok([])
-    }, {
-      url: '*/transactions/test-transaction-id',
-      method: get,
-      response: () => ok({})
-    },
+    const mocks = [
+        /* GET */
+        {
+            url: '*/account',
+            method: get,
+            response: () => ok({}),
+        },
+        {
+            url: '*/plans',
+            method: get,
+            response: () => ok([]),
+        },
+        {
+            url: '*/payment-instruments',
+            method: get,
+            response: () => ok([]),
+        },
+        {
+            url: '*/transactions/test-transaction-id',
+            method: get,
+            response: () => ok({}),
+        },
 
-    /* POST */
-    {
-      url: '*/ready-to-pay',
-      method: post,
-      response: () => ok([
-        {
-          filters: [],
-          method: "method",
-        }
-      ])
-    }, {
-      url: '*/preview-purchase',
-      method: post,
-      response: () => ok({})
-    }, {
-      url: '*/payment-instruments',
-      method: post,
-      response: () => ok([])
-    }, {
-      url: '*/payment-instruments/*/setup',
-      method: post,
-      response: () => ok([])
-    }
-  ];
+        /* POST */
+        {
+            url: '*/ready-to-pay',
+            method: post,
+            response: () =>
+                ok([
+                    {
+                        filters: [],
+                        method: 'method',
+                    },
+                ]),
+        },
+        {
+            url: '*/preview-purchase',
+            method: post,
+            response: () => ok({}),
+        },
+        {
+            url: '*/payment-instruments',
+            method: post,
+            response: () => ok([]),
+        },
+        {
+            url: '*/payment-instruments/*/setup',
+            method: post,
+            response: () => ok([]),
+        },
+    ];
 
-  mocks.forEach(api => {
-    const http = api.method(`${storefrontURL}${api.url}`)
-    when(http).thenReturn(api.response());
-  });
+    mocks.forEach((api) => {
+        const http = api.method(`${storefrontURL}${api.url}`);
+        when(http).thenReturn(api.response());
+    });
 };

package/tests/mocks/storefront-mock.js

@@ -3,22 +3,18 @@ import { DataInstance } from '@/functions/mount/fetch-data';
 import state from '@/state';
 
 export function MockStorefront(config = {}) {
-  return Storefront(config);
+    return Storefront(config);
 }
 
-export function StorefontTestingInstance({
-  options = {},
-  data = {}
-} = {}) {
- 
-  state.storefront = null;
-  state.storefront = MockStorefront();
+export function StorefontTestingInstance({ options = {}, data = {} } = {}) {
+    state.storefront = null;
+    state.storefront = MockStorefront();
 
-  state.options = null;
-  state.options = options;
+    state.options = null;
+    state.options = options;
 
-  state.data = null;
-  state.data = new DataInstance(data);
+    state.data = null;
+    state.data = new DataInstance(data);
 
-  return state;
-}
+    return state;
+}

package/tests/msw/server.js

@@ -1,12 +1,12 @@
-import {setupServer} from 'msw/node';
-import {rest} from 'msw';
-import {whenThen} from 'msw-when-then';
-import {initStoreFrontApiMocks} from '../mocks/storefront-api-mock';
-import {initRebillyApiMocks} from '../mocks/rebilly-api-mock';
+import { setupServer } from 'msw/node';
+import { rest } from 'msw';
+import { whenThen } from 'msw-when-then';
+import { initStoreFrontApiMocks } from '../mocks/storefront-api-mock';
+import { initRebillyApiMocks } from '../mocks/rebilly-api-mock';
 
 export const server = setupServer();
 
-export const {when} = whenThen(server, rest);
+export const { when } = whenThen(server, rest);
 
 export const initGlobalHandlers = () => {
     initStoreFrontApiMocks(when);

package/tests/setup-test.js

@@ -1,32 +1,30 @@
 import { initGlobalHandlers, server } from './msw/server';
 import state from '../src/state';
-import 'vitest-canvas-mock'
+import 'vitest-canvas-mock';
 
-vi.mock("@rebilly/risk-data-collector", async () => {
-  const actual = await vi.importActual("@rebilly/risk-data-collector");
-  return {
-    default: {
-      collectData: vi.fn()
-      .mockReturnValue({riskMetadata: {}}),
-    },
-    ...actual,
-  }
+vi.mock('@rebilly/risk-data-collector', async () => {
+    const actual = await vi.importActual('@rebilly/risk-data-collector');
+    return {
+        default: {
+            collectData: vi.fn().mockReturnValue({ riskMetadata: {} }),
+        },
+        ...actual,
+    };
 });
 
-
 beforeAll(() => {
-  server.listen();
+    server.listen();
 });
 
 beforeEach(() => {
-  initGlobalHandlers();
-  state.reset();
+    initGlobalHandlers();
+    state.reset();
 });
 
 afterEach(() => {
-  server.resetHandlers();
+    server.resetHandlers();
 });
 
 afterAll(() => {
-  server.close();
+    server.close();
 });

package/vitest.config.js

@@ -1,18 +1,18 @@
-import { defineConfig } from 'vitest/config'
+import { defineConfig } from 'vitest/config';
 import path from 'path';
 
 export default defineConfig({
-  test: {
-    environment: "jsdom",
-    globals: true,
-    watch: true,
-    setupFiles: 'tests/setup-test.js',
-    deps: {
-        inline: ['vitest-canvas-mock'],
+    test: {
+        environment: 'jsdom',
+        globals: true,
+        watch: true,
+        setupFiles: 'tests/setup-test.js',
+        deps: {
+            inline: ['vitest-canvas-mock'],
+        },
+        alias: {
+            '@': path.resolve(__dirname, 'src'),
+            tests: path.resolve(__dirname, 'tests'),
+        },
     },
-    alias: {
-      '@': path.resolve(__dirname, 'src'),
-      'tests': path.resolve(__dirname, 'tests'),
-    },
-  }
-})
+});

package/.eslintrc.js

@@ -1,34 +0,0 @@
-module.exports = {
-  root: true,
-  env: {
-    browser: true,
-    es6: true,
-  },
-  globals: {
-    Rebilly: "readonly",
-  },
-  rules: {
-    'class-methods-use-this': 'off',
-    'import/no-extraneous-dependencies': 'off',
-    'import/prefer-default-export': 'off',
-    'import/extensions': [
-      2,
-      {
-        mjs: 'always',
-        json: 'always',
-      }
-    ],
-    'max-classes-per-file': 'off',
-    'max-len': ['error', {code: 120, ignoreStrings: true, ignoreTemplateLiterals: true, ignoreUrls: true}],
-    'no-useless-catch': 'off',
-    'no-underscore-dangle': 'off',
-    'no-console': 'off',
-    'no-param-reassign': 0,
-    quotes: ["error", "single"],
-  },
-  parser: 'babel-eslint',
-  extends: [
-    'airbnb-base',
-    'prettier',
-  ],
-};

package/.prettierrc.js

@@ -1,11 +0,0 @@
-module.exports = {
-  semi: true,
-  tabWidth: 2,
-  useTabs: false,
-  printWidth: 80,
-  endOfLine: 'auto',
-  trailingComma: 'none',
-  bracketSpacing: true,
-  arrowParens: 'always',
-  singleQuote: true,
-}