@merchi/cart 1.4.4 → 1.4.5

package/lib/stripe/actions.js

@@ -3,6 +3,8 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.completeTestPayment = completeTestPayment;
+exports.fetchTestPublishableKey = fetchTestPublishableKey;
 exports.stripeCardFormSubmit = stripeCardFormSubmit;
 exports.stripeInitPromise = stripeInitPromise;
 exports.stripePaymentButtonSubmit = stripePaymentButtonSubmit;
@@ -32,14 +34,112 @@ function _stripeInitPromise() {
   }));
   return _stripeInitPromise.apply(this, arguments);
 }
-function createPaymentIntent(_x2, _x3, _x4) {
+function fetchTestPublishableKey(_x2) {
+  return _fetchTestPublishableKey.apply(this, arguments);
+}
+function _fetchTestPublishableKey() {
+  _fetchTestPublishableKey = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2(apiUrl) {
+    var response, data;
+    return _regenerator().w(function (_context2) {
+      while (1) switch (_context2.n) {
+        case 0:
+          _context2.n = 1;
+          return fetch("".concat(apiUrl, "stripe/test_publishable_key/"), {
+            method: 'GET',
+            mode: 'cors'
+          });
+        case 1:
+          response = _context2.v;
+          if (!(response && typeof response.json === 'function')) {
+            _context2.n = 5;
+            break;
+          }
+          if (response.ok) {
+            _context2.n = 2;
+            break;
+          }
+          throw new Error('Stripe test keys are not configured');
+        case 2:
+          _context2.n = 3;
+          return response.json();
+        case 3:
+          data = _context2.v;
+          if (!(!data || !data.key)) {
+            _context2.n = 4;
+            break;
+          }
+          throw new Error('Stripe test keys are not configured');
+        case 4:
+          return _context2.a(2, data.key);
+        case 5:
+          if (!(!response || !response.key)) {
+            _context2.n = 6;
+            break;
+          }
+          throw new Error('Stripe test keys are not configured');
+        case 6:
+          return _context2.a(2, response.key);
+      }
+    }, _callee2);
+  }));
+  return _fetchTestPublishableKey.apply(this, arguments);
+}
+function completeTestPayment(_x3, _x4) {
+  return _completeTestPayment.apply(this, arguments);
+}
+function _completeTestPayment() {
+  _completeTestPayment = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee3(apiUrl, cart) {
+    var query, response, message, _data, data, _t;
+    return _regenerator().w(function (_context3) {
+      while (1) switch (_context3.p = _context3.n) {
+        case 0:
+          query = new URLSearchParams({
+            cart_token: cart.token
+          }).toString();
+          _context3.n = 1;
+          return fetch("".concat(apiUrl, "carts/").concat(cart.id, "/complete_test_payment/?").concat(query), {
+            method: 'POST',
+            mode: 'cors'
+          });
+        case 1:
+          response = _context3.v;
+          if (response.ok) {
+            _context3.n = 6;
+            break;
+          }
+          message = 'Unable to complete the test order.';
+          _context3.p = 2;
+          _context3.n = 3;
+          return response.json();
+        case 3:
+          _data = _context3.v;
+          message = _data.message || _data.errorMessage || message;
+          _context3.n = 5;
+          break;
+        case 4:
+          _context3.p = 4;
+          _t = _context3.v;
+        case 5:
+          throw new Error(message);
+        case 6:
+          _context3.n = 7;
+          return response.json();
+        case 7:
+          data = _context3.v;
+          return _context3.a(2, data.invoice);
+      }
+    }, _callee3, null, [[2, 4]]);
+  }));
+  return _completeTestPayment.apply(this, arguments);
+}
+function createPaymentIntent(_x5, _x6, _x7) {
   return _createPaymentIntent.apply(this, arguments);
 }
 function _createPaymentIntent() {
-  _createPaymentIntent = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2(apiUrl, cart, paymentMethodType) {
+  _createPaymentIntent = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee4(apiUrl, cart, paymentMethodType) {
     var id, token, fetchOptions, queryParams, queryString, uri, url, response;
-    return _regenerator().w(function (_context2) {
-      while (1) switch (_context2.n) {
+    return _regenerator().w(function (_context4) {
+      while (1) switch (_context4.n) {
         case 0:
           id = cart.id, token = cart.token;
           fetchOptions = {
@@ -53,33 +153,33 @@ function _createPaymentIntent() {
           queryString = new URLSearchParams(queryParams).toString();
           uri = "stripe/payment_intent/cart/".concat(id, "/");
           url = "".concat(apiUrl).concat(uri, "?").concat(queryString);
-          _context2.n = 1;
+          _context4.n = 1;
           return fetch(url, fetchOptions);
         case 1:
-          response = _context2.v;
+          response = _context4.v;
           if (response.ok) {
-            _context2.n = 2;
+            _context4.n = 2;
             break;
           }
           throw new Error("Failed to create payment intent.");
         case 2:
-          _context2.n = 3;
+          _context4.n = 3;
           return response.json();
         case 3:
-          return _context2.a(2, _context2.v);
+          return _context4.a(2, _context4.v);
       }
-    }, _callee2);
+    }, _callee4);
   }));
   return _createPaymentIntent.apply(this, arguments);
 }
-function checkPaymentIntnetIsComplete(_x5, _x6) {
+function checkPaymentIntnetIsComplete(_x8, _x9) {
   return _checkPaymentIntnetIsComplete.apply(this, arguments);
 }
 function _checkPaymentIntnetIsComplete() {
-  _checkPaymentIntnetIsComplete = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee3(apiUrl, cart) {
+  _checkPaymentIntnetIsComplete = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee5(apiUrl, cart) {
     var url, fetchOptions, queryString, response, i;
-    return _regenerator().w(function (_context3) {
-      while (1) switch (_context3.n) {
+    return _regenerator().w(function (_context5) {
+      while (1) switch (_context5.n) {
         case 0:
           url = "stripe/payment_intent/cart/complete/".concat(cart.id, "/");
           fetchOptions = {
@@ -89,112 +189,112 @@ function _checkPaymentIntnetIsComplete() {
           queryString = new URLSearchParams({
             cart_token: cart.token
           }).toString();
-          _context3.n = 1;
+          _context5.n = 1;
           return fetch("".concat(apiUrl).concat(url, "?").concat(queryString), fetchOptions);
         case 1:
-          response = _context3.v;
+          response = _context5.v;
           if (response.ok) {
-            _context3.n = 2;
+            _context5.n = 2;
             break;
           }
           throw new Error("Failed to check if payment intent is complete.");
         case 2:
-          _context3.n = 3;
+          _context5.n = 3;
           return response.json();
         case 3:
-          i = _context3.v;
-          return _context3.a(2, i.invoice);
+          i = _context5.v;
+          return _context5.a(2, i.invoice);
       }
-    }, _callee3);
+    }, _callee5);
   }));
   return _checkPaymentIntnetIsComplete.apply(this, arguments);
 }
-function stripeCardFormSubmit(_x7, _x8, _x9, _x0) {
+function stripeCardFormSubmit(_x0, _x1, _x10, _x11) {
   return _stripeCardFormSubmit.apply(this, arguments);
 }
 function _stripeCardFormSubmit() {
-  _stripeCardFormSubmit = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee4(apiUrl, stripe, card, cart) {
-    var intent, stripePayment, _t;
-    return _regenerator().w(function (_context4) {
-      while (1) switch (_context4.p = _context4.n) {
+  _stripeCardFormSubmit = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee6(apiUrl, stripe, card, cart) {
+    var intent, stripePayment, _t2;
+    return _regenerator().w(function (_context6) {
+      while (1) switch (_context6.p = _context6.n) {
         case 0:
-          _context4.p = 0;
-          _context4.n = 1;
+          _context6.p = 0;
+          _context6.n = 1;
           return createPaymentIntent(apiUrl, cart);
         case 1:
-          intent = _context4.v;
-          _context4.n = 2;
+          intent = _context6.v;
+          _context6.n = 2;
           return stripe.confirmCardPayment(intent.stripeClientSecret, {
             payment_method: {
               card: card
             }
           });
         case 2:
-          stripePayment = _context4.v;
+          stripePayment = _context6.v;
           if (!stripePayment.error) {
-            _context4.n = 3;
+            _context6.n = 3;
             break;
           }
           throw new Error(stripePayment.error.message || 'Stripe connect unknown error');
         case 3:
-          _context4.n = 4;
+          _context6.n = 4;
           return checkPaymentIntnetIsComplete(apiUrl, cart);
         case 4:
-          return _context4.a(2, _context4.v);
+          return _context6.a(2, _context6.v);
         case 5:
-          _context4.p = 5;
-          _t = _context4.v;
-          throw _t;
+          _context6.p = 5;
+          _t2 = _context6.v;
+          throw _t2;
         case 6:
-          return _context4.a(2);
+          return _context6.a(2);
       }
-    }, _callee4, null, [[0, 5]]);
+    }, _callee6, null, [[0, 5]]);
   }));
   return _stripeCardFormSubmit.apply(this, arguments);
 }
-function stripePaymentButtonSubmit(_x1, _x10, _x11, _x12) {
+function stripePaymentButtonSubmit(_x12, _x13, _x14, _x15) {
   return _stripePaymentButtonSubmit.apply(this, arguments);
 }
 function _stripePaymentButtonSubmit() {
-  _stripePaymentButtonSubmit = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee5(apiUrl, stripe, cart, paymentMethodEvent) {
-    var complete, paymentMethod, intent, stripePayment, _t2;
-    return _regenerator().w(function (_context5) {
-      while (1) switch (_context5.p = _context5.n) {
+  _stripePaymentButtonSubmit = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee7(apiUrl, stripe, cart, paymentMethodEvent) {
+    var complete, paymentMethod, intent, stripePayment, _t3;
+    return _regenerator().w(function (_context7) {
+      while (1) switch (_context7.p = _context7.n) {
         case 0:
           complete = paymentMethodEvent.complete, paymentMethod = paymentMethodEvent.paymentMethod;
-          _context5.p = 1;
-          _context5.n = 2;
+          _context7.p = 1;
+          _context7.n = 2;
           return createPaymentIntent(apiUrl, cart);
         case 2:
-          intent = _context5.v;
-          _context5.n = 3;
+          intent = _context7.v;
+          _context7.n = 3;
           return stripe.confirmCardPayment(intent.stripeClientSecret, {
             payment_method: paymentMethod.id
           }, {
             handleActions: false
           });
         case 3:
-          stripePayment = _context5.v;
+          stripePayment = _context7.v;
           if (!stripePayment.error) {
-            _context5.n = 4;
+            _context7.n = 4;
             break;
           }
           throw new Error(stripePayment.error.message || 'Stripe unknown error');
         case 4:
           complete('success');
-          _context5.n = 5;
+          _context7.n = 5;
           return checkPaymentIntnetIsComplete(apiUrl, cart);
         case 5:
-          return _context5.a(2, _context5.v);
+          return _context7.a(2, _context7.v);
         case 6:
-          _context5.p = 6;
-          _t2 = _context5.v;
+          _context7.p = 6;
+          _t3 = _context7.v;
           complete('fail');
-          throw _t2;
+          throw _t3;
         case 7:
-          return _context5.a(2);
+          return _context7.a(2);
       }
-    }, _callee5, null, [[1, 6]]);
+    }, _callee7, null, [[1, 6]]);
   }));
   return _stripePaymentButtonSubmit.apply(this, arguments);
 }

package/lib/stripe/actions.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/utilities/cookie.d.ts

@@ -1,4 +1,4 @@
 export declare function getCookie(name: string, defaultValue: any): Promise<any>;
-export declare function getCartCookie(domainId: number | string): Promise<string[]>;
-export declare function getCartCookieToken(domainId: number | string): Promise<string>;
-export declare const setCartCookie: (storeId: number, cart: any, domain?: any) => Promise<void>;
+export declare function getCartCookie(domainId: number | string, isTest?: boolean): Promise<string[]>;
+export declare function getCartCookieToken(domainId: number | string, isTest?: boolean): Promise<string>;
+export declare const setCartCookie: (storeId: number, cart: any, domain?: any, isTest?: boolean) => Promise<void>;

package/lib/utilities/cookie.js

@@ -8,6 +8,7 @@ exports.getCartCookieToken = getCartCookieToken;
 exports.getCookie = getCookie;
 exports.setCartCookie = void 0;
 var _browserOrNode = require("browser-or-node");
+var _test_checkout = require("./test_checkout");
 function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i["return"]) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
 function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine2(e, r, n, t); }
 function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
@@ -61,17 +62,18 @@ function _getCookie() {
   }));
   return _getCookie.apply(this, arguments);
 }
-function getCartCookie(_x3) {
+function getCartCookie(_x3, _x4) {
   return _getCartCookie.apply(this, arguments);
 }
 function _getCartCookie() {
-  _getCartCookie = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee3(domainId) {
-    var idAndToken;
+  _getCartCookie = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee3(domainId, isTest) {
+    var test, idAndToken;
     return _regenerator().w(function (_context3) {
       while (1) switch (_context3.n) {
         case 0:
+          test = isTest !== null && isTest !== void 0 ? isTest : (0, _test_checkout.readTestCheckoutFlag)();
           _context3.n = 1;
-          return getCookie("cart-".concat(domainId), null);
+          return getCookie((0, _test_checkout.cartCookieName)(domainId, test), null);
         case 1:
           idAndToken = _context3.v;
           return _context3.a(2, idAndToken ? idAndToken.split(',') : null);
@@ -80,11 +82,11 @@ function _getCartCookie() {
   }));
   return _getCartCookie.apply(this, arguments);
 }
-function getCartCookieToken(_x4) {
+function getCartCookieToken(_x5, _x6) {
   return _getCartCookieToken.apply(this, arguments);
 }
 function _getCartCookieToken() {
-  _getCartCookieToken = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee4(domainId) {
+  _getCartCookieToken = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee4(domainId, isTest) {
     var cartIdAndToken, _t;
     return _regenerator().w(function (_context4) {
       while (1) switch (_context4.n) {
@@ -94,7 +96,7 @@ function _getCartCookieToken() {
             break;
           }
           _context4.n = 1;
-          return getCartCookie(Number(domainId));
+          return getCartCookie(Number(domainId), isTest);
         case 1:
           _t = _context4.v;
           _context4.n = 3;
@@ -109,7 +111,7 @@ function _getCartCookieToken() {
   }));
   return _getCartCookieToken.apply(this, arguments);
 }
-function setSessionCookie(_x5, _x6, _x7) {
+function setSessionCookie(_x7, _x8, _x9) {
   return _setSessionCookie.apply(this, arguments);
 }
 function _setSessionCookie() {
@@ -146,20 +148,21 @@ function _setSessionCookie() {
   return _setSessionCookie.apply(this, arguments);
 }
 var setCartCookie = exports.setCartCookie = /*#__PURE__*/function () {
-  var _ref = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(storeId, cart, domain) {
-    var cookieValue;
+  var _ref = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(storeId, cart, domain, isTest) {
+    var test, cookieValue;
     return _regenerator().w(function (_context) {
       while (1) switch (_context.n) {
         case 0:
+          test = isTest !== null && isTest !== void 0 ? isTest : cart ? Boolean(cart.isTest) : (0, _test_checkout.readTestCheckoutFlag)();
           cookieValue = cart ? cart.id + ',' + cart.token : '';
           _context.n = 1;
-          return setSessionCookie('cart-' + String(storeId), cookieValue, domain);
+          return setSessionCookie((0, _test_checkout.cartCookieName)(storeId, test), cookieValue, domain);
         case 1:
           return _context.a(2);
       }
     }, _callee);
   }));
-  return function setCartCookie(_x8, _x9, _x0) {
+  return function setCartCookie(_x0, _x1, _x10, _x11) {
     return _ref.apply(this, arguments);
   };
 }();

package/lib/utilities/index.d.ts

@@ -10,5 +10,6 @@ export * from './local_storage';
 export * from './product';
 export * from './shipment';
 export * from './tabs';
+export * from './test_checkout';
 export * from './user';
 export * from './variations';

package/lib/utilities/index.js

@@ -135,6 +135,17 @@ Object.keys(_tabs).forEach(function (key) {
     }
   });
 });
+var _test_checkout = require("./test_checkout");
+Object.keys(_test_checkout).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _test_checkout[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _test_checkout[key];
+    }
+  });
+});
 var _user = require("./user");
 Object.keys(_user).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/lib/utilities/test_checkout.d.ts

@@ -0,0 +1,6 @@
+export declare const TEST_CHECKOUT_QUERY = "merchi_test_checkout";
+export declare const TEST_CHECKOUT_STORAGE_KEY = "merchi_test_checkout";
+export declare const TEST_CARD_NUMBER = "4242 4242 4242 4242";
+export declare function readTestCheckoutFlag(): boolean;
+export declare function persistTestCheckoutFlag(): boolean;
+export declare function cartCookieName(domainId: number | string, isTest?: boolean): string;

package/lib/utilities/test_checkout.js

@@ -0,0 +1,34 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TEST_CHECKOUT_STORAGE_KEY = exports.TEST_CHECKOUT_QUERY = exports.TEST_CARD_NUMBER = void 0;
+exports.cartCookieName = cartCookieName;
+exports.persistTestCheckoutFlag = persistTestCheckoutFlag;
+exports.readTestCheckoutFlag = readTestCheckoutFlag;
+var TEST_CHECKOUT_QUERY = exports.TEST_CHECKOUT_QUERY = 'merchi_test_checkout';
+var TEST_CHECKOUT_STORAGE_KEY = exports.TEST_CHECKOUT_STORAGE_KEY = 'merchi_test_checkout';
+var TEST_CARD_NUMBER = exports.TEST_CARD_NUMBER = '4242 4242 4242 4242';
+function readTestCheckoutFlag() {
+  if (typeof window === 'undefined') {
+    return false;
+  }
+  try {
+    var params = new URLSearchParams(window.location.search);
+    if (params.get(TEST_CHECKOUT_QUERY) === '1') {
+      window.localStorage.setItem(TEST_CHECKOUT_STORAGE_KEY, '1');
+      return true;
+    }
+    return window.localStorage.getItem(TEST_CHECKOUT_STORAGE_KEY) === '1';
+  } catch (_unused) {
+    return false;
+  }
+}
+function persistTestCheckoutFlag() {
+  return readTestCheckoutFlag();
+}
+function cartCookieName(domainId) {
+  var isTest = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+  return isTest ? "cart-".concat(domainId, "-test") : "cart-".concat(domainId);
+}

package/lib/utilities/test_checkout.test.d.ts

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@merchi/cart",
-  "version": "1.4.4",
+  "version": "1.4.5",
   "description": "Merchi's cart",
   "source": "src/index.ts",
   "main": "lib/index.js",
@@ -18,7 +18,7 @@
     "copy-assets": "copyfiles -u 1 src/assets/**/* esm && copyfiles -u 1 src/assets/**/* lib",
     "compile-sass": "sass src/styles/globals.scss esm/styles/globals.css && sass src/styles/globals.scss lib/styles/globals.css",
     "start": "react-scripts start",
-    "test": "react-scripts test",
+    "test": "jest",
     "eject": "react-scripts eject"
   },
   "repository": {
@@ -81,9 +81,12 @@
     "copyfiles": "^2.4.1",
     "eslint": "8.47.0",
     "eslint-config-next": "13.4.16",
+    "jest": "28",
+    "jest-environment-jsdom": "28",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
     "sass": "^1.70.0",
+    "ts-jest": "28",
     "typescript": "^5.1.6"
   },
   "dependencies": {
@@ -95,9 +98,9 @@
     "browser-or-node": "^3.0.0-pre.0",
     "js-cookie": "^3.0.5",
     "lodash": "^4.17.21",
-    "@merchi/product-form": "^1.19.12",
-    "@merchi/product-form-sdk": "^1.0.9",
-    "@merchi/sdk": "^1.40.2",
+    "@merchi/product-form": "^1.19.13",
+    "@merchi/product-form-sdk": "^1.0.10",
+    "@merchi/sdk": "^1.42.0",
     "react-country-region-selector": "^3.6.1",
     "react-hook-form": "7.45.4",
     "react-icons": "^4.10.1",

package/src/CartProvider.tsx

@@ -20,6 +20,7 @@ import {
   saveCheckoutAddress,
 } from './utilities/local_storage';
 import { makeUser } from './utilities/user';
+import { persistTestCheckoutFlag, readTestCheckoutFlag } from './utilities/test_checkout';
 
 export interface PropsCart {
   cart: any;
@@ -620,10 +621,24 @@ const CartProvider = ({
   async function createCartAndCookie(callback?: () => void) {
     setFetchingCart(true);
     try {
-      const cart = makeCart({domain: {id: domainId}}, true);
-      await cart.create({embed: cartEmbed});
+      const isTest = readTestCheckoutFlag();
+      const cart = makeCart({domain: {id: domainId}, isTest}, true);
+      if (isTest) {
+        const created = await merchi.authenticatedFetch('/carts/', {
+          method: 'POST',
+          body: cart.toFormData(),
+          query: [
+            ['embed', JSON.stringify(cartEmbed)],
+            ['skip_rights', 'y'],
+            ['is_test', 'true'],
+          ],
+        });
+        cart.fromJson(created.cart);
+      } else {
+        await cart.create({embed: cartEmbed});
+      }
       let cartJson = await cart.toJson();
-      if (domainId) setCartCookie(Number(domainId), cartJson, undefined);
+      if (domainId) setCartCookie(Number(domainId), cartJson, undefined, isTest);
       cartJson = await attachSavedClientIfNeeded(cartJson);
       setCart({...cartJson});
       if (callback) callback();
@@ -643,7 +658,12 @@ const CartProvider = ({
     try {
       const cart = await merchi.Cart.get(id, {embed: cartEmbed});
       let cartJson = await cart.toJson();
-      if (stripeIsValidAndActive(cartJson)) {
+      const isTest = readTestCheckoutFlag();
+      if (Boolean(cartJson.isTest) !== isTest) {
+        await createCartAndCookie();
+        return;
+      }
+      if (stripeIsValidAndActive(cartJson) || isTest) {
         cartJson = await attachSavedClientIfNeeded(cartJson);
         setCart({...cartJson});
       } else {
@@ -833,6 +853,7 @@ const CartProvider = ({
   }
 
   useEffect(() => {
+    persistTestCheckoutFlag();
     if (domainId) actionGetMerchiCart();
     if (domainId && includeTheme) actionFetchTheme(); 
   }, [domainId]);

package/src/stripe/LegacyStripeCardForm.tsx

@@ -3,6 +3,7 @@ import { useEffect, useState } from 'react';
 import { ButtonPay } from '../buttons';
 import FormStripeCardFields from './StripeCardFields';
 import {
+  fetchTestPublishableKey,
   stripeCardFormSubmit,
   stripeInitPromise,
   stripePaymentButtonSubmit,
@@ -28,6 +29,7 @@ function StripeCardForm() {
   const { domain } = cart;
   const [error, setError] = useState(({} as any));
   const company = domain.company;
+  const isTestCheckout = Boolean(cart.isTest);
   const hasCompanyPubKey = Boolean(company.isStripeValid && companyStripePubKeyOrTestPubKey(company));
   const companyPubKey = hasCompanyPubKey ? companyStripePubKeyOrTestPubKey(company) : '';
   const canUseConnect = !!company.stripeAccountId;
@@ -66,13 +68,17 @@ function StripeCardForm() {
       setError({message: e.errorMessage || e.message || 'Unable to process card.'});
     }
   }
-  const [stripePublicKey, setStripePublicKey] = useState(companyPubKey);
+  const [stripePublicKey, setStripePublicKey] = useState(isTestCheckout ? '' : companyPubKey);
   useEffect(() => {
+    if (isTestCheckout) {
+      fetchTestPublishableKey(url).then(setStripePublicKey).catch(() => setStripePublicKey(''));
+      return;
+    }
     if (!stripePublicKey && canUseConnect) stripeInitPromise(url).then(setStripePublicKey)
-  }, [stripePublicKey, canUseConnect]);
+  }, [stripePublicKey, canUseConnect, isTestCheckout, url]);
   return (
     <>
-      {company.isTesting && badgeTestMode}
+      {!isTestCheckout && company.isTesting && badgeTestMode}
       <FormStripeCardFields
         doStripePayment={doStripePayment}
         doStripePaymentRequestForButton={doStripePaymentRequestForButton}