@solucx/react-native-solucx-widget 0.2.0 → 0.2.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@solucx/react-native-solucx-widget",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "description": "The React Native SDK for Solucx Widget",
   "main": "src/index",
   "author": " <> ()",

package/src/SoluCXWidget.tsx

@@ -6,7 +6,6 @@ import type { SoluCXKey, WidgetData, WidgetOptions, WidgetType, WidgetCallbacks
 import { useWidgetState } from "./hooks/useWidgetState";
 import { WidgetEventService } from "./services/widgetEventService";
 import { WidgetValidationService } from "./services/widgetValidationService";
-import { buildWidgetURL } from "./utils/urlUtils";
 import { WEB_VIEW_MESSAGE_LISTENER } from "./constants/webViewConstants";
 import { ModalWidget } from "./components/ModalWidget";
 import { InlineWidget } from "./components/InlineWidget";
@@ -25,6 +24,11 @@ export const SoluCXWidget: React.FC<SoluCXWidgetProps> = ({ soluCXKey, type, dat
     const webviewRef = useRef<WebView>(null);
     const { width } = Dimensions.get("window");
 
+    if (!data) {
+        callbacks?.onError?.("Widget data is required but was not provided");
+        return;
+    }
+
     const serializedData = JSON.stringify(data);
     const normalizedData = useMemo(() => data, [serializedData]);
 
@@ -38,9 +42,7 @@ export const SoluCXWidget: React.FC<SoluCXWidgetProps> = ({ soluCXKey, type, dat
 
     const validationService = useMemo(() => new WidgetValidationService(userId), [userId]);
     const isForm = Boolean(normalizedData.form_id);
-    const [widgetUri, setWidgetUri] = useState<string | null>(() =>
-        isForm ? buildWidgetURL(soluCXKey, normalizedData) : null,
-    );
+    const [widgetUri, setWidgetUri] = useState<string | null>(null);
 
     useEffect(() => {
         loadSavedData();
@@ -50,12 +52,6 @@ export const SoluCXWidget: React.FC<SoluCXWidgetProps> = ({ soluCXKey, type, dat
         let isActive = true;
 
         const prepareWidgetURL = async () => {
-            if (isForm) {
-                setWidgetUri(buildWidgetURL(soluCXKey, normalizedData));
-                open(); // Show widget in form mode
-                return;
-            }
-
             setWidgetUri(null);
 
             try {
@@ -78,7 +74,13 @@ export const SoluCXWidget: React.FC<SoluCXWidgetProps> = ({ soluCXKey, type, dat
                 callbacks?.onOpened?.(userId);
             } catch (error) {
                 if (isActive) {
-                    callbacks?.onPingError?.(error);
+                    let errorMessage = "Unknown error";
+
+                    if (error instanceof Error) errorMessage = error.message;
+                    else if (typeof error === "string") errorMessage = error;
+                    else if (error !== null && typeof error === "object") errorMessage = JSON.stringify(error);
+
+                    callbacks?.onError?.(errorMessage);
                     setIsWidgetVisible(false);
                 }
             }

package/src/__tests__/SoluCXWidget.rendering.test.tsx

@@ -1,17 +1,15 @@
-import React from 'react';
-import { render, waitFor } from '@testing-library/react-native';
-import { SoluCXWidget } from '../SoluCXWidget';
-import { WidgetData, WidgetOptions } from '../interfaces';
-import { requestWidgetUrl } from '../services/widgetBootstrapService';
-
-jest.mock('react-native-webview', () => {
-    const { forwardRef } = require('react');
-    const { View } = require('react-native');
+import React from "react";
+import { render, waitFor } from "@testing-library/react-native";
+import { SoluCXWidget } from "../SoluCXWidget";
+import { WidgetData, WidgetOptions } from "../interfaces";
+import { requestWidgetUrl } from "../services/widgetBootstrapService";
+
+jest.mock("react-native-webview", () => {
+    const { forwardRef } = require("react");
+    const { View } = require("react-native");
     return {
         __esModule: true,
-        WebView: forwardRef((props: any, ref: any) => (
-            <View testID="webview" {...props} ref={ref} />
-        )),
+        WebView: forwardRef((props: any, ref: any) => <View testID="webview" {...props} ref={ref} />),
     };
 });
 
@@ -21,7 +19,7 @@ const mockSetIsWidgetVisible = jest.fn();
 const mockOpen = jest.fn();
 const mockShouldDisplayWidget = jest.fn();
 
-jest.mock('../hooks/useWidgetState', () => ({
+jest.mock("../hooks/useWidgetState", () => ({
     useWidgetState: () => ({
         widgetHeight: 400,
         isWidgetVisible: true,
@@ -30,59 +28,59 @@ jest.mock('../hooks/useWidgetState', () => ({
         resize: jest.fn(),
         open: mockOpen,
         close: mockClose,
-        userId: 'test-user-123',
+        userId: "test-user-123",
     }),
 }));
 
-jest.mock('../services/widgetEventService', () => ({
+jest.mock("../services/widgetEventService", () => ({
     WidgetEventService: jest.fn().mockImplementation(() => ({
         handleMessage: jest.fn(),
     })),
 }));
 
-jest.mock('../services/widgetValidationService', () => ({
+jest.mock("../services/widgetValidationService", () => ({
     WidgetValidationService: jest.fn().mockImplementation(() => ({
         shouldDisplayWidget: mockShouldDisplayWidget,
     })),
 }));
 
-jest.mock('../services/widgetBootstrapService', () => ({
+jest.mock("../services/widgetBootstrapService", () => ({
     requestWidgetUrl: jest.fn(),
 }));
 
-jest.mock('../constants/Constants', () => ({
-    SDK_NAME: 'rn-widget-sdk',
-    SDK_VERSION: '0.1.16',
+jest.mock("../constants/Constants", () => ({
+    SDK_NAME: "rn-widget-sdk",
+    SDK_VERSION: "0.1.16",
 }));
 
-jest.mock('../services/ClientVersionCollector', () => ({
-    getClientVersion: jest.fn(() => '1.0.0'),
+jest.mock("../services/ClientVersionCollector", () => ({
+    getClientVersion: jest.fn(() => "1.0.0"),
 }));
 
-jest.mock('../hooks/useDeviceInfoCollector', () => ({
+jest.mock("../hooks/useDeviceInfoCollector", () => ({
     getDeviceInfo: jest.fn(() => ({
-        platform: 'ios',
-        osVersion: '16.0',
+        platform: "ios",
+        osVersion: "16.0",
         screenWidth: 390,
         screenHeight: 844,
         windowWidth: 390,
         windowHeight: 844,
         scale: 3,
         fontScale: 1,
-        deviceType: 'phone',
-        model: 'iPhone 14 Pro',
+        deviceType: "phone",
+        model: "iPhone 14 Pro",
     })),
 }));
 
 const mockRequestWidgetUrl = requestWidgetUrl as jest.MockedFunction<typeof requestWidgetUrl>;
-const bootstrappedWidgetUrl = 'https://widgets.solucx.com/widget/bootstrap-result';
+const bootstrappedWidgetUrl = "https://widgets.solucx.com/widget/bootstrap-result";
 
 const baseProps = {
-    soluCXKey: 'test-key-abc',
+    soluCXKey: "test-key-abc",
     data: {
-        customer_id: 'cust-001',
-        transaction_id: 'txn-999',
-        form_id: 'form-123',
+        customer_id: "cust-001",
+        transaction_id: "txn-999",
+        form_id: "form-123",
     } as WidgetData,
     options: {
         height: 400,
@@ -97,219 +95,410 @@ beforeEach(() => {
     mockRequestWidgetUrl.mockResolvedValue(bootstrappedWidgetUrl);
 });
 
-describe('SoluCXWidget type routing', () => {
-    it('should render ModalWidget when type is modal', () => {
-        const { UNSAFE_getByType } = render(
-            <SoluCXWidget {...baseProps} type="modal" />
-        );
+describe("SoluCXWidget type routing", () => {
+    it("should render ModalWidget when type is modal", async () => {
+        mockRequestWidgetUrl.mockResolvedValue(bootstrappedWidgetUrl);
 
-        const modal = UNSAFE_getByType(require('react-native').Modal);
-        expect(modal).toBeTruthy();
-    });
+        const { UNSAFE_getByType } = render(<SoluCXWidget {...baseProps} type="modal" />);
+
+        await waitFor(() => {
+            const modal = UNSAFE_getByType(require("react-native").Modal);
+            expect(modal).toBeTruthy();
+        });
+    }, 10000);
 
-    it('should render close button inside ModalWidget', () => {
-        const { getByText } = render(
-            <SoluCXWidget {...baseProps} type="modal" />
-        );
+    it("should render close button inside ModalWidget", async () => {
+        mockRequestWidgetUrl.mockResolvedValue(bootstrappedWidgetUrl);
+
+        const { getByText } = render(<SoluCXWidget {...baseProps} type="modal" />);
 
-        expect(getByText('✕')).toBeTruthy();
+        await waitFor(() => {
+            expect(getByText("✕")).toBeTruthy();
+        });
     });
 
-    it('should render WebView inside ModalWidget with correct source', () => {
-        const { getByTestId } = render(
-            <SoluCXWidget {...baseProps} type="modal" />
-        );
+    it("should render WebView inside ModalWidget with correct source", async () => {
+        mockRequestWidgetUrl.mockResolvedValue(bootstrappedWidgetUrl);
 
-        const webview = getByTestId('webview');
-        expect(webview.props.source.uri).toContain('test-key-abc');
-        expect(webview.props.source.uri).toContain('txn-999');
+        const { getByTestId } = render(<SoluCXWidget {...baseProps} type="modal" />);
+
+        await waitFor(() => {
+            const webview = getByTestId("webview");
+            expect(webview.props.source.uri).toBe(bootstrappedWidgetUrl);
+        });
     });
 
-    it('should render InlineWidget when type is inline', () => {
-        const { queryByTestId, getByText } = render(
-            <SoluCXWidget {...baseProps} type="inline" />
-        );
+    it("should render InlineWidget when type is inline", async () => {
+        mockRequestWidgetUrl.mockResolvedValue(bootstrappedWidgetUrl);
+
+        const { queryByTestId, getByText } = render(<SoluCXWidget {...baseProps} type="inline" />);
 
-        expect(queryByTestId('webview')).toBeTruthy();
-        expect(getByText('✕')).toBeTruthy();
+        await waitFor(() => {
+            expect(queryByTestId("webview")).toBeTruthy();
+            expect(getByText("✕")).toBeTruthy();
+        });
     });
 
-    it('should not render Modal when type is inline', () => {
-        const { UNSAFE_queryByType } = render(
-            <SoluCXWidget {...baseProps} type="inline" />
-        );
+    it("should not render Modal when type is inline", async () => {
+        mockRequestWidgetUrl.mockResolvedValue(bootstrappedWidgetUrl);
+
+        const { UNSAFE_queryByType } = render(<SoluCXWidget {...baseProps} type="inline" />);
 
-        const modal = UNSAFE_queryByType(require('react-native').Modal);
-        expect(modal).toBeNull();
+        await waitFor(() => {
+            const modal = UNSAFE_queryByType(require("react-native").Modal);
+            expect(modal).toBeNull();
+        });
     });
 
-    it('should render OverlayWidget when type is bottom', () => {
-        const { queryByTestId, getByText } = render(
-            <SoluCXWidget {...baseProps} type="bottom" />
-        );
+    it("should render OverlayWidget when type is bottom", async () => {
+        mockRequestWidgetUrl.mockResolvedValue(bootstrappedWidgetUrl);
 
-        expect(queryByTestId('webview')).toBeTruthy();
-        expect(getByText('✕')).toBeTruthy();
+        const { queryByTestId, getByText } = render(<SoluCXWidget {...baseProps} type="bottom" />);
+
+        await waitFor(() => {
+            expect(queryByTestId("webview")).toBeTruthy();
+            expect(getByText("✕")).toBeTruthy();
+        });
     });
 
-    it('should render OverlayWidget when type is top', () => {
-        const { queryByTestId, getByText } = render(
-            <SoluCXWidget {...baseProps} type="top" />
-        );
+    it("should render OverlayWidget when type is top", async () => {
+        mockRequestWidgetUrl.mockResolvedValue(bootstrappedWidgetUrl);
+
+        const { queryByTestId, getByText } = render(<SoluCXWidget {...baseProps} type="top" />);
 
-        expect(queryByTestId('webview')).toBeTruthy();
-        expect(getByText('✕')).toBeTruthy();
+        await waitFor(() => {
+            expect(queryByTestId("webview")).toBeTruthy();
+            expect(getByText("✕")).toBeTruthy();
+        });
     });
 
-    it('should not render Modal when type is bottom', () => {
-        const { UNSAFE_queryByType } = render(
-            <SoluCXWidget {...baseProps} type="bottom" />
-        );
+    it("should not render Modal when type is bottom", async () => {
+        mockRequestWidgetUrl.mockResolvedValue(bootstrappedWidgetUrl);
+
+        const { UNSAFE_queryByType } = render(<SoluCXWidget {...baseProps} type="bottom" />);
 
-        const modal = UNSAFE_queryByType(require('react-native').Modal);
-        expect(modal).toBeNull();
+        await waitFor(() => {
+            const modal = UNSAFE_queryByType(require("react-native").Modal);
+            expect(modal).toBeNull();
+        });
     });
 
-    it('should call loadSavedData on mount', () => {
+    it("should call loadSavedData on mount", () => {
         render(<SoluCXWidget {...baseProps} type="modal" />);
 
         expect(mockLoadSavedData).toHaveBeenCalledTimes(1);
     });
 });
 
-describe('SoluCXWidget WebView configuration', () => {
-    it('should set originWhitelist to allow all origins', () => {
-        const { getByTestId } = render(
-            <SoluCXWidget {...baseProps} type="modal" />
-        );
+describe("SoluCXWidget WebView configuration", () => {
+    it("should set originWhitelist to allow all origins", async () => {
+        mockRequestWidgetUrl.mockResolvedValue(bootstrappedWidgetUrl);
+
+        const { getByTestId } = render(<SoluCXWidget {...baseProps} type="modal" />);
 
-        const webview = getByTestId('webview');
-        expect(webview.props.originWhitelist).toEqual(['*']);
+        await waitFor(() => {
+            const webview = getByTestId("webview");
+            expect(webview.props.originWhitelist).toEqual(["*"]);
+        });
     });
 
-    it('should set WebView width style to screen width', () => {
-        const { getByTestId } = render(
-            <SoluCXWidget {...baseProps} type="modal" />
-        );
+    it("should set WebView width style to screen width", async () => {
+        mockRequestWidgetUrl.mockResolvedValue(bootstrappedWidgetUrl);
+
+        const { getByTestId } = render(<SoluCXWidget {...baseProps} type="modal" />);
 
-        const webview = getByTestId('webview');
-        const widthStyle = webview.props.style.find(
-            (s: any) => s.width !== undefined
-        );
-        expect(widthStyle.width).toBeGreaterThan(0);
+        await waitFor(() => {
+            const webview = getByTestId("webview");
+            const widthStyle = webview.props.style.find((s: any) => s.width !== undefined);
+            expect(widthStyle.width).toBeGreaterThan(0);
+        });
     });
 
-    it('should set WebView height style to widgetHeight', () => {
-        const { getByTestId } = render(
-            <SoluCXWidget {...baseProps} type="modal" />
-        );
+    it("should set WebView height style to widgetHeight", async () => {
+        mockRequestWidgetUrl.mockResolvedValue(bootstrappedWidgetUrl);
+
+        const { getByTestId } = render(<SoluCXWidget {...baseProps} type="modal" />);
 
-        const webview = getByTestId('webview');
-        const heightStyle = webview.props.style.find(
-            (s: any) => s.height !== undefined
-        );
-        expect(heightStyle.height).toBe(400);
+        await waitFor(() => {
+            const webview = getByTestId("webview");
+            const heightStyle = webview.props.style.find((s: any) => s.height !== undefined);
+            expect(heightStyle.height).toBe(400);
+        });
     });
 
-    it('should build URL containing soluCXKey and transaction_id', () => {
-        const { getByTestId } = render(
-            <SoluCXWidget {...baseProps} type="inline" />
-        );
+    it("should use bootstrapped URL for widgets", async () => {
+        mockRequestWidgetUrl.mockResolvedValue(bootstrappedWidgetUrl);
+
+        const { getByTestId } = render(<SoluCXWidget {...baseProps} type="inline" />);
 
-        const webview = getByTestId('webview');
-        expect(webview.props.source.uri).toContain('test-key-abc');
-        expect(webview.props.source.uri).toContain('transaction_id=txn-999');
+        await waitFor(() => {
+            const webview = getByTestId("webview");
+            expect(webview.props.source.uri).toBe(bootstrappedWidgetUrl);
+        });
     });
+});
+
+describe("SoluCXWidget bootstrap flow", () => {
+    it("fetches widget URL for form widgets", async () => {
+        mockRequestWidgetUrl.mockResolvedValue(bootstrappedWidgetUrl);
+
+        const props = {
+            ...baseProps,
+            type: "modal" as const,
+        };
 
-    it('should build URL with mode=widget parameter', () => {
-        const { getByTestId } = render(
-            <SoluCXWidget {...baseProps} type="inline" />
-        );
+        const { queryByTestId, getByTestId } = render(<SoluCXWidget {...props} />);
 
-        const webview = getByTestId('webview');
-        expect(webview.props.source.uri).toContain('mode=widget');
+        expect(queryByTestId("webview")).toBeNull();
+
+        await waitFor(() => {
+            expect(mockRequestWidgetUrl).toHaveBeenCalledTimes(1);
+            expect(mockRequestWidgetUrl).toHaveBeenCalledWith(
+                "test-key-abc",
+                expect.objectContaining({
+                    form_id: "form-123",
+                }),
+                "test-user-123",
+            );
+            expect(mockShouldDisplayWidget).toHaveBeenCalledTimes(1);
+            expect(mockOpen).toHaveBeenCalledTimes(1);
+            expect(queryByTestId("webview")).toBeTruthy();
+        });
+
+        const webview = getByTestId("webview");
+        expect(webview.props.source.uri).toBe(bootstrappedWidgetUrl);
     });
-});
 
-describe('SoluCXWidget bootstrap flow', () => {
-    it('fetches widget URL before rendering non-form widgets', async () => {
+    it("fetches widget URL before rendering non-form widgets", async () => {
         mockRequestWidgetUrl.mockResolvedValue(bootstrappedWidgetUrl);
 
         const props = {
             ...baseProps,
             data: {
-                customer_id: 'cust-777',
-                journey: 'sac',
+                customer_id: "cust-777",
+                journey: "sac",
             },
-            type: 'bottom' as const,
+            type: "bottom" as const,
         };
 
-        const { queryByTestId, getByTestId } = render(
-            <SoluCXWidget {...props} />
-        );
+        const { queryByTestId, getByTestId } = render(<SoluCXWidget {...props} />);
 
-        expect(queryByTestId('webview')).toBeNull();
+        expect(queryByTestId("webview")).toBeNull();
 
         await waitFor(() => {
             expect(mockRequestWidgetUrl).toHaveBeenCalledTimes(1);
             expect(mockShouldDisplayWidget).toHaveBeenCalledTimes(1);
             expect(mockOpen).toHaveBeenCalledTimes(1);
-            expect(queryByTestId('webview')).toBeTruthy();
+            expect(queryByTestId("webview")).toBeTruthy();
         });
 
-        const webview = getByTestId('webview');
+        const webview = getByTestId("webview");
         expect(webview.props.source.uri).toBe(bootstrappedWidgetUrl);
     });
 
-    it('keeps widget hidden when identifier fetch fails', async () => {
-        mockRequestWidgetUrl.mockRejectedValue(new Error('network'));
+    it("keeps widget hidden when identifier fetch fails", async () => {
+        mockRequestWidgetUrl.mockRejectedValue(new Error("network"));
 
         const props = {
             ...baseProps,
             data: {
-                customer_id: 'cust-777',
-                journey: 'sac',
+                customer_id: "cust-777",
+                journey: "sac",
             },
-            type: 'bottom' as const,
+            type: "bottom" as const,
         };
 
-        const { queryByTestId } = render(
-            <SoluCXWidget {...props} />
-        );
+        const { queryByTestId } = render(<SoluCXWidget {...props} />);
 
-        expect(queryByTestId('webview')).toBeNull();
+        expect(queryByTestId("webview")).toBeNull();
 
         await waitFor(() => {
             expect(mockRequestWidgetUrl).toHaveBeenCalledTimes(1);
             expect(mockShouldDisplayWidget).not.toHaveBeenCalled();
-            expect(queryByTestId('webview')).toBeNull();
+            expect(queryByTestId("webview")).toBeNull();
         });
     });
 
-    it('keeps widget hidden when validation fails after bootstrap', async () => {
+    it("keeps widget hidden when validation fails after bootstrap", async () => {
         mockRequestWidgetUrl.mockResolvedValue(bootstrappedWidgetUrl);
-        mockShouldDisplayWidget.mockResolvedValue({ canDisplay: false, blockReason: 'BLOCKED_BY_MAX_RETRY_ATTEMPTS' });
+        mockShouldDisplayWidget.mockResolvedValue({ canDisplay: false, blockReason: "BLOCKED_BY_MAX_RETRY_ATTEMPTS" });
 
         const props = {
             ...baseProps,
             data: {
-                customer_id: 'cust-777',
-                journey: 'sac',
+                customer_id: "cust-777",
+                journey: "sac",
             },
-            type: 'bottom' as const,
+            type: "bottom" as const,
         };
 
-        const { queryByTestId } = render(
-            <SoluCXWidget {...props} />
-        );
+        const { queryByTestId } = render(<SoluCXWidget {...props} />);
 
-        expect(queryByTestId('webview')).toBeNull();
+        expect(queryByTestId("webview")).toBeNull();
 
         await waitFor(() => {
             expect(mockRequestWidgetUrl).toHaveBeenCalledTimes(1);
             expect(mockShouldDisplayWidget).toHaveBeenCalledTimes(1);
             expect(mockOpen).not.toHaveBeenCalled();
-            expect(queryByTestId('webview')).toBeNull();
+            expect(queryByTestId("webview")).toBeNull();
+        });
+    });
+});
+
+describe("SoluCXWidget callbacks", () => {
+    it("calls onError when data is not provided", () => {
+        const onError = jest.fn();
+        const props = {
+            ...baseProps,
+            data: null as any,
+            callbacks: { onError },
+        };
+
+        render(<SoluCXWidget {...props} type="modal" />);
+
+        expect(onError).toHaveBeenCalledTimes(1);
+        expect(onError).toHaveBeenCalledWith("Widget data is required but was not provided");
+    });
+
+    it("calls onError with Error message when bootstrap fails with Error instance", async () => {
+        mockRequestWidgetUrl.mockRejectedValue(new Error("Network timeout"));
+        const onError = jest.fn();
+
+        const props = {
+            ...baseProps,
+            data: {
+                customer_id: "cust-777",
+                journey: "sac",
+            },
+            type: "bottom" as const,
+            callbacks: { onError },
+        };
+
+        render(<SoluCXWidget {...props} />);
+
+        await waitFor(() => {
+            expect(onError).toHaveBeenCalledTimes(1);
+            expect(onError).toHaveBeenCalledWith("Network timeout");
+            expect(mockSetIsWidgetVisible).toHaveBeenCalledWith(false);
+        });
+    });
+
+    it("calls onError with string when bootstrap fails with string error", async () => {
+        mockRequestWidgetUrl.mockRejectedValue("Connection failed");
+        const onError = jest.fn();
+
+        const props = {
+            ...baseProps,
+            data: {
+                customer_id: "cust-777",
+                journey: "sac",
+            },
+            type: "bottom" as const,
+            callbacks: { onError },
+        };
+
+        render(<SoluCXWidget {...props} />);
+
+        await waitFor(() => {
+            expect(onError).toHaveBeenCalledTimes(1);
+            expect(onError).toHaveBeenCalledWith("Connection failed");
+        });
+    });
+
+    it("calls onError with JSON string when bootstrap fails with object error", async () => {
+        mockRequestWidgetUrl.mockRejectedValue({ code: 500, message: "Server error" });
+        const onError = jest.fn();
+
+        const props = {
+            ...baseProps,
+            data: {
+                customer_id: "cust-777",
+                journey: "sac",
+            },
+            type: "bottom" as const,
+            callbacks: { onError },
+        };
+
+        render(<SoluCXWidget {...props} />);
+
+        await waitFor(() => {
+            expect(onError).toHaveBeenCalledTimes(1);
+            expect(onError).toHaveBeenCalledWith('{"code":500,"message":"Server error"}');
+        });
+    });
+
+    it('calls onError with "Unknown error" when bootstrap fails with null', async () => {
+        mockRequestWidgetUrl.mockRejectedValue(null);
+        const onError = jest.fn();
+
+        const props = {
+            ...baseProps,
+            data: {
+                customer_id: "cust-777",
+                journey: "sac",
+            },
+            type: "bottom" as const,
+            callbacks: { onError },
+        };
+
+        render(<SoluCXWidget {...props} />);
+
+        await waitFor(() => {
+            expect(onError).toHaveBeenCalledTimes(1);
+            expect(onError).toHaveBeenCalledWith("Unknown error");
+        });
+    });
+
+    it("calls onBlock when validation fails", async () => {
+        mockRequestWidgetUrl.mockResolvedValue(bootstrappedWidgetUrl);
+        mockShouldDisplayWidget.mockResolvedValue({
+            canDisplay: false,
+            blockReason: "BLOCKED_BY_MAX_RETRY_ATTEMPTS",
+        });
+        const onBlock = jest.fn();
+
+        const props = {
+            ...baseProps,
+            data: {
+                customer_id: "cust-777",
+                journey: "sac",
+            },
+            type: "bottom" as const,
+            callbacks: { onBlock },
+        };
+
+        render(<SoluCXWidget {...props} />);
+
+        await waitFor(() => {
+            expect(onBlock).toHaveBeenCalledTimes(1);
+            expect(onBlock).toHaveBeenCalledWith("BLOCKED_BY_MAX_RETRY_ATTEMPTS");
+            expect(mockSetIsWidgetVisible).toHaveBeenCalledWith(false);
+        });
+    });
+
+    it("calls onPreOpen, onOpened callbacks for successful bootstrap", async () => {
+        mockRequestWidgetUrl.mockResolvedValue(bootstrappedWidgetUrl);
+        mockShouldDisplayWidget.mockResolvedValue({ canDisplay: true });
+        const onPreOpen = jest.fn();
+        const onOpened = jest.fn();
+
+        const props = {
+            ...baseProps,
+            data: {
+                customer_id: "cust-777",
+                journey: "sac",
+            },
+            type: "bottom" as const,
+            callbacks: { onPreOpen, onOpened },
+        };
+
+        render(<SoluCXWidget {...props} />);
+
+        await waitFor(() => {
+            expect(onPreOpen).toHaveBeenCalledTimes(1);
+            expect(onPreOpen).toHaveBeenCalledWith("test-user-123");
+            expect(onOpened).toHaveBeenCalledTimes(1);
+            expect(onOpened).toHaveBeenCalledWith("test-user-123");
         });
     });
 });

package/src/__tests__/e2e/widget-lifecycle.test.tsx

@@ -82,7 +82,7 @@ describe('E2E: Widget Lifecycle', () => {
             const callbacks: WidgetCallbacks = {
                 onOpened: (userId) => analytics.track('widget_shown', { userId }),
                 onQuestionAnswered: () => analytics.track('question_answered'),
-                onPartialCompleted: (userId) => {
+                onCompleted: (userId) => {
                     analytics.track('survey_completed', { userId });
                 },
                 onClosed: () => analytics.track('widget_closed'),
@@ -117,10 +117,6 @@ describe('E2E: Widget Lifecycle', () => {
                 nativeEvent: { data: 'FORM_RESIZE-400' },
             });
 
-            await waitFor(() => {
-                expect(analytics.track).toHaveBeenCalledWith('question_answered', undefined);
-            }, { timeout: 100 }).catch(() => {}); // May not be called yet
-
             // 4. Customer answers first question
             fireEvent(webview, 'message', {
                 nativeEvent: { data: 'QUESTION_ANSWERED' },
@@ -130,6 +126,9 @@ describe('E2E: Widget Lifecycle', () => {
                 expect(analytics.track).toHaveBeenCalledWith('question_answered');
             });
 
+            // Reset counter after first question to track only upcoming interactions
+            analytics.track.mockClear();
+
             // 5. Customer goes to next page
             fireEvent(webview, 'message', {
                 nativeEvent: { data: 'FORM_PAGECHANGED-2' },
@@ -142,7 +141,7 @@ describe('E2E: Widget Lifecycle', () => {
 
             await waitFor(() => {
                 expect(analytics.track).toHaveBeenCalledWith('question_answered');
-                expect(analytics.track).toHaveBeenCalledTimes(2); // Called twice
+                expect(analytics.track).toHaveBeenCalledTimes(1); // Called once after reset
             });
 
             // 7. Customer submits survey
@@ -165,8 +164,8 @@ describe('E2E: Widget Lifecycle', () => {
                 expect(analytics.track).toHaveBeenCalledWith('widget_closed');
             });
 
-            // Verify complete tracking flow
-            expect(analytics.track).toHaveBeenCalledTimes(4);
+            // Verify complete tracking flow after reset (question_answered + survey_completed + widget_closed)
+            expect(analytics.track).toHaveBeenCalledTimes(3);
         });
     });
 
@@ -177,7 +176,7 @@ describe('E2E: Widget Lifecycle', () => {
 
             const callbacks: WidgetCallbacks = {
                 onError: errorHandler,
-                onPartialCompleted: completionHandler,
+                onCompleted: completionHandler,
             };
 
             const { getByTestId } = render(
@@ -298,7 +297,7 @@ describe('E2E: Widget Lifecycle', () => {
                     callbacks={{
                         onPageChanged: pageChangeHandler,
                         onQuestionAnswered: questionHandler,
-                        onPartialCompleted: completionHandler,
+                        onCompleted: completionHandler,
                     }}
                 />
             );

package/src/__tests__/integration/webview-communication.test.tsx

@@ -167,9 +167,9 @@ describe('Integration: WebView Communication', () => {
         });
 
         it('should handle FORM_COMPLETED message with userId', async () => {
-            const mockOnPartialCompleted = jest.fn();
+            const mockOnCompleted = jest.fn();
             const callbacks: WidgetCallbacks = {
-                onPartialCompleted: mockOnPartialCompleted,
+                onCompleted: mockOnCompleted,
             };
 
             const { getByTestId } = render(
@@ -186,7 +186,7 @@ describe('Integration: WebView Communication', () => {
             });
 
             await waitFor(() => {
-                expect(mockOnPartialCompleted).toHaveBeenCalledWith(expect.any(String));
+                expect(mockOnCompleted).toHaveBeenCalledWith(expect.any(String));
             });
         });
 
@@ -290,10 +290,10 @@ describe('Integration: WebView Communication', () => {
         });
 
         it('should handle completeSoluCXWidget survey event', async () => {
-            const mockOnPartialCompleted = jest.fn();
+            const mockOnCompleted = jest.fn();
 
             const { getByTestId } = render(
-                <SoluCXWidget {...surveyProps} callbacks={{ onPartialCompleted: mockOnPartialCompleted }} />
+                <SoluCXWidget {...surveyProps} callbacks={{ onCompleted: mockOnCompleted }} />
             );
 
             await waitFor(() => {
@@ -305,7 +305,7 @@ describe('Integration: WebView Communication', () => {
             });
 
             await waitFor(() => {
-                expect(mockOnPartialCompleted).toHaveBeenCalled();
+                expect(mockOnCompleted).toHaveBeenCalled();
             });
         });
     });
@@ -359,14 +359,14 @@ describe('Integration: WebView Communication', () => {
             const mockOnPageChanged = jest.fn();
             const mockOnQuestionAnswered = jest.fn();
             const mockOnResize = jest.fn();
-            const mockOnPartialCompleted = jest.fn();
+            const mockOnCompleted = jest.fn();
             const mockOnClosed = jest.fn();
 
             const callbacks: WidgetCallbacks = {
                 onPageChanged: mockOnPageChanged,
                 onQuestionAnswered: mockOnQuestionAnswered,
                 onResize: mockOnResize,
-                onPartialCompleted: mockOnPartialCompleted,
+                onCompleted: mockOnCompleted,
                 onClosed: mockOnClosed,
             };
 
@@ -404,7 +404,7 @@ describe('Integration: WebView Communication', () => {
                 expect(mockOnResize).toHaveBeenCalledTimes(2);
                 expect(mockOnPageChanged).toHaveBeenCalledTimes(1);
                 expect(mockOnQuestionAnswered).toHaveBeenCalledTimes(1);
-                expect(mockOnPartialCompleted).toHaveBeenCalledTimes(1);
+                expect(mockOnCompleted).toHaveBeenCalledTimes(1);
                 expect(mockOnClosed).toHaveBeenCalledTimes(1);
             });
 

package/src/__tests__/useWidgetState.test.ts

@@ -78,7 +78,7 @@ describe('WidgetEventService', () => {
     it('should handle FORM_COMPLETED event correctly', async () => {
         const result = await service.handleMessage('FORM_COMPLETED', true);
 
-        expect(mockCallbacks.onPartialCompleted).toHaveBeenCalledWith('test-user-123');
+        expect(mockCallbacks.onCompleted).toHaveBeenCalledWith('test-user-123');
         expect(result).toEqual({ status: 'success' });
     });
 
@@ -112,7 +112,7 @@ describe('WidgetEventService', () => {
     it('should adapt completeSoluCXWidget to FORM_COMPLETED', async () => {
         const result = await service.handleMessage('completeSoluCXWidget', false);
 
-        expect(mockCallbacks.onPartialCompleted).toHaveBeenCalledWith('test-user-123');
+        expect(mockCallbacks.onCompleted).toHaveBeenCalledWith('test-user-123');
         expect(result).toEqual({ status: 'success' });
     });
 

package/src/hooks/useWidgetState.ts

@@ -10,9 +10,9 @@ import { StorageService } from '../services/storage';
 
 function getUserId(widgetData: WidgetData): string {
   return (
-    widgetData.customer_id ??
-    widgetData.document ??
-    widgetData.email ??
+    widgetData?.customer_id ??
+    widgetData?.document ??
+    widgetData?.email ??
     'default_user'
   );
 }

package/src/interfaces/WidgetCallbacks.ts

@@ -4,7 +4,6 @@ export interface WidgetCallbacks {
     onPreOpen?: (userId: string) => void;
     onOpened?: (userId: string) => void;
     onBlock?: (blockReason: BlockReason | undefined) => void;
-    onPingError?: (error: unknown) => void;
     onClosed?: () => void;
     onError?: (message: string) => void;
     onPageChanged?: (page: string) => void;

package/src/services/widgetEventService.ts

@@ -79,7 +79,7 @@ export class WidgetEventService {
   }
 
   private handleFormCompleted(): WidgetResponse {
-    this.callbacks?.onPartialCompleted?.(this.userId);
+    this.callbacks?.onCompleted?.(this.userId);
     return { status: "success" };
   }