Introduce scrollEnabled property, refactor a way of setting the `We…

…bView` settings, and apply minor fixes to the native codebase (#190)

packages/turbo/README.md

@@ -87,6 +87,10 @@ The name of the application as used in the user agent string. Please note that c
 
 Enables pull to refresh functionality. Default value is `true`.
 
+### `scrollEnabled`
+
+Enables scrolling in the webview. Default value is `true`.
+
 ### `stradaComponents`
 
 `VisitableView` supports defining [Strada components](https://strada.hotwired.dev/) that receive and reply to messages from web components that are present on the page within one session. This prop accepts an array of Strada components that will be registered in the webview.

packages/turbo/android/src/main/java/com/reactnativeturbowebview/RNSession.kt

@@ -9,7 +9,6 @@ import androidx.lifecycle.LifecycleOwner
 import androidx.lifecycle.lifecycleScope
 import androidx.lifecycle.whenStateAtLeast
 import com.facebook.react.BuildConfig
-import com.facebook.react.bridge.Arguments
 import com.facebook.react.bridge.ReactApplicationContext
 import dev.hotwire.turbo.errors.TurboVisitError
 import dev.hotwire.turbo.session.TurboSession

packages/turbo/android/src/main/java/com/reactnativeturbowebview/RNVisitableView.kt

@@ -2,8 +2,10 @@ package com.reactnativeturbowebview
 
 import android.content.Context
 import android.graphics.Bitmap
+import android.view.MotionEvent
 import android.view.ViewGroup
 import android.webkit.CookieManager
+import android.webkit.WebSettings
 import android.widget.LinearLayout
 import androidx.appcompat.widget.AppCompatImageView
 import androidx.core.view.isVisible
@@ -16,12 +18,7 @@ import dev.hotwire.turbo.views.TurboView
 import dev.hotwire.turbo.views.TurboWebView
 import dev.hotwire.turbo.visit.TurboVisitOptions
 import dev.hotwire.turbo.R
-import dev.hotwire.turbo.errors.HttpError
-import dev.hotwire.turbo.errors.LoadError
 import dev.hotwire.turbo.errors.TurboVisitError
-import dev.hotwire.turbo.errors.WebError
-import dev.hotwire.turbo.errors.WebSslError
-import dev.hotwire.turbo.visit.TurboVisitAction
 
 const val REFRESH_SCRIPT = "typeof Turbo.session.refresh === 'function'" +
         "? Turbo.session.refresh(document.baseURI)" + // Turbo 8+
@@ -46,21 +43,34 @@ class RNVisitableView(context: Context) : LinearLayout(context), SessionSubscrib
 
   lateinit var sessionHandle: String
   var applicationNameForUserAgent: String? = null
+  var scrollEnabled: Boolean = true
+    set(value) {
+      field = value
+      updateWebViewConfiguration()
+    }
   var pullToRefreshEnabled: Boolean = true
     set(value) {
       field = value
       setPullToRefresh(value)
     }
 
   // Session
-  private val session: RNSession by lazy {
-    RNSessionManager.findOrCreateSession(
-      reactContext,
-      sessionHandle,
-      applicationNameForUserAgent
-    )
-  }
-  private val webView: TurboWebView get() = session.webView
+  private var _session: RNSession? = null
+  private val session: RNSession?
+      get() {
+        if (_session != null) {
+            return _session
+        }
+
+        if (!::sessionHandle.isInitialized) {
+            return null
+        }
+
+        _session = RNSessionManager.findOrCreateSession(reactContext, sessionHandle, applicationNameForUserAgent)
+        return _session
+    }
+
+  private val webView: TurboWebView? get() = session?.webView
 
   private var onConfirmHandler: ((result: Boolean) -> Unit)? = null
   private var onAlertHandler: (() -> Unit)? = null
@@ -92,8 +102,22 @@ class RNVisitableView(context: Context) : LinearLayout(context), SessionSubscrib
     }
   }
 
+  private fun updateWebViewConfiguration() {
+    if (webView == null) return
+
+    setOnTouchListener(webView!!, scrollEnabled)
+  }
+
+  private fun setOnTouchListener(webView: TurboWebView, scrollEnabled: Boolean) {
+    if (!scrollEnabled) {
+      webView.setOnTouchListener(OnTouchListener { _, event -> event.action == MotionEvent.ACTION_MOVE })
+    } else {
+      webView.setOnTouchListener(null)
+    }
+  }
+
   private fun performVisit(restoreWithCachedSnapshot: Boolean, reload: Boolean) {
-    session.visit(
+    session?.visit(
       url = url,
       restoreWithCachedSnapshot = restoreWithCachedSnapshot,
       reload = reload,
@@ -109,7 +133,7 @@ class RNVisitableView(context: Context) : LinearLayout(context), SessionSubscrib
       // Visit every time the WebView is reattached to the current Fragment.
       if (isWebViewAttachedToNewDestination) {
         val currentSessionVisitRestored =
-          !isInitialVisit && session.currentVisit?.destinationIdentifier == url.hashCode() && session.restoreCurrentVisit()
+          !isInitialVisit && session?.currentVisit?.destinationIdentifier == url.hashCode() && session?.restoreCurrentVisit() == true
 
         if (!currentSessionVisitRestored) {
           showProgressView()
@@ -121,11 +145,11 @@ class RNVisitableView(context: Context) : LinearLayout(context), SessionSubscrib
   }
 
   override fun refresh() {
-    webView.evaluateJavascript(REFRESH_SCRIPT, null)
+    webView?.evaluateJavascript(REFRESH_SCRIPT, null)
   }
 
   override fun reload(displayProgress: Boolean) {
-    if (webView.url == null) return
+    if (webView?.url == null) return
 
     turboView.webViewRefresh?.apply {
       if (displayProgress && !isRefreshing) {
@@ -164,7 +188,7 @@ class RNVisitableView(context: Context) : LinearLayout(context), SessionSubscrib
 
   override fun onAttachedToWindow() {
     super.onAttachedToWindow()
-    session.registerVisitableView(this)
+    session?.registerVisitableView(this)
     visit()
   }
 
@@ -173,24 +197,24 @@ class RNVisitableView(context: Context) : LinearLayout(context), SessionSubscrib
     // This can happen when the user uses one session for different
     // bottom tabs. In this case, we need to remove the webview from
     // the parent before attaching it to the new one.
-    if (webView.parent != null) {
-      (webView.parent as ViewGroup).removeView(webView)
+    if (webView!!.parent != null) {
+      (webView!!.parent as ViewGroup).removeView(webView)
     }
 
     // Re-layout the TurboView before attaching to make page restorations work correctly.
     requestLayout()
 
-    turboView.attachWebView(webView) { attachedToNewDestination ->
+    turboView.attachWebView(webView!!) { attachedToNewDestination ->
       onReady(attachedToNewDestination)
     }
   }
 
   override fun detachWebView() {
     screenshotView()
 
-    (webView.parent as ViewGroup?)?.endViewTransition(webView)
+    (webView!!.parent as ViewGroup?)?.endViewTransition(webView)
 
-    turboView.detachWebView(webView) {
+    turboView.detachWebView(webView!!) {
       // Force layout to fix improper layout of the TurboWebView.
       forceLayout()
     }
@@ -261,7 +285,7 @@ class RNVisitableView(context: Context) : LinearLayout(context), SessionSubscrib
   // region SessionSubscriber
 
   override fun injectJavaScript(script: String) {
-    webView.evaluateJavascript(script, null)
+    webView?.evaluateJavascript(script, null)
   }
 
   override fun handleMessage(message: WritableMap) {
@@ -311,16 +335,17 @@ class RNVisitableView(context: Context) : LinearLayout(context), SessionSubscrib
 
   override fun visitRendered() {
     sendEvent(RNVisitableViewEvent.LOAD, Arguments.createMap().apply {
-      putString("title", webView.title)
-      putString("url", webView.url)
+      putString("title", webView!!.title)
+      putString("url", webView!!.url)
     })
+    updateWebViewConfiguration()
     removeTransitionalViews()
   }
 
   override fun visitCompleted(completedOffline: Boolean) {
     sendEvent(RNVisitableViewEvent.LOAD, Arguments.createMap().apply {
-      putString("title", webView.title)
-      putString("url", webView.url)
+      putString("title", webView!!.title)
+      putString("url", webView!!.url)
     })
     CookieManager
       .getInstance()

packages/turbo/android/src/main/java/com/reactnativeturbowebview/RNVisitableViewManager.kt

@@ -57,6 +57,10 @@ class RNVisitableViewManager(
     view.pullToRefreshEnabled = pullToRefreshEnabled
   }
 
+  @ReactProp(name = "scrollEnabled")
+  fun setScrollEnabled(view: RNVisitableView, scrollEnabled: Boolean) {
+    view.scrollEnabled = scrollEnabled
+  }
 
   override fun getCommandsMap(): MutableMap<String, Int> = RNVisitableViewCommand.values()
     .associate {

packages/turbo/ios/RNVisitableView.swift

@@ -14,19 +14,28 @@ let REFRESH_SCRIPT = "typeof Turbo.session.refresh === 'function'" +
 class RNVisitableView: UIView, RNSessionSubscriber {
   var id: UUID = UUID()
   @objc var sessionHandle: NSString? = nil
-  @objc var applicationNameForUserAgent: NSString? = nil
   @objc var url: NSString = "" {
     didSet {
       if(url != oldValue) {
         visit()
       }
     }
   }
+  @objc var applicationNameForUserAgent: NSString? = nil {
+    didSet {
+      webViewConfiguration.applicationNameForUserAgent = applicationNameForUserAgent as? String
+    }
+  }
   @objc var pullToRefreshEnabled: Bool = true {
     didSet {
       controller!.visitableView.allowsPullToRefresh = pullToRefreshEnabled
     }
   }
+  @objc var scrollEnabled: Bool = true {
+    didSet {
+      configureWebView()
+    }
+  }
   @objc var onMessage: RCTDirectEventBlock?
   @objc var onVisitProposal: RCTDirectEventBlock?
   @objc var onOpenExternalUrl: RCTDirectEventBlock?
@@ -43,23 +52,35 @@ class RNVisitableView: UIView, RNSessionSubscriber {
   private var onConfirmHandler: ((Bool) -> Void)?
   private var onAlertHandler: (() -> Void)?
 
-  private lazy var session: RNSession = RNSessionManager.shared.findOrCreateSession(sessionHandle: sessionHandle!, webViewConfiguration: webViewConfiguration)
-  private lazy var webView: WKWebView = session.webView
-  private lazy var webViewConfiguration: WKWebViewConfiguration = {
-    let configuration = WKWebViewConfiguration()
-    configuration.applicationNameForUserAgent = applicationNameForUserAgent as String?
-    return configuration
-  }()
+  private var _session: RNSession? = nil
+  private var session: RNSession? {
+    if (_session != nil) {
+      return _session
+    }
+
+    if (sessionHandle == nil) {
+      return nil
+    }
+
+    _session = RNSessionManager.shared.findOrCreateSession(sessionHandle: sessionHandle!, webViewConfiguration: webViewConfiguration)
+    return _session
+  }
+  private var webView: WKWebView? { session?.webView }
+  private var webViewConfiguration: WKWebViewConfiguration = WKWebViewConfiguration()
 
   lazy var controller: RNVisitableViewController? = RNVisitableViewController(reactViewController: reactViewController(), delegate: self)
 
   private var isRefreshing: Bool {
     controller!.visitableView.isRefreshing
   }
-
-  // var isModal: Bool {
-  //   return controller.reactViewController()?.isModal()
-  // }
+
+  private func configureWebView() {
+    if (webView == nil) {
+      return
+    }
+
+    webView!.scrollView.isScrollEnabled = scrollEnabled
+  }
 
   override func willMove(toWindow newWindow: UIWindow?) {
     super.willMove(toWindow: newWindow)
@@ -95,6 +116,7 @@ class RNVisitableView: UIView, RNSessionSubscriber {
 
   override func removeFromSuperview() {
     super.removeFromSuperview()
+    _session = nil
     controller = nil
   }
 
@@ -105,7 +127,7 @@ class RNVisitableView: UIView, RNSessionSubscriber {
   }
 
   public func injectJavaScript(code: NSString) -> Void {
-    webView.evaluateJavaScript(code as String)
+    webView?.evaluateJavaScript(code as String)
   }
 
   public func sendAlertResult() -> Void {
@@ -120,23 +142,23 @@ class RNVisitableView: UIView, RNSessionSubscriber {
   }
 
   public func reload() {
-    session.reload()
+    session?.reload()
   }
 
   public func refresh() {
-      webView.evaluateJavaScript(REFRESH_SCRIPT)
+    webView?.evaluateJavaScript(REFRESH_SCRIPT)
   }
 
   private func visit() {
     if (controller?.visitableURL?.absoluteString == url as String) {
       return
     }
     controller!.visitableURL = URL(string: String(url))
-    session.visit(controller!)
+    session?.visit(controller!)
   }
 
   public func didProposeVisit(proposal: VisitProposal){
-    if (webView.url == proposal.url && proposal.options.action == .replace) {
+    if (webView?.url == proposal.url && proposal.options.action == .replace) {
       // When reopening same URL we want to refresh webview
       refresh()
     } else {
@@ -191,7 +213,7 @@ class RNVisitableView: UIView, RNSessionSubscriber {
   }
 
   func clearSessionSnapshotCache(){
-    session.clearSnapshotCache()
+    session?.clearSnapshotCache()
   }
 
   func handleAlert(message: String, completionHandler: @escaping () -> Void) {
@@ -214,11 +236,12 @@ class RNVisitableView: UIView, RNSessionSubscriber {
 extension RNVisitableView: RNVisitableViewControllerDelegate {
 
   func visitableWillAppear(visitable: Visitable) {
-    session.visitableViewWillAppear(view: self)
+    session?.visitableViewWillAppear(view: self)
   }
 
   func visitableDidAppear(visitable: Visitable) {
-    session.visitableViewDidAppear(view: self)
+    configureWebView()
+    session?.visitableViewDidAppear(view: self)
   }
 
   func visitableDidDisappear(visitable: Visitable) {
@@ -227,8 +250,8 @@ extension RNVisitableView: RNVisitableViewControllerDelegate {
 
   func visitableDidRender(visitable: Visitable) {
     let event: [AnyHashable: Any] = [
-      "title": webView.title!,
-      "url": webView.url!
+      "title": webView!.title!,
+      "url": webView!.url!
     ]
     onLoad?(event)
   }

packages/turbo/ios/RNVisitableViewManager.m

@@ -17,6 +17,7 @@ @interface RCT_EXTERN_MODULE(RNVisitableViewManager, NSObject)
   RCT_EXPORT_VIEW_PROPERTY(sessionHandle, NSString)
   RCT_EXPORT_VIEW_PROPERTY(applicationNameForUserAgent, NSString)
   RCT_EXPORT_VIEW_PROPERTY(pullToRefreshEnabled, BOOL)
+  RCT_EXPORT_VIEW_PROPERTY(scrollEnabled, BOOL)
   RCT_EXPORT_VIEW_PROPERTY(onVisitProposal, RCTDirectEventBlock)
   RCT_EXPORT_VIEW_PROPERTY(onOpenExternalUrl, RCTDirectEventBlock)
   RCT_EXPORT_VIEW_PROPERTY(onMessage, RCTDirectEventBlock)

packages/turbo/src/RNVisitableView.ts

@@ -27,6 +27,7 @@ export interface RNVisitableViewProps {
   sessionHandle?: string;
   applicationNameForUserAgent?: string;
   pullToRefreshEnabled: boolean;
+  scrollEnabled: boolean;
   onLoad?: (e: NativeSyntheticEvent<LoadEvent>) => void;
   onMessage?: (e: NativeSyntheticEvent<MessageEvent>) => void;
   onError?: (e: NativeSyntheticEvent<ErrorEvent>) => void;