feat(WKWebview): [iOS] Add 'allowsBackForwardNavigationGestures' property (#97)

docs/Reference.md

@@ -44,6 +44,7 @@ This document lays out the current public properties and methods for the React N
 - [`url`](Reference.md#url)
 - [`html`](Reference.md#html)
 - [`hideKeyboardAccessoryView`](Reference.md#hidekeyboardaccessoryview)
+- [`allowsBackForwardNavigationGestures`](Reference.md#allowsbackforwardnavigationgestures)
 
 ## Methods Index
 
@@ -494,6 +495,17 @@ If true, this will hide the keyboard accessory view (< > and Done) when using th
 | ------- | -------- | -------- |
 | boolean | No       | iOS      |
 
+---
+
+### `allowsBackForwardNavigationGestures`
+
+If true, this will be able horizontal swipe gestures when using the WKWebView. The default value is `false`.
+
+| Type    | Required | Platform |
+| ------- | -------- | -------- |
+| boolean | No       | iOS      |
+
+
 ## Methods
 
 ### `extraNativeComponentConfig()`

ios/RNCWKWebView.h

@@ -36,6 +36,7 @@ shouldStartLoadForRequest:(NSMutableDictionary<NSString *, id> *)request
 @property (nonatomic, assign) UIEdgeInsets contentInset;
 @property (nonatomic, assign) BOOL automaticallyAdjustContentInsets;
 @property (nonatomic, assign) BOOL hideKeyboardAccessoryView;
+@property (nonatomic, assign) BOOL allowsBackForwardNavigationGestures;
 
 - (void)postMessage:(NSString *)message;
 - (void)injectJavaScript:(NSString *)script;

ios/RNCWKWebView.m

@@ -102,6 +102,7 @@ static NSString *const MessageHanderName = @"ReactNative";
     _webView.scrollView.scrollEnabled = _scrollEnabled;
     _webView.scrollView.bounces = _bounces;
     [_webView addObserver:self forKeyPath:@"estimatedProgress" options:NSKeyValueObservingOptionOld | NSKeyValueObservingOptionNew context:nil];
+    _webView.allowsBackForwardNavigationGestures = _allowsBackForwardNavigationGestures;
 
 #if defined(__IPHONE_OS_VERSION_MAX_ALLOWED) && __IPHONE_OS_VERSION_MAX_ALLOWED >= 110000 /* __IPHONE_11_0 */
     if ([_webView.scrollView respondsToSelector:@selector(setContentInsetAdjustmentBehavior:)]) {

ios/RNCWKWebViewManager.m

@@ -44,6 +44,7 @@ RCT_EXPORT_VIEW_PROPERTY(dataDetectorTypes, WKDataDetectorTypes)
 RCT_EXPORT_VIEW_PROPERTY(contentInset, UIEdgeInsets)
 RCT_EXPORT_VIEW_PROPERTY(automaticallyAdjustContentInsets, BOOL)
 RCT_EXPORT_VIEW_PROPERTY(hideKeyboardAccessoryView, BOOL)
+RCT_EXPORT_VIEW_PROPERTY(allowsBackForwardNavigationGestures, BOOL)
 
 /**
  * Expose methods to enable messaging the webview.

js/WebView.ios.js

@@ -151,6 +151,14 @@ class WebView extends React.Component<WebViewSharedProps, State> {
         'The scalesPageToFit property is not supported when useWebKit = true',
       );
     }
+    if (
+      !this.props.useWebKit &&
+      this.props.allowsBackForwardNavigationGestures
+    ) {
+      console.warn(
+        'The allowsBackForwardNavigationGestures property is not supported when useWebKit = false',
+      );
+    }
   }
 
   render() {
@@ -262,6 +270,7 @@ class WebView extends React.Component<WebViewSharedProps, State> {
           this.props.automaticallyAdjustContentInsets
         }
         hideKeyboardAccessoryView={this.props.hideKeyboardAccessoryView}
+        allowsBackForwardNavigationGestures={this.props.allowsBackForwardNavigationGestures}
         onLoadingStart={this._onLoadingStart}
         onLoadingFinish={this._onLoadingFinish}
         onLoadingError={this._onLoadingError}

js/WebViewTypes.js

@@ -224,6 +224,11 @@ export type IOSWebViewProps = $ReadOnly<{|
    * backward compatible.
    */
   hideKeyboardAccessoryView?: ?boolean,
+  /**
+   * A Boolean value indicating whether horizontal swipe gestures will trigger
+   * back-forward list navigations.
+   */
+  allowsBackForwardNavigationGestures?: ?boolean,
 |}>;
 
 export type AndroidWebViewProps = $ReadOnly<{|