@exodus/react-native-webview 11.26.1-exodus.20 → 11.26.1-exodus.22

package/lib/WebView.android.js

@@ -5,7 +5,7 @@ import BatchedBridge from 'react-native/Libraries/BatchedBridge/BatchedBridge';
 import codegenNativeCommandsUntyped from 'react-native/Libraries/Utilities/codegenNativeCommands';
 import invariant from 'invariant';
 import RNCWebView from "./WebViewNativeComponent.android";
-import { defaultOriginWhitelist, defaultRenderError, defaultRenderLoading, useWebWiewLogic, versionPasses, } from './WebViewShared';
+import { defaultOriginWhitelist, defaultDeeplinkWhitelist, defaultRenderError, defaultRenderLoading, useWebWiewLogic, versionPasses, } from './WebViewShared';
 import styles from './WebView.styles';
 const { getWebViewDefaultUserAgent } = NativeModules.RNCWebViewUtils;
 let userAgentPromise;
@@ -31,7 +31,7 @@ const mediaPlaybackRequiresUserAction = true;
 const setSupportMultipleWindows = true;
 const mixedContentMode = 'never';
 const hardMinimumChromeVersion = '100.0'; // TODO: determinime a good lower bound
-const WebViewComponent = forwardRef(({ overScrollMode = 'always', javaScriptEnabled = true, thirdPartyCookiesEnabled = true, scalesPageToFit = true, saveFormDataDisabled = false, cacheEnabled = true, androidHardwareAccelerationDisabled = false, androidLayerType = "none", originWhitelist = defaultOriginWhitelist, setBuiltInZoomControls = true, setDisplayZoomControls = false, nestedScrollEnabled = false, startInLoadingState, onLoadStart, onError, onLoad, onLoadEnd, onMessage: onMessageProp, onOpenWindow: onOpenWindowProp, renderLoading, renderError, style, containerStyle, source, onShouldStartLoadWithRequest: onShouldStartLoadWithRequestProp, validateMeta, validateData, minimumChromeVersion, unsupportedVersionComponent: UnsupportedVersionComponent, ...otherProps }, ref) => {
+const WebViewComponent = forwardRef(({ overScrollMode = 'always', javaScriptEnabled = true, thirdPartyCookiesEnabled = true, scalesPageToFit = true, saveFormDataDisabled = false, cacheEnabled = true, androidHardwareAccelerationDisabled = false, androidLayerType = "none", originWhitelist = defaultOriginWhitelist, deeplinkWhitelist = defaultDeeplinkWhitelist, setBuiltInZoomControls = true, setDisplayZoomControls = false, nestedScrollEnabled = false, startInLoadingState, onLoadStart, onError, onLoad, onLoadEnd, onMessage: onMessageProp, onOpenWindow: onOpenWindowProp, renderLoading, renderError, style, containerStyle, source, onShouldStartLoadWithRequest: onShouldStartLoadWithRequestProp, validateMeta, validateData, minimumChromeVersion, unsupportedVersionComponent: UnsupportedVersionComponent, ...otherProps }, ref) => {
     var _a;
     const messagingModuleName = useRef(`WebViewMessageHandler${uniqueRef += 1}`).current;
     const webViewRef = useRef(null);
@@ -52,6 +52,7 @@ const WebViewComponent = forwardRef(({ overScrollMode = 'always', javaScriptEnab
         onOpenWindowProp,
         startInLoadingState,
         originWhitelist,
+        deeplinkWhitelist,
         onShouldStartLoadWithRequestProp,
         onShouldStartLoadWithRequestCallback,
         validateMeta,

package/lib/WebView.ios.js

@@ -4,7 +4,7 @@ import invariant from 'invariant';
 // @ts-expect-error react-native doesn't have this type
 import codegenNativeCommandsUntyped from 'react-native/Libraries/Utilities/codegenNativeCommands';
 import RNCWebView from "./WebViewNativeComponent.ios";
-import { defaultOriginWhitelist, defaultRenderError, defaultRenderLoading, useWebWiewLogic, versionPasses, } from './WebViewShared';
+import { defaultOriginWhitelist, defaultDeeplinkWhitelist, defaultRenderError, defaultRenderLoading, useWebWiewLogic, versionPasses, } from './WebViewShared';
 import styles from './WebView.styles';
 const codegenNativeCommands = codegenNativeCommandsUntyped;
 const Commands = codegenNativeCommands({
@@ -39,7 +39,7 @@ const sharedCookiesEnabled = false;
 const enableApplePay = false;
 const dataDetectorTypes = 'none';
 const hardMinimumIOSVersion = '12.5.6 <13, 13.6.1 <14, 14.8.1 <15, 15.7.1';
-const WebViewComponent = forwardRef(({ javaScriptEnabled = true, cacheEnabled = true, originWhitelist = defaultOriginWhitelist, textInteractionEnabled = true, injectedJavaScript, injectedJavaScriptBeforeContentLoaded, startInLoadingState, onLoadStart, onError, onLoad, onLoadEnd, onMessage: onMessageProp, renderLoading, renderError, style, containerStyle, source, incognito, validateMeta, validateData, decelerationRate: decelerationRateProp, onShouldStartLoadWithRequest: onShouldStartLoadWithRequestProp, minimumIOSVersion, unsupportedVersionComponent: UnsupportedVersionComponent, ...otherProps }, ref) => {
+const WebViewComponent = forwardRef(({ javaScriptEnabled = true, cacheEnabled = true, originWhitelist = defaultOriginWhitelist, deeplinkWhitelist = defaultDeeplinkWhitelist, textInteractionEnabled = true, injectedJavaScript, injectedJavaScriptBeforeContentLoaded, startInLoadingState, onLoadStart, onError, onLoad, onLoadEnd, onMessage: onMessageProp, renderLoading, renderError, style, containerStyle, source, incognito, validateMeta, validateData, decelerationRate: decelerationRateProp, onShouldStartLoadWithRequest: onShouldStartLoadWithRequestProp, minimumIOSVersion, unsupportedVersionComponent: UnsupportedVersionComponent, ...otherProps }, ref) => {
     const webViewRef = useRef(null);
     const onShouldStartLoadWithRequestCallback = useCallback((shouldStart, _url, lockIdentifier = 0) => {
         const viewManager = RNCWebViewManager;
@@ -53,6 +53,7 @@ const WebViewComponent = forwardRef(({ javaScriptEnabled = true, cacheEnabled =
         onMessageProp,
         startInLoadingState,
         originWhitelist,
+        deeplinkWhitelist,
         onShouldStartLoadWithRequestProp,
         onShouldStartLoadWithRequestCallback,
         validateMeta,

package/lib/WebViewShared.d.ts

@@ -1,11 +1,12 @@
 import React from 'react';
 import { OnShouldStartLoadWithRequest, ShouldStartLoadRequestEvent, WebViewError, WebViewErrorEvent, WebViewMessageEvent, WebViewMessage, WebViewNavigationEvent, WebViewOpenWindowEvent, WebViewProgressEvent, WebViewNativeEvent } from './WebViewTypes';
 declare const defaultOriginWhitelist: readonly ["https://*"];
-declare const createOnShouldStartLoadWithRequest: (loadRequest: (shouldStart: boolean, url: string, lockIdentifier: number) => void, originWhitelist: readonly string[], onShouldStartLoadWithRequest?: OnShouldStartLoadWithRequest | undefined) => ({ nativeEvent }: ShouldStartLoadRequestEvent) => void;
+declare const defaultDeeplinkWhitelist: readonly ["https:"];
+declare const createOnShouldStartLoadWithRequest: (loadRequest: (shouldStart: boolean, url: string, lockIdentifier: number) => void, originWhitelist: readonly string[], deepLinkWhitelist: readonly string[], onShouldStartLoadWithRequest?: OnShouldStartLoadWithRequest | undefined) => ({ nativeEvent }: ShouldStartLoadRequestEvent) => void;
 declare const defaultRenderLoading: () => JSX.Element;
 declare const defaultRenderError: (errorDomain: string | undefined, errorCode: number, errorDesc: string) => JSX.Element;
-export { defaultOriginWhitelist, createOnShouldStartLoadWithRequest, defaultRenderLoading, defaultRenderError, };
-export declare const useWebWiewLogic: ({ startInLoadingState, onLoadStart, onLoad, onLoadEnd, onError, onMessageProp, onOpenWindowProp, originWhitelist, onShouldStartLoadWithRequestProp, onShouldStartLoadWithRequestCallback, validateMeta, validateData, }: {
+export { defaultOriginWhitelist, defaultDeeplinkWhitelist, createOnShouldStartLoadWithRequest, defaultRenderLoading, defaultRenderError, };
+export declare const useWebWiewLogic: ({ startInLoadingState, onLoadStart, onLoad, onLoadEnd, onError, onMessageProp, onOpenWindowProp, originWhitelist, deeplinkWhitelist, onShouldStartLoadWithRequestProp, onShouldStartLoadWithRequestCallback, validateMeta, validateData, }: {
     startInLoadingState?: boolean | undefined;
     onLoadStart?: ((event: WebViewNavigationEvent) => void) | undefined;
     onLoad?: ((event: WebViewNavigationEvent) => void) | undefined;
@@ -14,6 +15,7 @@ export declare const useWebWiewLogic: ({ startInLoadingState, onLoadStart, onLoa
     onMessageProp?: ((event: WebViewMessage) => void) | undefined;
     onOpenWindowProp?: ((event: WebViewOpenWindowEvent) => void) | undefined;
     originWhitelist: readonly string[];
+    deeplinkWhitelist: readonly string[];
     onShouldStartLoadWithRequestProp?: OnShouldStartLoadWithRequest | undefined;
     onShouldStartLoadWithRequestCallback: (shouldStart: boolean, url: string, lockIdentifier?: number | undefined) => void;
     validateMeta: (event: WebViewNativeEvent) => WebViewNativeEvent;

package/lib/WebViewShared.js

@@ -3,34 +3,80 @@ import React, { useCallback, useMemo, useRef, useState } from 'react';
 import { Linking, View, ActivityIndicator, Text, Platform } from 'react-native';
 import styles from './WebView.styles';
 const defaultOriginWhitelist = ['https://*'];
+const defaultDeeplinkWhitelist = ['https:'];
+const defaultDeeplinkBlocklist = [`http:`, `file:`, `javascript:`];
 const extractOrigin = (url) => {
     const result = /^[A-Za-z][A-Za-z0-9+\-.]+:(\/\/)?[^/]*/.exec(url);
     return result === null ? '' : result[0];
 };
-const originWhitelistToRegex = (originWhitelist) => `^${escapeStringRegexp(originWhitelist).replace(/\\\*/g, '.*')}$`;
+const stringWhitelistToRegex = (originWhitelist) => new RegExp(`^${escapeStringRegexp(originWhitelist).replace(/\\\*/g, '.*')}$`);
+const matchWithRegexList = (compiledRegexList, value) => {
+    return compiledRegexList.some(x => x.test(value));
+};
+const matchWithStringList = (prefixes, value) => {
+    if (typeof value !== 'string')
+        throw new Error(`value was not a string`);
+    return Array.prototype.includes.call(prefixes, value);
+};
 const _passesWhitelist = (compiledWhitelist, url) => {
     const origin = extractOrigin(url);
     if (!origin)
         return false;
-    if (origin !== new URL(url).origin)
+    try {
+        const decodedUrl = new URL(url);
+        if (origin !== decodedUrl.origin)
+            return null;
+    }
+    catch {
+        return false;
+    }
+    return matchWithRegexList(compiledWhitelist, origin);
+};
+const compileWhitelist = (originWhitelist) => ['about:blank', ...(originWhitelist || [])].map(stringWhitelistToRegex);
+const urlToProtocolScheme = (url) => {
+    try {
+        return new URL(url).protocol;
+    }
+    catch {
+        // Protocol schemes must start with a letter and cannot start with digits, underscores etc.
+        // e.g 0invalid, _invalid, +invalid,  -invalid, .invalid will all become null
         return null;
-    return compiledWhitelist.some(x => new RegExp(x).test(origin));
+    }
 };
-const compileWhitelist = (originWhitelist) => ['about:blank', ...(originWhitelist || [])].map(originWhitelistToRegex);
-const createOnShouldStartLoadWithRequest = (loadRequest, originWhitelist, onShouldStartLoadWithRequest) => {
+const createOnShouldStartLoadWithRequest = (loadRequest, originWhitelist, deepLinkWhitelist, onShouldStartLoadWithRequest) => {
+    const compiledWhiteList = compileWhitelist(originWhitelist);
     return ({ nativeEvent }) => {
         let shouldStart = true;
         const { url, lockIdentifier, isTopFrame } = nativeEvent;
-        if (!_passesWhitelist(compileWhitelist(originWhitelist), url)) {
-            Linking.canOpenURL(url).then((supported) => {
-                if (supported && isTopFrame && /^https:\/\//.test(url)) {
-                    return Linking.openURL(url);
+        /** Check if the url passes the origin whitelist */
+        if (!_passesWhitelist(compiledWhiteList, url)) {
+            const protocol = urlToProtocolScheme(url);
+            /* Check that the protocol was properly parsed */
+            if (protocol !== null) {
+                /** Check if the protocol passes the hardcoded deeplink blocklist */
+                const foundMatchInBlocklist = matchWithStringList(defaultDeeplinkBlocklist, protocol);
+                if (!foundMatchInBlocklist) {
+                    /** Check if the protocol passes the dynamic deeplink allow list */
+                    const foundMatchInAllowlist = matchWithStringList(deepLinkWhitelist, protocol);
+                    if (foundMatchInAllowlist) {
+                        Linking.canOpenURL(url).then((supported) => {
+                            if (supported && isTopFrame) {
+                                return Linking.openURL(url);
+                            }
+                            console.warn(`Can't open url: ${url}`);
+                            return undefined;
+                        }).catch(e => {
+                            console.warn('Error opening URL: ', e);
+                        });
+                    }
+                    else {
+                        console.warn(`Failed to pass whitelist for deep link url: ${url}`);
+                    }
+                }
+                else {
+                    console.warn(`Failed to pass default block list for deep link url: ${url}`);
                 }
-                console.warn(`Can't open url: ${url}`);
-                return undefined;
-            }).catch(e => {
-                console.warn('Error opening URL: ', e);
-            });
+            }
             shouldStart = false;
         }
         else if (onShouldStartLoadWithRequest) {
@@ -48,8 +94,8 @@ const defaultRenderError = (errorDomain, errorCode, errorDesc) => (<View style={
     <Text style={styles.errorText}>{`Error Code: ${errorCode}`}</Text>
     <Text style={styles.errorText}>{`Description: ${errorDesc}`}</Text>
   </View>);
-export { defaultOriginWhitelist, createOnShouldStartLoadWithRequest, defaultRenderLoading, defaultRenderError, };
-export const useWebWiewLogic = ({ startInLoadingState, onLoadStart, onLoad, onLoadEnd, onError, onMessageProp, onOpenWindowProp, originWhitelist, onShouldStartLoadWithRequestProp, onShouldStartLoadWithRequestCallback, validateMeta, validateData, }) => {
+export { defaultOriginWhitelist, defaultDeeplinkWhitelist, createOnShouldStartLoadWithRequest, defaultRenderLoading, defaultRenderError, };
+export const useWebWiewLogic = ({ startInLoadingState, onLoadStart, onLoad, onLoadEnd, onError, onMessageProp, onOpenWindowProp, originWhitelist, deeplinkWhitelist, onShouldStartLoadWithRequestProp, onShouldStartLoadWithRequestCallback, validateMeta, validateData, }) => {
     const [viewState, setViewState] = useState(startInLoadingState ? "LOADING" : "IDLE");
     const [lastErrorEvent, setLastErrorEvent] = useState(null);
     const startUrl = useRef(null);
@@ -122,7 +168,7 @@ export const useWebWiewLogic = ({ startInLoadingState, onLoadStart, onLoad, onLo
         // !patch for Android only
         // REMOVED: onLoadProgress?.(event);
     }, [passesWhitelistUse]);
-    const onShouldStartLoadWithRequest = useMemo(() => createOnShouldStartLoadWithRequest(onShouldStartLoadWithRequestCallback, originWhitelist, onShouldStartLoadWithRequestProp), [originWhitelist, onShouldStartLoadWithRequestProp, onShouldStartLoadWithRequestCallback]);
+    const onShouldStartLoadWithRequest = useMemo(() => createOnShouldStartLoadWithRequest(onShouldStartLoadWithRequestCallback, originWhitelist, deeplinkWhitelist, onShouldStartLoadWithRequestProp), [originWhitelist, deeplinkWhitelist, onShouldStartLoadWithRequestProp, onShouldStartLoadWithRequestCallback]);
     // Android Only
     const onOpenWindow = useCallback((event) => {
         onOpenWindowProp === null || onOpenWindowProp === void 0 ? void 0 : onOpenWindowProp(event);

package/lib/WebViewTypes.d.ts

@@ -713,6 +713,11 @@ export interface WebViewSharedProps extends ViewProps {
      * The default whitelisted origins are "http://*" and "https://*".
      */
     readonly originWhitelist?: string[];
+    /**
+     * List of protocol schemes to allow being deep linked to. This requires
+     * an exact match. The default behavior is to only allow "https:".
+     */
+    readonly deeplinkWhitelist?: string[];
     /**
      * Function that allows custom handling of any web view requests. Return
      * `true` from the function to continue loading the request and `false`

package/package.json

@@ -9,7 +9,7 @@
     "Thibault Malbranche <malbranche.thibault@gmail.com>"
   ],
   "license": "MIT",
-  "version": "11.26.1-exodus.20",
+  "version": "11.26.1-exodus.22",
   "homepage": "https://github.com/ExodusMovement/react-native-webview#readme",
   "scripts": {
     "android": "react-native run-android",