fix: Links Redirected to Chrome App Bug (Android bug) (MetaMask#25969)

## **Description**

On Android, tapping a `target="_blank"` link (e.g. the "Stake" button on
lido.fi) in the in-app browser opens the URL in Chrome instead of
loading it within the MetaMask browser. This does not happen on iOS.

**Root cause:** The `@metamask/react-native-webview` library handles
`target="_blank"` differently per platform when the `onOpenWindow` prop
is not provided:

- **iOS** has a built-in fallback in `createWebViewWithConfiguration`
that loads the URL in the same WKWebView.
- **Android** has no such fallback. With `setSupportMultipleWindows`
defaulting to `true`, the native `RNCWebChromeClient.onCreateWindow`
creates a bare `WebView` with no custom `WebViewClient`. Since
`mHasOnOpenWindowEvent` is `false`, the URL is loaded in this bare
WebView which has no UI container, causing Android to delegate to the
system browser (Chrome).

**Fix:** Added an `onOpenWindow` handler to the WebView in `BrowserTab`
that intercepts `target="_blank"` navigations and loads the URL in the
current tab via `window.location.href`. This matches the existing iOS
fallback behavior and makes both platforms consistent. The handler
reuses the same `sanitizeUrlInput` + `injectJavaScript` pattern already
used elsewhere in the file for deeplink browser callbacks.

## **Changelog**

CHANGELOG entry: Fixed an Android-only bug where `target="_blank"` links
in the in-app browser opened in Chrome instead of loading within
MetaMask

## **Related issues**

Fixes: <!-- Add issue number if applicable -->
Jira Ticket: https://consensyssoftware.atlassian.net/browse/MCWP-321

## **Manual testing steps**

```gherkin
Feature: In-app browser target="_blank" link handling

  Scenario: user taps a target="_blank" link on Android
    Given the user has the MetaMask app open on Android
    And the user navigates to https://lido.fi in the in-app browser

    When user taps the "Stake" button (which is an <a target="_blank"> link to https://stake.lido.fi)
    Then the URL loads within the MetaMask in-app browser
    And the user is NOT redirected to Chrome or any external browser

  Scenario: user taps a target="_blank" link on iOS
    Given the user has the MetaMask app open on iOS
    And the user navigates to https://lido.fi in the in-app browser

    When user taps the "Stake" button (which is an <a target="_blank"> link to https://stake.lido.fi)
    Then the URL loads within the MetaMask in-app browser (same behavior as before the fix)

  Scenario: user taps a regular link (no target="_blank")
    Given the user has the MetaMask app open on either platform
    And the user navigates to any dApp in the in-app browser

    When user taps a regular link without target="_blank"
    Then the link navigates normally within the in-app browser (no regression)
```

## **Screenshots/Recordings**

### **Before**

<!-- [screenshots/recordings showing Chrome opening on Android when
tapping target="_blank" link] -->

### **After**

<!-- [screenshots/recordings showing URL loading within in-app browser
on Android] -->

## **Pre-merge author checklist**

- [x] I've followed [MetaMask Contributor
Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask Mobile
Coding
Standards](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/CODING_GUIDELINES.md).
- [x] I've completed the PR template to the best of my ability
- [x] I've included tests if applicable
- [x] I've documented my code using [JSDoc](https://jsdoc.app/) format
if applicable
- [x] I've applied the right labels on the PR (see [labeling
guidelines](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/LABELING_GUIDELINES.md)).
Not required for external contributors.

## **Pre-merge reviewer checklist**

- [x] I've manually tested the PR (e.g. pull and build branch, run the
app, test code being changed).
- [x] I confirm that this PR addresses all acceptance criteria described
in the ticket it closes and includes the necessary testing evidence such
as recordings and or screenshots.


<!-- CURSOR_SUMMARY -->
---

> [!NOTE]
> **Low Risk**
> Localized to in-app browser WebView navigation; behavior change is
straightforward and covered by new unit tests, with minimal impact
outside `target="_blank"` handling.
> 
> **Overview**
> Fixes Android in-app browser behavior where `target="_blank"` links /
`window.open()` could escape to the system browser by adding an explicit
`onOpenWindow` handler that redirects the current WebView via injected
`window.location.href` (with `sanitizeUrlInput`).
> 
> Updates tests to mock the WebView ref `injectJavaScript`, adds
coverage for `onOpenWindow` behavior (including quote sanitization and
empty URL), and refreshes the BrowserTab snapshot to include the new
prop.
> 
> <sup>Written by [Cursor
Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit
744973c. This will update automatically
on new commits. Configure
[here](https://cursor.com/dashboard?tab=bugbot).</sup>
<!-- /CURSOR_SUMMARY -->

Author: MarioAslau

app/components/Views/BrowserTab/BrowserTab.tsx

@@ -8,6 +8,7 @@ import React, {
 import { View, Alert, BackHandler, ImageSourcePropType } from 'react-native';
 import { isEqual } from 'lodash';
 import { WebView, WebViewMessageEvent } from '@metamask/react-native-webview';
+import type { WebViewOpenWindowEvent } from '@metamask/react-native-webview/lib/WebViewTypes';
 import { useSharedValue } from 'react-native-reanimated';
 import BrowserBottomBar from '../../UI/BrowserBottomBar';
 import { connect, useSelector } from 'react-redux';
@@ -751,6 +752,22 @@ export const BrowserTab: React.FC<BrowserTabProps> = React.memo(
       ],
     );
 
+    /**
+     * Handles target="_blank" links and window.open() calls.
+     * On Android, without this handler, such links open in the system browser (Chrome)
+     * because the native WebChromeClient creates a bare WebView with no fallback.
+     * On iOS, the native fallback loads the URL in the same WebView, but providing
+     * this explicit handler ensures consistent behavior across both platforms.
+     */
+    const handleOpenWindow = useCallback((event: WebViewOpenWindowEvent) => {
+      const { targetUrl } = event.nativeEvent;
+      if (targetUrl && webviewRef.current) {
+        webviewRef.current.injectJavaScript(
+          `window.location.href = '${sanitizeUrlInput(targetUrl)}'; true;`,
+        );
+      }
+    }, []);
+
     /**
      * Sets loading bar progress
      */
@@ -1493,6 +1510,7 @@ export const BrowserTab: React.FC<BrowserTabProps> = React.memo(
                           onShouldStartLoadWithRequest
                         }
                         allowsInlineMediaPlayback
+                        onOpenWindow={handleOpenWindow}
                         {...webViewTestProps}
                         testID={BrowserViewSelectorsIDs.BROWSER_WEBVIEW_ID}
                         applicationNameForUserAgent={'WebView MetaMaskMobile'}

app/components/Views/BrowserTab/__snapshots__/index.test.tsx.snap

@@ -568,6 +568,7 @@ exports[`BrowserTab render Browser 1`] = `
             onLoadStart={[Function]}
             onMessage={[Function]}
             onNavigationStateChange={[Function]}
+            onOpenWindow={[Function]}
             onShouldStartLoadWithRequest={[Function]}
             originWhitelist={
               [

app/components/Views/BrowserTab/index.test.tsx

@@ -6,6 +6,29 @@ import { backgroundState } from '../../../util/test/initial-root-state';
 import { MOCK_ACCOUNTS_CONTROLLER_STATE } from '../../../util/test/accountsControllerTestUtils';
 import BrowserTab from './BrowserTab';
 
+const mockInjectJavaScript = jest.fn();
+
+jest.mock('@metamask/react-native-webview', () => {
+  const { View } = jest.requireActual('react-native');
+  const ActualReact = jest.requireActual('react');
+
+  const MockWebView = ActualReact.forwardRef(
+    (props: Record<string, unknown>, ref: React.Ref<unknown>) => {
+      ActualReact.useImperativeHandle(ref, () => ({
+        injectJavaScript: mockInjectJavaScript,
+      }));
+      return <View {...props} />;
+    },
+  );
+  MockWebView.displayName = 'WebView';
+
+  return {
+    __esModule: true,
+    WebView: MockWebView,
+    default: MockWebView,
+  };
+});
+
 const mockNavigation = {
   goBack: jest.fn(),
   goForward: jest.fn(),
@@ -90,6 +113,7 @@ const mockProps = {
 describe('BrowserTab', () => {
   beforeEach(() => {
     jest.clearAllMocks();
+    mockInjectJavaScript.mockClear();
   });
 
   it('render Browser', async () => {
@@ -215,4 +239,83 @@ describe('BrowserTab', () => {
       ).toBe(false);
     });
   });
+
+  describe('WebView onOpenWindow', () => {
+    it('passes onOpenWindow handler to WebView', async () => {
+      renderWithProvider(<BrowserTab {...mockProps} />, {
+        state: mockInitialState,
+      });
+
+      await waitFor(() =>
+        expect(screen.getByTestId('browser-webview')).toBeVisible(),
+      );
+
+      const webView = screen.getByTestId('browser-webview');
+
+      expect(typeof webView.props.onOpenWindow).toBe('function');
+    });
+
+    it('calls injectJavaScript with sanitized target URL when onOpenWindow fires', async () => {
+      renderWithProvider(<BrowserTab {...mockProps} />, {
+        state: mockInitialState,
+      });
+
+      await waitFor(() =>
+        expect(screen.getByTestId('browser-webview')).toBeVisible(),
+      );
+
+      const webView = screen.getByTestId('browser-webview');
+      const { onOpenWindow } = webView.props;
+
+      onOpenWindow({
+        nativeEvent: { targetUrl: 'https://stake.lido.fi' },
+      });
+
+      expect(mockInjectJavaScript).toHaveBeenCalledTimes(1);
+      expect(mockInjectJavaScript).toHaveBeenCalledWith(
+        "window.location.href = 'https://stake.lido.fi'; true;",
+      );
+    });
+
+    it('sanitizes single quotes in the target URL before injecting', async () => {
+      renderWithProvider(<BrowserTab {...mockProps} />, {
+        state: mockInitialState,
+      });
+
+      await waitFor(() =>
+        expect(screen.getByTestId('browser-webview')).toBeVisible(),
+      );
+
+      const webView = screen.getByTestId('browser-webview');
+      const { onOpenWindow } = webView.props;
+
+      onOpenWindow({
+        nativeEvent: { targetUrl: "https://example.com/path?q='test'" },
+      });
+
+      expect(mockInjectJavaScript).toHaveBeenCalledTimes(1);
+      expect(mockInjectJavaScript).toHaveBeenCalledWith(
+        "window.location.href = 'https://example.com/path?q=%27test%27'; true;",
+      );
+    });
+
+    it('does not call injectJavaScript when targetUrl is empty', async () => {
+      renderWithProvider(<BrowserTab {...mockProps} />, {
+        state: mockInitialState,
+      });
+
+      await waitFor(() =>
+        expect(screen.getByTestId('browser-webview')).toBeVisible(),
+      );
+
+      const webView = screen.getByTestId('browser-webview');
+      const { onOpenWindow } = webView.props;
+
+      onOpenWindow({
+        nativeEvent: { targetUrl: '' },
+      });
+
+      expect(mockInjectJavaScript).not.toHaveBeenCalled();
+    });
+  });
 });