Thibault Malbranche 6 years ago
parent
commit
e624067a1c
4 changed files with 37 additions and 26 deletions
  1. 2
    11
      README.md
  2. 16
    7
      js/WebView.android.js
  3. 17
    6
      js/WebView.ios.js
  4. 2
    2
      package.json

+ 2
- 11
README.md View File

@@ -11,7 +11,6 @@ _Garrett McCullough, mobile engineer at Virta Health_
11 11
 
12 12
 - [x] iOS (both UIWebView and WKWebView)
13 13
 - [x] Android
14
-- [ ] Windows 10 (coming soon)
15 14
 
16 15
 _Note: React Native WebView is not currently supported by Expo unless you "eject"._
17 16
 
@@ -44,7 +43,6 @@ class MyWebComponent extends Component {
44 43
       <WebView
45 44
         source={{ uri: "https://infinite.red/react-native" }}
46 45
         style={{ marginTop: 20 }}
47
-        onLoadProgress={e => console.log(e.nativeEvent.progress)}
48 46
       />
49 47
     );
50 48
   }
@@ -61,16 +59,9 @@ Simply install React Native WebView and then use it in place of the core WebView
61 59
 
62 60
 - If you're getting `Invariant Violation: Native component for "RNCWKWebView does not exist"` it likely means you forgot to run `react-native link` or there was some error with the linking process
63 61
 
64
-### Contributor Notes
62
+## Contributing
65 63
 
66
-- I've removed all PropTypes for now. Instead, we'll be using Flow types. TypeScript types will be added at a later date.
67
-- UIWebView is not tested fully and you will encounter some yellow warning boxes. Since it is deprecated, we don't intend to put a lot of time into supporting it, but feel free to submit PRs if you have a special use case. Note that you will need to specify `useWebKit={false}` to use UIWebView
68
-- After pulling this repo and installing all dependencies, you can run flow on iOS and Android-specific files using the commands:
69
-  - `yarn test:ios:flow` for iOS
70
-  - `yarn test:android:flow` for Android
71
-- If you want to add another React Native platform to this repository, you will need to create another `.flowconfig` for it. If your platform is `example`, copy the main flowconfig and rename it to `.flowconfig.example`. Then edit the config to ignore other platforms, and add `.*/*[.]example.js` to the ignore lists of the other platforms. Then add an entry to `package.json` like this:
72
-  - `"test:example:flow": "flow check --flowconfig-name .flowconfig.example"`
73
-- Currently you need to install React Native 0.57 to be able to test these types - `flow check` will not pass against 0.56.
64
+See [Contributing.md](https://github.com/react-native-community/react-native-webview/blob/master/docs/Contributing.md)
74 65
 
75 66
 ## Maintainers
76 67
 

+ 16
- 7
js/WebView.android.js View File

@@ -194,10 +194,19 @@ class WebView extends React.Component<WebViewSharedProps, State> {
194 194
     );
195 195
   }
196 196
 
197
+  getViewManagerConfig = (viewManagerName: string) => {
198
+    if (!UIManager.getViewManagerConfig) {
199
+      return UIManager[viewManagerName];
200
+    }
201
+    return UIManager.getViewManagerConfig(viewManagerName);
202
+  };
203
+
204
+  getCommands = () => this.getViewManagerConfig('RNCWebView').Commands;
205
+
197 206
   goForward = () => {
198 207
     UIManager.dispatchViewManagerCommand(
199 208
       this.getWebViewHandle(),
200
-      UIManager.RNCWebView.Commands.goForward,
209
+      this.getCommands().goForward,
201 210
       null,
202 211
     );
203 212
   };
@@ -205,7 +214,7 @@ class WebView extends React.Component<WebViewSharedProps, State> {
205 214
   goBack = () => {
206 215
     UIManager.dispatchViewManagerCommand(
207 216
       this.getWebViewHandle(),
208
-      UIManager.RNCWebView.Commands.goBack,
217
+      this.getCommands().goBack,
209 218
       null,
210 219
     );
211 220
   };
@@ -216,7 +225,7 @@ class WebView extends React.Component<WebViewSharedProps, State> {
216 225
     });
217 226
     UIManager.dispatchViewManagerCommand(
218 227
       this.getWebViewHandle(),
219
-      UIManager.RNCWebView.Commands.reload,
228
+      this.getCommands().reload,
220 229
       null,
221 230
     );
222 231
   };
@@ -224,7 +233,7 @@ class WebView extends React.Component<WebViewSharedProps, State> {
224 233
   stopLoading = () => {
225 234
     UIManager.dispatchViewManagerCommand(
226 235
       this.getWebViewHandle(),
227
-      UIManager.RNCWebView.Commands.stopLoading,
236
+      this.getCommands().stopLoading,
228 237
       null,
229 238
     );
230 239
   };
@@ -232,7 +241,7 @@ class WebView extends React.Component<WebViewSharedProps, State> {
232 241
   postMessage = (data: string) => {
233 242
     UIManager.dispatchViewManagerCommand(
234 243
       this.getWebViewHandle(),
235
-      UIManager.RNCWebView.Commands.postMessage,
244
+      this.getCommands().postMessage,
236 245
       [String(data)],
237 246
     );
238 247
   };
@@ -246,7 +255,7 @@ class WebView extends React.Component<WebViewSharedProps, State> {
246 255
   injectJavaScript = (data: string) => {
247 256
     UIManager.dispatchViewManagerCommand(
248 257
       this.getWebViewHandle(),
249
-      UIManager.RNCWebView.Commands.injectJavaScript,
258
+      this.getCommands().injectJavaScript,
250 259
       [data],
251 260
     );
252 261
   };
@@ -311,7 +320,7 @@ class WebView extends React.Component<WebViewSharedProps, State> {
311 320
     if (shouldStart) {
312 321
       UIManager.dispatchViewManagerCommand(
313 322
         this.getWebViewHandle(),
314
-        UIManager.RNCWebView.Commands.loadUrl,
323
+        this.getCommands().loadUrl,
315 324
         [String(url)],
316 325
       );
317 326
     }

+ 17
- 6
js/WebView.ios.js View File

@@ -41,7 +41,7 @@ import type {
41 41
 } from './WebViewTypes';
42 42
 
43 43
 const resolveAssetSource = Image.resolveAssetSource;
44
-
44
+let didWarnAboutUIWebViewUsage = false;
45 45
 // Imported from https://github.com/facebook/react-native/blob/master/Libraries/Components/ScrollView/processDecelerationRate.js
46 46
 function processDecelerationRate(decelerationRate) {
47 47
   if (decelerationRate === 'normal') {
@@ -153,6 +153,13 @@ class WebView extends React.Component<WebViewSharedProps, State> {
153 153
   webViewRef = React.createRef();
154 154
 
155 155
   UNSAFE_componentWillMount() {
156
+    if (!this.props.useWebKit && !didWarnAboutUIWebViewUsage) {
157
+      didWarnAboutUIWebViewUsage = true;
158
+      console.warn(
159
+        'UIWebView is deprecated and will be removed soon, please use WKWebView (do not override useWebkit={true} prop),' +
160
+          ' more infos here: https://github.com/react-native-community/react-native-webview/issues/312',
161
+      );
162
+    }
156 163
     if (
157 164
       this.props.useWebKit === true &&
158 165
       this.props.scalesPageToFit !== undefined
@@ -289,13 +296,17 @@ class WebView extends React.Component<WebViewSharedProps, State> {
289 296
     );
290 297
   }
291 298
 
292
-  _getCommands() {
293
-    if (!this.props.useWebKit) {
294
-      return UIManager.RNCUIWebView.Commands;
299
+  _getViewManagerConfig = (viewManagerName: string) => {
300
+    if (!UIManager.getViewManagerConfig) {
301
+      return UIManager[viewManagerName];
295 302
     }
303
+    return UIManager.getViewManagerConfig(viewManagerName);
304
+  };
296 305
 
297
-    return UIManager.RNCWKWebView.Commands;
298
-  }
306
+  _getCommands = () =>
307
+    !this.props.useWebKit
308
+      ? this._getViewManagerConfig('RNCUIWebView').Commands
309
+      : this._getViewManagerConfig('RNCWKWebView').Commands;
299 310
 
300 311
   /**
301 312
    * Go forward one page in the web view's history.

+ 2
- 2
package.json View File

@@ -8,7 +8,7 @@
8 8
     "Thibault Malbranche <malbranche.thibault@gmail.com>"
9 9
   ],
10 10
   "license": "MIT",
11
-  "version": "5.0.2",
11
+  "version": "5.0.5",
12 12
   "homepage": "https://github.com/react-native-community/react-native-webview#readme",
13 13
   "scripts": {
14 14
     "test:js": "jest",
@@ -37,7 +37,7 @@
37 37
     "flow-bin": "^0.80.0",
38 38
     "jest": "^24.0.0",
39 39
     "metro-react-native-babel-preset": "^0.51.1",
40
-    "react-native": "^0.57",
40
+    "react-native": ">=0.57 <0.59",
41 41
     "semantic-release": "15.10.3"
42 42
   },
43 43
   "repository": {