chore: migrate to vitest

.github/workflows/main.yml

@@ -29,14 +29,7 @@ jobs:
       - name: ▶️ Run build script
         run: npm run build
 
-      - name: ⬆️ Upload client coverage report
+      - name: ⬆️ Upload coverage report
         uses: codecov/codecov-action@v3
         with:
-          directory: ./coverage/karma
-          flags: client
-
-      - name: ⬆️ Upload server coverage report
-        uses: codecov/codecov-action@v3
-        with:
-          directory: ./coverage/jest
-          flags: server
+          directory: ./coverage

babel.config.js

@@ -2,5 +2,6 @@
 /* eslint import/no-commonjs: off */
 
 module.exports = {
-  extends: "@krakenjs/babel-config-grumbler/babelrc-node",
+  extends: "@krakenjs/grumbler-scripts/config/.babelrc-node",
+  presets: ["@krakenjs/babel-config-grumbler/flow-ts-babel-preset"],
 };

package.json

@@ -11,8 +11,7 @@
     "doc": "esdoc",
     "flow": "flow",
     "flow-typed": "rm -rf ./flow-typed && flow-typed install",
-    "karma": "cross-env NODE_ENV=test babel-node --plugins=transform-es2015-modules-commonjs ./node_modules/.bin/karma start",
-    "lint": "eslint src/ server/ test/ *.js",
+    "lint": "eslint src/ server/ *.js",
     "reinstall": "rimraf flow-typed && rimraf node_modules && npm install && flow-typed install",
     "release": "./publish.sh",
     "release:major": "./publish.sh major",
@@ -21,9 +20,10 @@
     "setup": "npm install && npm run flow-typed",
     "format": "prettier --write --ignore-unknown .",
     "format:check": "prettier --check .",
-    "test": "npm run format:check && npm run lint && npm run flow-typed && npm run flow && npm run jest && npm run karma",
+    "test": "npm run format:check && npm run lint && npm run flow-typed && npm run flow && npm run test:unit",
     "webpack": "babel-node --plugins=transform-es2015-modules-commonjs ./node_modules/.bin/webpack --progress",
-    "jest": "jest test/server --env=node --no-cache --collectCoverageFrom='server/' --coverageDirectory='coverage/jest' --coverage --verbose --runInBand --silent=false",
+    "test:unit:watch": "vitest",
+    "test:unit": "vitest run --coverage",
     "prepublishOnly": "npm run babel",
     "postpublish": "rm -rf ./server && git checkout ./server",
     "validate-codecov": "curl --data-binary @.github/codecov.yml https://codecov.io/validate",
@@ -62,8 +62,10 @@
     "bowser": "^2.0.0"
   },
   "devDependencies": {
+    "@bunchtogether/vite-plugin-flow": "^1.0.2",
+    "@krakenjs/babel-config-grumbler": "^8.1.1",
+    "@krakenjs/eslint-config-grumbler": "^8.1.1",
     "@krakenjs/grumbler-scripts": "^8.0.4",
-    "@krakenjs/sync-browser-mocks": "^3.0.0",
     "babel-core": "7.0.0-bridge.0",
     "cheerio": "1.0.0-rc.9",
     "cross-env": "^7.0.3",
@@ -73,10 +75,13 @@
     "flow-bin": "0.155.0",
     "flow-typed": "^3.8.0",
     "husky": "^8.0.1",
-    "jest": "^29.3.1",
+    "jsdom": "^20.0.3",
     "lint-staged": "^13.0.3",
-    "mocha": "^10.0.0",
-    "prettier": "2.8.8"
+    "prettier": "2.8.8",
+    "@vitest/coverage-v8": "^1.0.0",
+    "@vitest/ui": "^1.0.0",
+    "vite": "^4.0.1",
+    "vitest": "^1.0.0"
   },
   "lint-staged": {
     "**/*": "prettier --write --ignore-unknown"

server/babel.config.js

@@ -2,5 +2,6 @@
 /* eslint import/no-commonjs: off */
 
 module.exports = {
-  extends: "@krakenjs/babel-config-grumbler/babelrc-node",
+  extends: "@krakenjs/grumbler-scripts/config/.babelrc-node",
+  presets: ["@krakenjs/babel-config-grumbler/flow-ts-babel-preset"],
 };

test/server/meta.integration.test.js → server/meta.integration.test.js

@@ -1,8 +1,9 @@
 /* @flow */
 
 import cheerio from "cheerio";
+import { test } from "vitest";
 
-import { unpackSDKMeta } from "../../server";
+import { unpackSDKMeta } from ".";
 
 /**
  * List with real URL query parameters.

test/server/meta.test.js → server/meta.test.js

@@ -2,8 +2,9 @@
 /* eslint max-lines: off */
 
 import cheerio from "cheerio";
+import { test, afterEach } from "vitest";
 
-import { unpackSDKMeta } from "../../server";
+import { unpackSDKMeta } from ".";
 
 afterEach(() => {
   // eslint-disable-next-line no-process-env

src/api.test.js

@@ -0,0 +1,150 @@
+/* @flow */
+import { describe, beforeEach, it, expect, vi } from "vitest";
+import { getCurrentScript, request, memoize } from "@krakenjs/belter/src";
+
+import { createAccessToken, createOrder } from "./api";
+
+vi.mock("@krakenjs/belter/src", async () => {
+  const actual = await vi.importActual("@krakenjs/belter/src");
+  return {
+    ...actual,
+    getCurrentScript: vi.fn(),
+    request: vi.fn().mockResolvedValue(),
+  };
+});
+
+describe("api cases", () => {
+  let order;
+  const invalidClientId = "invalid-client-id";
+  const emptyResponseClientId = "empty-response-client-id";
+  const createOrderValidId = "create-order-valid-order-id";
+  const expectedToken =
+    "A21AAKNZBaqilFBC4dVVz-tr-ySIT78NREeBidy3lkGdr-EA8wbhGrByPayhgnJRPE5xg4QW46moDbCFjZ13i1GH-Ax4SjtjA";
+  const defaultAuthResponse = {
+    scope: "https://uri.paypal.com/services/invoicing",
+    access_token: expectedToken,
+    token_type: "Bearer",
+    app_id: "APP-80W284485P519543T",
+    expires_in: 31838,
+    nonce: "2022-03-07T22:41:38ZqHkiC0_odfzFwo27_X0wVuF67STYq39KRplBeeyY2bk",
+    error: null,
+  };
+
+  beforeEach(() => {
+    memoize.clear();
+    window.__PAYPAL_DOMAIN__ = "testurl";
+    // $FlowIgnore
+    getCurrentScript.mockReturnValue({
+      src: `https://sdkplz.com/sdk/js?intent=capture`,
+      attributes: [],
+    });
+    vi.clearAllMocks();
+
+    order = {
+      intent: "CAPTURE",
+      purchase_units: [
+        {
+          amount: {
+            value: "10.00",
+            currency_code: "USD",
+          },
+        },
+      ],
+    };
+  });
+
+  describe("createAccessToken()", () => {
+    it("createAccessToken should return a valid token", async () => {
+      // $FlowIgnore
+      request.mockResolvedValueOnce({ body: defaultAuthResponse });
+
+      const result = await createAccessToken("testClient");
+
+      expect(result).toEqual(expectedToken);
+    });
+
+    it("createAccessToken should throw invalid client argument error", async () => {
+      // $FlowIgnore
+      request.mockResolvedValueOnce({ body: { error: "invalid_client" } });
+
+      await expect(() =>
+        createAccessToken(invalidClientId)
+      ).rejects.toThrowError(/Auth Api invalid client id:/);
+    });
+
+    it("createAccessToken should return an error message when response is an empty object", async () => {
+      // $FlowIgnore
+      request.mockResolvedValueOnce({ body: {} });
+
+      await expect(() =>
+        createAccessToken(emptyResponseClientId)
+      ).rejects.toThrow(/Auth Api response error:/);
+    });
+  });
+
+  describe("createOrder()", () => {
+    it("createOrder should throw an error when clientId is null", () => {
+      // $FlowIgnore
+      expect(() => createOrder(null)).toThrowError(/Client ID not passed/);
+    });
+
+    it("createOrder should throw an error when order is null", () => {
+      // $FlowIgnore
+      expect(() => createOrder("testClient", null)).toThrow(
+        /Expected order details to be passed/
+      );
+    });
+
+    it("createOrder should throw an error when order intent does not match with query parameters intent", () => {
+      const expectedErrorMessage =
+        "Unexpected intent: AUTHORIZE passed to order.create. Please ensure you are passing /sdk/js?intent=authorize in the paypal script tag.";
+
+      order.intent = "AUTHORIZE";
+
+      expect(() => createOrder("testClient", order)).toThrowError(
+        expectedErrorMessage
+      );
+    });
+
+    it("createOrder should throw an error when order currency does not match with query parameters currency", () => {
+      const expectedErrorMessage =
+        "Unexpected currency: AUD passed to order.create. Please ensure you are passing /sdk/js?currency=AUD in the paypal script tag.";
+      order.purchase_units[0].amount.currency_code = "AUD";
+
+      expect(() => createOrder("testClient", order)).toThrow(
+        expectedErrorMessage
+      );
+    });
+
+    it("createOrder should throw an error when order identifier is not in the server response", async () => {
+      const expectedErrorMessage = "Order Api response error:";
+      const failuredPayload = {};
+
+      request
+        // $FlowIgnore
+        .mockResolvedValueOnce({ body: defaultAuthResponse })
+        .mockResolvedValueOnce({ body: failuredPayload });
+
+      await expect(() => createOrder("testClient", order)).rejects.toThrow(
+        expectedErrorMessage
+      );
+    });
+
+    it("createOrder should return a valid orderId", async () => {
+      const expectedOrderId = "9BL31648CM342010L";
+      const mockOrderResponse = {
+        id: expectedOrderId,
+        status: "CREATED",
+        links: [],
+      };
+
+      request
+        // $FlowIgnore
+        .mockResolvedValueOnce({ body: defaultAuthResponse })
+        .mockResolvedValueOnce({ body: mockOrderResponse });
+
+      const result = await createOrder(createOrderValidId, order);
+      expect(result).toEqual(expectedOrderId);
+    });
+  });
+});

src/config.test.js

@@ -0,0 +1,39 @@
+/* @flow */
+import { describe, it, expect } from "vitest";
+
+import {
+  getPayPalLoggerDomain,
+  buildPayPalUrl,
+  buildPayPalAPIUrl,
+  getPayPalLoggerUrl,
+} from "./domains";
+
+describe(`config cases`, () => {
+  it("should successfully get the global paypal logger domain", () => {
+    const expectedDomain = "mock://www.paypal.com";
+    window.__PAYPAL_DOMAIN__ = expectedDomain;
+    const domain = getPayPalLoggerDomain();
+    expect(domain).toEqual(expectedDomain);
+  });
+
+  it("should successfully build a paypal url", () => {
+    const expectedPayPalUrl = `${window.location.protocol}//${window.location.host}/foo/bar`;
+    const result = buildPayPalUrl("/foo/bar");
+
+    expect(result).toEqual(expectedPayPalUrl);
+  });
+
+  it("should successfully build a paypal api url", () => {
+    const expectedPayPalUrl = `${window.location.protocol}//${window.location.host}/bar/baz`;
+    const result = buildPayPalAPIUrl("/bar/baz");
+
+    expect(result).toEqual(expectedPayPalUrl);
+  });
+
+  it("should successfully build a paypal logger url", () => {
+    const expectedPayPalUrl = `${window.location.protocol}//${window.location.host}/xoplatform/logger/api/logger`;
+    const result = getPayPalLoggerUrl();
+
+    expect(result).toEqual(expectedPayPalUrl);
+  });
+});

src/domains.js

@@ -8,10 +8,10 @@ import {
 } from "@krakenjs/cross-domain-utils/src";
 
 import {
-  getProtocol,
-  getStageHost,
   getPayPalDomain,
   getPayPalAPIDomain,
+  getStageHost,
+  getProtocol,
 } from "./global";
 import { URI } from "./config";