From 07fd72600a76745d483c7b9ad655544e5d6134c4 Mon Sep 17 00:00:00 2001 From: Mo Bitar Date: Tue, 7 May 2019 18:41:15 -0500 Subject: [PATCH] Migrate to react-native-webview --- android/app/build.gradle | 1 + .../com/standardnotes/MainApplication.java | 2 + android/settings.gradle | 2 + ios/StandardNotes.xcodeproj/project.pbxproj | 49 +++++-------------- package-lock.json | 9 ++++ package.json | 1 + src/screens/Webview.js | 16 ++++-- 7 files changed, 40 insertions(+), 40 deletions(-) diff --git a/android/app/build.gradle b/android/app/build.gradle index a30542d6..a0db5db3 100644 --- a/android/app/build.gradle +++ b/android/app/build.gradle @@ -159,6 +159,7 @@ android { } dependencies { + compile project(':react-native-webview') compile project(':react-native-file-viewer') compile project(':react-native-fs') compile project(':react-native-gesture-handler') diff --git a/android/app/src/main/java/com/standardnotes/MainApplication.java b/android/app/src/main/java/com/standardnotes/MainApplication.java index 85cff87a..5376b684 100644 --- a/android/app/src/main/java/com/standardnotes/MainApplication.java +++ b/android/app/src/main/java/com/standardnotes/MainApplication.java @@ -9,6 +9,7 @@ import android.support.annotation.Nullable; import android.view.WindowManager; import com.facebook.react.ReactApplication; +import com.reactnativecommunity.webview.RNCWebViewPackage; import com.vinzscam.reactnativefileviewer.RNFileViewerPackage; import com.rnfs.RNFSPackage; import com.swmansion.gesturehandler.react.RNGestureHandlerPackage; @@ -46,6 +47,7 @@ public class MainApplication extends Application implements ReactApplication { protected List getPackages() { return Arrays.asList( new MainReactPackage(), + new RNCWebViewPackage(), new RNFileViewerPackage(), new RNFSPackage(), new RNGestureHandlerPackage(), diff --git a/android/settings.gradle b/android/settings.gradle index 7a2e98dd..cbf57f2c 100644 --- a/android/settings.gradle +++ b/android/settings.gradle @@ -1,4 +1,6 @@ rootProject.name = 'StandardNotes' +include ':react-native-webview' +project(':react-native-webview').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-webview/android') include ':react-native-file-viewer' project(':react-native-file-viewer').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-file-viewer/android') include ':react-native-fs' diff --git a/ios/StandardNotes.xcodeproj/project.pbxproj b/ios/StandardNotes.xcodeproj/project.pbxproj index 06ad1217..62fc93e3 100644 --- a/ios/StandardNotes.xcodeproj/project.pbxproj +++ b/ios/StandardNotes.xcodeproj/project.pbxproj @@ -5,7 +5,6 @@ }; objectVersion = 46; objects = { - /* Begin PBXBuildFile section */ 00C302E51ABCBA2D00DB3ED1 /* libRCTActionSheet.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302AC1ABCB8CE00DB3ED1 /* libRCTActionSheet.a */; }; 00C302E71ABCBA2D00DB3ED1 /* libRCTGeolocation.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302BA1ABCB90400DB3ED1 /* libRCTGeolocation.a */; }; @@ -58,6 +57,7 @@ CDB58A211F6C51A4009EF868 /* libReactNativeFingerprintScanner.a in Frameworks */ = {isa = PBXBuildFile; fileRef = CDB58A0F1F6C5174009EF868 /* libReactNativeFingerprintScanner.a */; }; CDB58A221F6C5235009EF868 /* libRCTAes.a in Frameworks */ = {isa = PBXBuildFile; fileRef = CDB58A091F6C516B009EF868 /* libRCTAes.a */; }; F0D84FDB75374348BC0017C2 /* libBugsnagReactNative.a in Frameworks */ = {isa = PBXBuildFile; fileRef = EFD3F9197A5F41C0904D7E60 /* libBugsnagReactNative.a */; }; + 4C4C0C80E5254E16BA086A86 /* libRNCWebView.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 4449457EB3FC4387810027F1 /* libRNCWebView.a */; }; /* End PBXBuildFile section */ /* Begin PBXContainerItemProxy section */ @@ -513,6 +513,8 @@ D38724A93AC141D6B51D1356 /* Foundation.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = unknown; name = Foundation.ttf; path = "../node_modules/react-native-vector-icons/Fonts/Foundation.ttf"; sourceTree = ""; }; EF2E9E34ADA441EDB4CE8370 /* FontAwesome5_Regular.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = unknown; name = FontAwesome5_Regular.ttf; path = "../node_modules/react-native-vector-icons/Fonts/FontAwesome5_Regular.ttf"; sourceTree = ""; }; EFD3F9197A5F41C0904D7E60 /* libBugsnagReactNative.a */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = archive.ar; path = libBugsnagReactNative.a; sourceTree = ""; }; + EC178A0479CE4154896293C3 /* RNCWebView.xcodeproj */ = {isa = PBXFileReference; name = "RNCWebView.xcodeproj"; path = "../node_modules/react-native-webview/ios/RNCWebView.xcodeproj"; sourceTree = ""; fileEncoding = undefined; lastKnownFileType = wrapper.pb-project; explicitFileType = undefined; includeInIndex = 0; }; + 4449457EB3FC4387810027F1 /* libRNCWebView.a */ = {isa = PBXFileReference; name = "libRNCWebView.a"; path = "libRNCWebView.a"; sourceTree = ""; fileEncoding = undefined; lastKnownFileType = archive.ar; explicitFileType = undefined; includeInIndex = 0; }; /* End PBXFileReference section */ /* Begin PBXFrameworksBuildPhase section */ @@ -554,6 +556,7 @@ 300BF5D7132F46BCAB353149 /* libRNGestureHandler.a in Frameworks */, 0A7C7EB08AA3465C8E686821 /* libRNFS.a in Frameworks */, 9E1F5D0FE7C441D685DAEEAA /* libRNFileViewer.a in Frameworks */, + 4C4C0C80E5254E16BA086A86 /* libRNCWebView.a in Frameworks */, ); runOnlyForDeploymentPostprocessing = 0; }; @@ -769,6 +772,7 @@ 19A39FBB53A3465B81022E02 /* RNGestureHandler.xcodeproj */, 2FAF1266E8404686B7F36870 /* RNFS.xcodeproj */, 645E3D9167344C3E81B7223C /* RNFileViewer.xcodeproj */, + EC178A0479CE4154896293C3 /* RNCWebView.xcodeproj */, ); name = Libraries; sourceTree = ""; @@ -902,6 +906,7 @@ 04047F33889C425483EB8244 /* libRNGestureHandler.a */, CEB6B877AE784055A8E294A8 /* libRNFS.a */, 37A42F4068AE42DD8D2DF182 /* libRNFileViewer.a */, + D05F80465E0B4CC8B5A37AF1 /* libRNCWebView.a */, ); name = "Recovered References"; sourceTree = ""; @@ -1696,6 +1701,7 @@ "$(SRCROOT)/../node_modules/react-native-gesture-handler/ios/**", "$(SRCROOT)/../node_modules/react-native-fs/**", "$(SRCROOT)/../node_modules/react-native-file-viewer/ios", + "$(SRCROOT)/../node_modules/react-native-webview/ios", ); INFOPLIST_FILE = StandardNotesTests/Info.plist; IPHONEOS_DEPLOYMENT_TARGET = 8.0; @@ -1703,12 +1709,6 @@ LIBRARY_SEARCH_PATHS = ( "$(inherited)", "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", ); OTHER_LDFLAGS = ( "-ObjC", @@ -1734,6 +1734,7 @@ "$(SRCROOT)/../node_modules/react-native-gesture-handler/ios/**", "$(SRCROOT)/../node_modules/react-native-fs/**", "$(SRCROOT)/../node_modules/react-native-file-viewer/ios", + "$(SRCROOT)/../node_modules/react-native-webview/ios", ); INFOPLIST_FILE = StandardNotesTests/Info.plist; IPHONEOS_DEPLOYMENT_TARGET = 8.0; @@ -1741,12 +1742,6 @@ LIBRARY_SEARCH_PATHS = ( "$(inherited)", "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", ); OTHER_LDFLAGS = ( "-ObjC", @@ -1776,6 +1771,7 @@ "$(SRCROOT)/../node_modules/react-native-gesture-handler/ios/**", "$(SRCROOT)/../node_modules/react-native-fs/**", "$(SRCROOT)/../node_modules/react-native-file-viewer/ios", + "$(SRCROOT)/../node_modules/react-native-webview/ios", ); INFOPLIST_FILE = StandardNotes/Info.plist; IPHONEOS_DEPLOYMENT_TARGET = 8.0; @@ -1811,6 +1807,7 @@ "$(SRCROOT)/../node_modules/react-native-gesture-handler/ios/**", "$(SRCROOT)/../node_modules/react-native-fs/**", "$(SRCROOT)/../node_modules/react-native-file-viewer/ios", + "$(SRCROOT)/../node_modules/react-native-webview/ios", ); INFOPLIST_FILE = StandardNotes/Info.plist; IPHONEOS_DEPLOYMENT_TARGET = 8.0; @@ -1849,18 +1846,13 @@ "$(SRCROOT)/../node_modules/react-native-gesture-handler/ios/**", "$(SRCROOT)/../node_modules/react-native-fs/**", "$(SRCROOT)/../node_modules/react-native-file-viewer/ios", + "$(SRCROOT)/../node_modules/react-native-webview/ios", ); INFOPLIST_FILE = "StandardNotes-tvOS/Info.plist"; LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks"; LIBRARY_SEARCH_PATHS = ( "$(inherited)", "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", ); OTHER_LDFLAGS = ( "-ObjC", @@ -1895,18 +1887,13 @@ "$(SRCROOT)/../node_modules/react-native-gesture-handler/ios/**", "$(SRCROOT)/../node_modules/react-native-fs/**", "$(SRCROOT)/../node_modules/react-native-file-viewer/ios", + "$(SRCROOT)/../node_modules/react-native-webview/ios", ); INFOPLIST_FILE = "StandardNotes-tvOS/Info.plist"; LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks"; LIBRARY_SEARCH_PATHS = ( "$(inherited)", "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", ); OTHER_LDFLAGS = ( "-ObjC", @@ -1936,12 +1923,6 @@ LIBRARY_SEARCH_PATHS = ( "$(inherited)", "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", ); PRODUCT_BUNDLE_IDENTIFIER = "com.facebook.REACT.StandardNotes-tvOSTests"; PRODUCT_NAME = "$(TARGET_NAME)"; @@ -1967,12 +1948,6 @@ LIBRARY_SEARCH_PATHS = ( "$(inherited)", "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", - "\"$(SRCROOT)/$(TARGET_NAME)\"", ); PRODUCT_BUNDLE_IDENTIFIER = "com.facebook.REACT.StandardNotes-tvOSTests"; PRODUCT_NAME = "$(TARGET_NAME)"; diff --git a/package-lock.json b/package-lock.json index e0a8bad6..0d9ede9b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10634,6 +10634,15 @@ } } }, + "react-native-webview": { + "version": "5.8.1", + "resolved": "https://registry.npmjs.org/react-native-webview/-/react-native-webview-5.8.1.tgz", + "integrity": "sha512-b6pSvmjoiWtcz6YspggW02X+BRXJWuquHwkh37BRx1NMW1iwMZA31SnFQvTpPzWYYIb9WF/mRsy2nGtt9C6NIg==", + "requires": { + "escape-string-regexp": "1.0.5", + "invariant": "2.2.4" + } + }, "react-navigation": { "version": "3.0.9", "resolved": "https://registry.npmjs.org/react-navigation/-/react-navigation-3.0.9.tgz", diff --git a/package.json b/package.json index c4d311fa..21c3956d 100644 --- a/package.json +++ b/package.json @@ -25,6 +25,7 @@ "react-native-keychain": "^1.2.1", "react-native-store-review": "^0.1.3", "react-native-vector-icons": "6.1.0", + "react-native-webview": "5.8.1", "react-navigation": "^3.0.9", "react-navigation-header-buttons": "^2.1.1", "regenerator": "^0.13.3", diff --git a/src/screens/Webview.js b/src/screens/Webview.js index 94f9800a..a79f5feb 100644 --- a/src/screens/Webview.js +++ b/src/screens/Webview.js @@ -1,5 +1,6 @@ import React, { Component } from 'react'; -import { Alert, View, WebView, Linking, Platform, Text } from 'react-native'; +import { Alert, View, Linking, Platform, Text } from 'react-native'; +import { WebView } from 'react-native-webview'; import ComponentManager from '@Lib/componentManager' import ModelManager from '@Lib/sfjs/modelManager' @@ -27,7 +28,7 @@ export default class Webview extends Component { this.keyboardListener = ApplicationState.get().addEventHandler((event, data) => { if(event == ApplicationState.KeyboardChangeEvent) { - this.webView.injectJavaScript(`window.scrollTo(0,0); document.body.scrollTop = 0`); + // this.webView.injectJavaScript(`window.scrollTo(0,0); document.body.scrollTop = 0`); } }); @@ -99,6 +100,7 @@ export default class Webview extends Component { if(this.registrationTimeout) { clearTimeout(this.registrationTimeout); } + this.registrationTimeout = setTimeout(() => { ComponentManager.get().registerComponentWindow(this.editor, this.webView); }, 1); @@ -155,7 +157,15 @@ export default class Webview extends Component { contentInset={{top: 0, left: 0, bottom: 0, right: 0}} scalesPageToFit={true /* Android only, not available with WKWebView */} injectedJavaScript = { - `window.isNative = "true"` + `(function() { + window.isNative = "true"; + + window.parent.postMessage = function(data) { + window.parent.ReactNativeWebView.postMessage(data); + }; + + return true; + })()` } />