@smileid/usesmileid 12.0.2 → 12.1.0

package/src/presentation/screen/__tests__/use_smile_id_permission_screen.test.tsx

@@ -1,68 +0,0 @@
-import { describe, it, expect } from "vitest";
-import * as React from "react";
-import { create as createRenderer, act } from "react-test-renderer";
-import { UseSmileIDPermissionScreen } from "../use_smile_id_permission_screen";
-import { UseSmileIDThemeProvider } from "../../theme/theme_context";
-import { defaultDarkTheme, defaultLightTheme } from "../../theme/theme";
-
-function render(element: React.ReactElement) {
-  let tree!: ReturnType<typeof createRenderer>;
-  act(() => {
-    tree = createRenderer(element);
-  });
-  return tree;
-}
-
-function rootStyle(
-  tree: ReturnType<typeof createRenderer>,
-): Record<string, unknown> {
-  const json = tree.toJSON() as { props: { style: Record<string, unknown> } };
-  return json.props.style;
-}
-
-describe("UseSmileIDPermissionScreen", () => {
-  it("shows a default camera rationale when the partner supplies none", () => {
-    const tree = render(
-      <UseSmileIDPermissionScreen theme={defaultLightTheme} />,
-    );
-
-    expect(JSON.stringify(tree.toJSON())).toContain(
-      "Camera permission required",
-    );
-  });
-
-  it("shows the partner's rationale when one is supplied", () => {
-    const tree = render(
-      <UseSmileIDPermissionScreen
-        theme={defaultLightTheme}
-        cameraRationale="Acme needs your camera to verify your ID"
-      />,
-    );
-
-    const text = JSON.stringify(tree.toJSON());
-    expect(text).toContain("Acme needs your camera to verify your ID");
-    expect(text).not.toContain("Camera permission required");
-  });
-
-  it("paints on the theme background from the theme prop", () => {
-    const tree = render(
-      <UseSmileIDPermissionScreen theme={defaultDarkTheme} />,
-    );
-
-    expect(rootStyle(tree).backgroundColor).toBe(
-      defaultDarkTheme.colors.background,
-    );
-  });
-
-  it("falls back to the theme from context when no theme prop is given", () => {
-    const tree = render(
-      <UseSmileIDThemeProvider value={defaultDarkTheme}>
-        <UseSmileIDPermissionScreen />
-      </UseSmileIDThemeProvider>,
-    );
-
-    expect(rootStyle(tree).backgroundColor).toBe(
-      defaultDarkTheme.colors.background,
-    );
-  });
-});

package/src/presentation/screen/__tests__/use_smile_id_preview_screen.test.tsx

@@ -1,193 +0,0 @@
-import { describe, it, expect, vi } from "vitest";
-import * as React from "react";
-import {
-  create as createRenderer,
-  act,
-  type ReactTestInstance,
-} from "react-test-renderer";
-import { I18nManager, StyleSheet, Text } from "react-native";
-import { UseSmileIDPreviewScreen } from "../use_smile_id_preview_screen";
-import { defaultLightTheme } from "../../theme/theme";
-
-/**
- * Component-level tests for the preview screen. Covers:
- *   - Image at the oval rect (not full-bleed)
- *   - Title + confirmation buttons + optional attribution in card
- *   - Accept / Retake gating from `resolvePreviewState`
- *   - The confirm/retake pair is fixed (not customisable)
- */
-
-function render(element: React.ReactElement) {
-  let tree!: ReturnType<typeof createRenderer>;
-  act(() => {
-    tree = createRenderer(element);
-  });
-  return tree;
-}
-
-function findByTestID(
-  root: ReactTestInstance,
-  testID: string,
-): ReactTestInstance | null {
-  return root.findAllByProps({ testID })[0] ?? null;
-}
-
-function findTextNode(
-  root: ReactTestInstance,
-  expected: string,
-): ReactTestInstance | null {
-  return (
-    root.findAll(
-      (node) => node.type === Text && collectText(node).includes(expected),
-      { deep: true },
-    )[0] ?? null
-  );
-}
-
-function collectText(node: ReactTestInstance): string {
-  return node.children
-    .map((c) =>
-      typeof c === "string" ? c : collectText(c as ReactTestInstance),
-    )
-    .join("");
-}
-
-const PATH = "file:///selfie.jpg";
-
-describe("UseSmileIDPreviewScreen", () => {
-  it("renders the screen container", () => {
-    const { root } = render(<UseSmileIDPreviewScreen />);
-    expect(findByTestID(root, "si_preview_screen")).not.toBeNull();
-  });
-
-  it("renders the title 'Confirm image quality'", () => {
-    const { root } = render(<UseSmileIDPreviewScreen />);
-    expect(findTextNode(root, "Confirm image quality")).not.toBeNull();
-  });
-
-  it("renders the caption 'Make sure that the image is clear.'", () => {
-    const { root } = render(<UseSmileIDPreviewScreen />);
-    expect(
-      findTextNode(root, "Make sure that the image is clear"),
-    ).not.toBeNull();
-  });
-
-  it("omits the image element when capturedSelfiePath is missing", () => {
-    const { root } = render(<UseSmileIDPreviewScreen />);
-    expect(findByTestID(root, "si_preview_image")).toBeNull();
-  });
-
-  it("renders the at-oval image element when a path is provided", () => {
-    const { root } = render(
-      <UseSmileIDPreviewScreen capturedSelfiePath={PATH} />,
-    );
-    expect(findByTestID(root, "si_preview_image")).not.toBeNull();
-  });
-
-  it("renders default confirmation buttons when no slots are supplied", () => {
-    const { root } = render(
-      <UseSmileIDPreviewScreen capturedSelfiePath={PATH} />,
-    );
-    expect(
-      findByTestID(root, "si_preview_confirmation_buttons"),
-    ).not.toBeNull();
-  });
-
-  it("forwards Accept tap to onAccept when an image is present", () => {
-    const onAccept = vi.fn();
-    const { root } = render(
-      <UseSmileIDPreviewScreen capturedSelfiePath={PATH} onAccept={onAccept} />,
-    );
-    const buttons = findByTestID(root, "si_preview_confirmation_buttons")!;
-    act(() => {
-      (buttons.props.onAccept as () => void)();
-    });
-    expect(onAccept).toHaveBeenCalledTimes(1);
-  });
-
-  it("invokes Accept without a per-press capture guard", () => {
-    // The preview is only reached once a capture exists, so the inner
-    // screen does not self-gate Accept — tapping it always fires.
-    const onAccept = vi.fn();
-    const { root } = render(
-      <UseSmileIDPreviewScreen capturedSelfiePath={PATH} onAccept={onAccept} />,
-    );
-    const buttons = findByTestID(root, "si_preview_confirmation_buttons")!;
-    act(() => {
-      (buttons.props.onAccept as () => void)();
-    });
-    expect(onAccept).toHaveBeenCalledTimes(1);
-  });
-
-  it("blocks Reject when allowRetake is false", () => {
-    const onReject = vi.fn();
-    const { root } = render(
-      <UseSmileIDPreviewScreen
-        capturedSelfiePath={PATH}
-        allowRetake={false}
-        onReject={onReject}
-      />,
-    );
-    const buttons = findByTestID(root, "si_preview_confirmation_buttons")!;
-    act(() => {
-      (buttons.props.onReject as () => void)();
-    });
-    expect(onReject).not.toHaveBeenCalled();
-  });
-
-  it("renders attribution by default and hides it when showAttribution=false", () => {
-    const { root: withAttr } = render(<UseSmileIDPreviewScreen />);
-    expect(
-      withAttr.findAllByProps({ accessibilityLabel: "Powered by Smile ID" })[0],
-    ).toBeTruthy();
-
-    const { root: withoutAttr } = render(
-      <UseSmileIDPreviewScreen showAttribution={false} />,
-    );
-    expect(
-      withoutAttr.findAllByProps({ accessibilityLabel: "Powered by Smile ID" }),
-    ).toHaveLength(0);
-  });
-
-  it("renders without throwing under RTL", () => {
-    // The capture overlay is intentionally not mirrored, but the screen
-    // must still mount cleanly when the layout direction is RTL.
-    I18nManager.isRTL = true;
-    try {
-      const { root } = render(
-        <UseSmileIDPreviewScreen capturedSelfiePath={PATH} />,
-      );
-      expect(findByTestID(root, "si_preview_screen")).not.toBeNull();
-      expect(findTextNode(root, "Confirm image quality")).not.toBeNull();
-    } finally {
-      I18nManager.isRTL = false;
-    }
-  });
-
-  it("always renders the fixed confirmation-button pair (not customisable)", () => {
-    // Preview buttons are intentionally not customisable: the screen always
-    // renders the fixed confirm/retake pair. Re-adding a slot API is a product
-    // decision, not a bug fix.
-    const { root } = render(
-      <UseSmileIDPreviewScreen capturedSelfiePath={PATH} />,
-    );
-    expect(
-      findByTestID(root, "si_preview_confirmation_buttons"),
-    ).not.toBeNull();
-  });
-
-  it("renders the card title in the theme primary color", () => {
-    const { root } = render(
-      <UseSmileIDPreviewScreen capturedSelfiePath={PATH} />,
-    );
-    const title = root.findAll(
-      (node) => node.type === Text && node.props.accessibilityRole === "header",
-      { deep: true },
-    )[0];
-    expect(title).toBeDefined();
-    const titleStyle = StyleSheet.flatten(title!.props.style) as {
-      color?: string;
-    };
-    expect(titleStyle.color).toBe(defaultLightTheme.colors.primary);
-  });
-});

package/src/presentation/screen/__tests__/use_smile_id_processing_screen.test.tsx

@@ -1,333 +0,0 @@
-import { describe, it, expect, vi } from "vitest";
-import * as React from "react";
-import {
-  create as createRenderer,
-  act,
-  type ReactTestInstance,
-} from "react-test-renderer";
-import {
-  Pressable,
-  StyleSheet,
-  Text,
-  View,
-  type StyleProp,
-  type ViewStyle,
-} from "react-native";
-import { UseSmileIDProcessingScreen } from "../use_smile_id_processing_screen";
-import { defaultLightTheme } from "../../theme/theme";
-
-/**
- * Component-level tests for the processing screen. Covers:
- *   - Image at the oval rect (clipped) when present
- *   - In-oval status indicator (loading / success / failed)
- *   - State-branched card body
- *   - Slot contract — individual button slots replace only their
- *     own button; title + message body always renders
- */
-
-function render(element: React.ReactElement) {
-  let tree!: ReturnType<typeof createRenderer>;
-  act(() => {
-    tree = createRenderer(element);
-  });
-  return tree;
-}
-
-function findByTestID(
-  root: ReactTestInstance,
-  testID: string,
-): ReactTestInstance | null {
-  return root.findAllByProps({ testID })[0] ?? null;
-}
-
-function findTextNode(
-  root: ReactTestInstance,
-  expected: string,
-): ReactTestInstance | null {
-  return (
-    root.findAll(
-      (node) => node.type === Text && collectText(node).includes(expected),
-      { deep: true },
-    )[0] ?? null
-  );
-}
-
-function collectText(node: ReactTestInstance): string {
-  return node.children
-    .map((c) =>
-      typeof c === "string" ? c : collectText(c as ReactTestInstance),
-    )
-    .join("");
-}
-
-describe("UseSmileIDProcessingScreen", () => {
-  it("renders the screen container", () => {
-    const { root } = render(
-      <UseSmileIDProcessingScreen state={{ kind: "loading" }} />,
-    );
-    expect(findByTestID(root, "si_processing_screen")).not.toBeNull();
-  });
-
-  it("renders the at-oval image when capturedSelfiePath is provided", () => {
-    const { root } = render(
-      <UseSmileIDProcessingScreen
-        state={{ kind: "loading" }}
-        capturedSelfiePath="file:///selfie.jpg"
-      />,
-    );
-    expect(findByTestID(root, "si_processing_image")).not.toBeNull();
-  });
-
-  it("omits the image when no path is supplied", () => {
-    const { root } = render(
-      <UseSmileIDProcessingScreen state={{ kind: "loading" }} />,
-    );
-    expect(findByTestID(root, "si_processing_image")).toBeNull();
-  });
-
-  it("drops the captured-image oval and centres the badge when showFaceOval=false", () => {
-    const { root } = render(
-      <UseSmileIDProcessingScreen
-        state={{ kind: "loading" }}
-        showFaceOval={false}
-        capturedSelfiePath="file:///selfie.jpg"
-      />,
-    );
-    expect(findByTestID(root, "si_processing_no_oval_region")).not.toBeNull();
-    expect(findByTestID(root, "si_processing_image")).toBeNull();
-    expect(findByTestID(root, "si_processing_center_indicator")).not.toBeNull();
-  });
-
-  it("keeps the captured-image oval when showFaceOval is omitted", () => {
-    const { root } = render(
-      <UseSmileIDProcessingScreen
-        state={{ kind: "loading" }}
-        capturedSelfiePath="file:///selfie.jpg"
-      />,
-    );
-    expect(findByTestID(root, "si_processing_no_oval_region")).toBeNull();
-    expect(findByTestID(root, "si_processing_image")).not.toBeNull();
-  });
-
-  it("branches the bottom-card body by lifecycle state", () => {
-    // The in-oval indicator itself is gated on canvas measurement
-    // (`onLayout` doesn't fire under `react-test-renderer`), so we
-    // assert the state-branched body instead — the body is the
-    // observable signal that the screen recognized the state.
-    for (const state of [
-      { kind: "loading" } as const,
-      { kind: "success", message: "ok" } as const,
-      { kind: "failed", errorMessage: "bad" } as const,
-    ]) {
-      const { root } = render(<UseSmileIDProcessingScreen state={state} />);
-      if (state.kind === "loading") {
-        expect(
-          findByTestID(root, "si_processing_loading_content"),
-        ).not.toBeNull();
-      }
-      if (state.kind === "success") {
-        expect(
-          findByTestID(root, "si_processing_success_content"),
-        ).not.toBeNull();
-      }
-      if (state.kind === "failed") {
-        expect(
-          findByTestID(root, "si_processing_failed_content"),
-        ).not.toBeNull();
-      }
-    }
-  });
-
-  it("shows 'Submitting…' on loading", () => {
-    const { root } = render(
-      <UseSmileIDProcessingScreen state={{ kind: "loading" }} />,
-    );
-    expect(findTextNode(root, "Submitting")).not.toBeNull();
-  });
-
-  it("shows the success title and message on success", () => {
-    const { root } = render(
-      <UseSmileIDProcessingScreen
-        state={{ kind: "success", message: "Your KYC is complete." }}
-      />,
-    );
-    expect(findTextNode(root, "Submission Complete")).not.toBeNull();
-    expect(findTextNode(root, "Your KYC is complete.")).not.toBeNull();
-  });
-
-  it("shows the failure title and error message on failed", () => {
-    const { root } = render(
-      <UseSmileIDProcessingScreen
-        state={{ kind: "failed", errorMessage: "Network unreachable" }}
-      />,
-    );
-    expect(findTextNode(root, "Submission Failed")).not.toBeNull();
-    expect(findTextNode(root, "Network unreachable")).not.toBeNull();
-  });
-
-  it("forwards onContinue from the default Continue button", () => {
-    const onContinue = vi.fn();
-    const { root } = render(
-      <UseSmileIDProcessingScreen
-        state={{ kind: "success" }}
-        onContinue={onContinue}
-      />,
-    );
-    const button = findByTestID(root, "si_processing_continue_button");
-    expect(button).not.toBeNull();
-    act(() => {
-      (button!.props.onClick as () => void)();
-    });
-    expect(onContinue).toHaveBeenCalledTimes(1);
-  });
-
-  it("renders Retry and Exit buttons on failure when callbacks are supplied", () => {
-    const onRetry = vi.fn();
-    const onExit = vi.fn();
-    const { root } = render(
-      <UseSmileIDProcessingScreen
-        state={{ kind: "failed" }}
-        onRetry={onRetry}
-        onExit={onExit}
-      />,
-    );
-    expect(findByTestID(root, "si_processing_retry_button")).not.toBeNull();
-    expect(findByTestID(root, "si_processing_exit_button")).not.toBeNull();
-  });
-
-  it("hides attribution when showAttribution=false", () => {
-    const { root } = render(
-      <UseSmileIDProcessingScreen
-        state={{ kind: "loading" }}
-        showAttribution={false}
-      />,
-    );
-    expect(
-      root.findAllByProps({ accessibilityLabel: "Powered by Smile ID" }),
-    ).toHaveLength(0);
-  });
-
-  it("replaces only the Continue button when continueButton slot is supplied (success state)", () => {
-    // Concrete scenario this guards: partner overrides the Continue
-    // button and expects the title + message to remain. Title body
-    // must render regardless of slot presence.
-    const onContinue = vi.fn();
-    const { root } = render(
-      <UseSmileIDProcessingScreen
-        state={{ kind: "success", message: "All good" }}
-        onContinue={onContinue}
-        continueButton={({ onClick }) => (
-          <Pressable testID="si_custom_continue" onPress={onClick}>
-            <Text>Done</Text>
-          </Pressable>
-        )}
-      />,
-    );
-
-    // Title + message still visible.
-    expect(findTextNode(root, "Submission Complete")).not.toBeNull();
-    expect(findTextNode(root, "All good")).not.toBeNull();
-
-    // Default Continue button suppressed.
-    expect(findByTestID(root, "si_processing_continue_button")).toBeNull();
-
-    // Custom Continue button rendered and wired.
-    const slot = findByTestID(root, "si_custom_continue");
-    expect(slot).not.toBeNull();
-    act(() => {
-      (slot!.props.onPress as () => void)();
-    });
-    expect(onContinue).toHaveBeenCalledTimes(1);
-  });
-
-  it("replaces individual buttons on failure — Retry slot keeps default Exit", () => {
-    // Concrete scenario: partner customizes only the Retry button
-    // (e.g., adds analytics on tap). The default Exit button must
-    // still render so the user can dismiss the failure.
-    const onRetry = vi.fn();
-    const onExit = vi.fn();
-    const { root } = render(
-      <UseSmileIDProcessingScreen
-        state={{ kind: "failed", errorMessage: "Try again" }}
-        onRetry={onRetry}
-        onExit={onExit}
-        retryButton={({ onClick }) => (
-          <Pressable testID="si_custom_retry" onPress={onClick}>
-            <Text>Try Again</Text>
-          </Pressable>
-        )}
-      />,
-    );
-
-    // Title + message still visible.
-    expect(findTextNode(root, "Submission Failed")).not.toBeNull();
-    expect(findTextNode(root, "Try again")).not.toBeNull();
-
-    // Default Retry suppressed; default Exit remains.
-    expect(findByTestID(root, "si_processing_retry_button")).toBeNull();
-    expect(findByTestID(root, "si_processing_exit_button")).not.toBeNull();
-
-    // Custom Retry rendered and wired.
-    const slot = findByTestID(root, "si_custom_retry");
-    expect(slot).not.toBeNull();
-    act(() => {
-      (slot!.props.onPress as () => void)();
-    });
-    expect(onRetry).toHaveBeenCalledTimes(1);
-  });
-
-  it("stretches the success/failed card bodies so action buttons span the card", () => {
-    const cases = [
-      {
-        state: { kind: "success", message: "ok" } as const,
-        testID: "si_processing_success_content",
-      },
-      {
-        state: { kind: "failed", errorMessage: "bad" } as const,
-        testID: "si_processing_failed_content",
-      },
-    ];
-    for (const { state, testID } of cases) {
-      const { root } = render(<UseSmileIDProcessingScreen state={state} />);
-      // `findByTestID` would also match the composite element, whose
-      // `style` prop is undefined.
-      const content = root.findAll(
-        (node) => node.type === View && node.props.testID === testID,
-        { deep: true },
-      )[0];
-      expect(content).toBeDefined();
-      const style = StyleSheet.flatten(
-        content!.props.style as StyleProp<ViewStyle>,
-      ) as ViewStyle;
-      expect(style.alignSelf).toBe("stretch");
-    }
-  });
-
-  it("renders every card-state title in the theme primary color", () => {
-    const cases = [
-      {
-        state: { kind: "loading" } as const,
-        testID: "si_processing_loading_content",
-      },
-      {
-        state: { kind: "success", message: "ok" } as const,
-        testID: "si_processing_success_content",
-      },
-      {
-        state: { kind: "failed", errorMessage: "bad" } as const,
-        testID: "si_processing_failed_content",
-      },
-    ];
-    for (const { state, testID } of cases) {
-      const { root } = render(<UseSmileIDProcessingScreen state={state} />);
-      const content = findByTestID(root, testID);
-      expect(content).not.toBeNull();
-      const title = content!.findAllByType(Text)[0];
-      expect(title).toBeDefined();
-      const titleStyle = StyleSheet.flatten(
-        title!.props.style as StyleProp<ViewStyle>,
-      ) as { color?: string };
-      expect(titleStyle.color).toBe(defaultLightTheme.colors.primary);
-    }
-  });
-});