From bf82569d5a6d3e614a95e151f043aafc00bf00a5 Mon Sep 17 00:00:00 2001
From: Emanuele Dall'Ara <71103219+LeleDallas@users.noreply.github.com>
Date: Fri, 31 Jan 2025 09:39:39 +0100
Subject: [PATCH] test: [PE-917] CGN `WebviewComponent` additional test (#6651)

## Short description
This pull request updates the test suite for `WebviewComponent` to cover
additional missing test cases.

## List of changes proposed in this pull request
- Added `testID` attributes to the `OperationResultScreenContent` and
`WebView` components to facilitate targeted testing
- Adding new test cases for error handling

## How to test
Make sure the new test suite runs successfully without failures and that
the test coverage has increased
---
 ts/components/WebviewComponent.tsx            |  2 +
 .../__tests__/WebviewComponent.test.tsx       | 64 ++++++++++++++++---
 .../WebviewComponent.test.tsx.snap            |  1 +
 3 files changed, 59 insertions(+), 8 deletions(-)

diff --git a/ts/components/WebviewComponent.tsx b/ts/components/WebviewComponent.tsx
index 4422a1f6492..094477f727a 100644
--- a/ts/components/WebviewComponent.tsx
+++ b/ts/components/WebviewComponent.tsx
@@ -42,6 +42,7 @@ const WebviewComponent = (props: Props) => {
     <>
       {hasError ? (
         <OperationResultScreenContent
+          testID="webview-error"
           pictogram="umbrellaNew"
           title={I18n.t("wallet.errors.GENERIC_ERROR")}
           isHeaderVisible
@@ -54,6 +55,7 @@ const WebviewComponent = (props: Props) => {
       ) : (
         <LoadingSpinnerOverlay isLoading={loading}>
           <WebView
+            testID="webview"
             androidCameraAccessDisabled={true}
             androidMicrophoneAccessDisabled={true}
             allowsInlineMediaPlayback={true}
diff --git a/ts/components/__tests__/WebviewComponent.test.tsx b/ts/components/__tests__/WebviewComponent.test.tsx
index 8348fbb83d5..56a745166ee 100644
--- a/ts/components/__tests__/WebviewComponent.test.tsx
+++ b/ts/components/__tests__/WebviewComponent.test.tsx
@@ -1,14 +1,17 @@
-import { render } from "@testing-library/react-native";
+import { fireEvent, render } from "@testing-library/react-native";
 import { Provider } from "react-redux";
 import configureMockStore from "redux-mock-store";
-import WebviewComponent from "../WebviewComponent";
-import { appReducer } from "../../store/reducers";
+import I18n from "../../i18n";
 import { applicationChangeState } from "../../store/actions/application";
+import { appReducer } from "../../store/reducers";
 import { GlobalState } from "../../store/reducers/types";
-
+import WebviewComponent from "../WebviewComponent";
 describe("WebviewComponent tests", () => {
+  const globalState = appReducer(undefined, applicationChangeState("active"));
+  const mockStore = configureMockStore<GlobalState>();
+  const store: ReturnType<typeof mockStore> = mockStore(globalState);
+
   it("snapshot for component", () => {
-    const globalState = appReducer(undefined, applicationChangeState("active"));
     const enrichedState = {
       ...globalState,
       persistedPreferences: {
@@ -16,13 +19,58 @@ describe("WebviewComponent tests", () => {
         isDesignSystemEnabled: false
       }
     };
-    const mockStore = configureMockStore<GlobalState>();
-    const store: ReturnType<typeof mockStore> = mockStore(enrichedState);
+    const enrichedStore: ReturnType<typeof mockStore> =
+      mockStore(enrichedState);
     const component = render(
-      <Provider store={store}>
+      <Provider store={enrichedStore}>
         <WebviewComponent source={{ uri: "https://google.com" }} />
       </Provider>
     );
     expect(component).toMatchSnapshot();
   });
+
+  it("should display error screen on error", () => {
+    const { getByText, getByTestId } = render(
+      <Provider store={store}>
+        <WebviewComponent source={{ uri: "https://google.com" }} />
+      </Provider>
+    );
+
+    fireEvent(getByTestId("webview"), "onError", {
+      nativeEvent: { description: "Network error" }
+    });
+
+    expect(getByText(I18n.t("wallet.errors.GENERIC_ERROR"))).toBeTruthy();
+    expect(getByText(I18n.t("global.buttons.retry"))).toBeTruthy();
+  });
+
+  it("should reload on retry", () => {
+    const { getByText, getByTestId } = render(
+      <Provider store={store}>
+        <WebviewComponent source={{ uri: "https://google.com" }} />
+      </Provider>
+    );
+
+    fireEvent(getByTestId("webview"), "onError", {
+      nativeEvent: { description: "Network error" }
+    });
+
+    fireEvent.press(getByText(I18n.t("global.buttons.retry")));
+
+    expect(getByTestId("webview")).toBeTruthy();
+  });
+
+  it("should call handleError on WebView error", () => {
+    const { getByTestId } = render(
+      <Provider store={store}>
+        <WebviewComponent source={{ uri: "wrong uri" }} />
+      </Provider>
+    );
+
+    fireEvent(getByTestId("webview"), "onError", {
+      nativeEvent: { description: "Network error" }
+    });
+
+    expect(getByTestId("webview-error")).toBeTruthy();
+  });
 });
diff --git a/ts/components/__tests__/__snapshots__/WebviewComponent.test.tsx.snap b/ts/components/__tests__/__snapshots__/WebviewComponent.test.tsx.snap
index f24a780e097..e157e09672d 100644
--- a/ts/components/__tests__/__snapshots__/WebviewComponent.test.tsx.snap
+++ b/ts/components/__tests__/__snapshots__/WebviewComponent.test.tsx.snap
@@ -322,6 +322,7 @@ exports[`WebviewComponent tests snapshot for component 1`] = `
             },
           ]
         }
+        testID="webview"
         textInteractionEnabled={true}
         useSharedProcessPool={true}
       />