feat: enhance testing setup and improve error handling in CardField

Author: edwin-joseph-cko

.github/workflows/ci.yml

@@ -0,0 +1,31 @@
+name: "CI"
+
+on: [pull_request]
+
+jobs:
+  build:
+    name: "Build and test"
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Cache node modules
+        id: cache-nodemodules
+        uses: actions/cache@v4
+        with:
+          path: |
+            node_modules
+          key: ${{ runner.os }}-build-cache-node-modules-${{ hashFiles('./yarn.lock') }}
+          restore-keys: |
+            ${{ runner.os }}-build-cache-node-modules-
+
+      - name: Install dependencies
+        if: steps.cache-nodemodules.outputs.cache-hit != 'true'
+        run: yarn install --prefer-offline --frozen-lockfile
+
+      - name: Build
+        run: yarn build
+
+      - name: Test
+        run: yarn test:built

package.json

@@ -18,7 +18,10 @@
     "append-debug-mode": "node scripts/append-script-metadata.js --debug",
     "append-debug-host": "node scripts/append-script-metadata.js --debug-host",
     "append-version": "node scripts/append-script-metadata.js --version",
-    "bump-version": "yarn version"
+    "bump-version": "yarn version",
+    "test": "yarn build && vitest run",
+    "test:built": "vitest run",
+    "test:watch": "vitest"
   },
   "devDependencies": {
     "@eslint/js": "^9.19.0",
@@ -28,14 +31,17 @@
     "eslint": "^9.19.0",
     "eslint-config-prettier": "^10.0.1",
     "globals": "^15.14.0",
+    "happy-dom": "^20.4.0",
     "husky": "^9.1.7",
+    "jsdom": "^28.0.0",
     "lint-staged": "^15.4.3",
     "prettier": "^3.4.2",
     "tsc-watch": "^6.2.1",
     "typescript": "^5.7.3",
     "typescript-eslint": "^8.23.0",
     "uglify-js": "3.8.0",
-    "vite": "^6.1.0"
+    "vite": "^6.1.0",
+    "vitest": "^4.0.18"
   },
   "lint-staged": {
     "*.{ts,json}": "eslint --cache --fix --no-warn-ignored"

src/apm/StateManager.ts

@@ -31,6 +31,8 @@ module ProcessOut {
     // Optional cleanup callback when component is removed
     onDestroy?: (id: string, state: any) => void;
   }
+
+  type ScheduleFunction = (callback: FrameRequestCallback) => number | ReturnType<typeof setTimeout>;
 
   export class StateManager {
     private static instance: StateManager | null = null;
@@ -171,7 +173,7 @@ module ProcessOut {
       this.isBatchScheduled = true;
 
       // Use requestAnimationFrame to batch updates, with fallback for IE 11
-      let scheduleFunction = requestAnimationFrame;
+      let scheduleFunction: ScheduleFunction = requestAnimationFrame;
 
       if (!scheduleFunction) {
         scheduleFunction = function(callback: FrameRequestCallback) { return setTimeout(() => callback(performance.now()), 16); };
@@ -214,7 +216,7 @@ module ProcessOut {
       this.pendingCallbacks.length = 0;
 
       if (callbacks.length > 0) {
-        let scheduleFunction = requestAnimationFrame
+        let scheduleFunction: ScheduleFunction = requestAnimationFrame
 
         if (!scheduleFunction) {
           scheduleFunction = function(callback: FrameRequestCallback) { return setTimeout(() => callback(performance.now()), 16); };

src/processout/actionhandler.ts

@@ -484,7 +484,7 @@ module ProcessOut {
             return wrapper;
         }
 
-        protected listenEvents(newWindow: Window, timer: number,
+        protected listenEvents(newWindow: Window, timer: ReturnType<typeof setTimeout>,
             refocus: ()                => void,
             success: (data: any)       => void,
             error:   (err:  Exception) => void): void {