status-im
/
react-native
mirror of https://github.com/status-im/react-native.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity
react-native/React/Views/RCTWKWebViewManager.m

40 lines
1.1 KiB
Mathematica
Raw Normal View History

Implement message passing! Summary: @public This diff implements message passing between the `WKWebView` and React Native. As with `<WebView/>`, we can only send/receive strings. **Usage:** 1. Set `messagingEnabled` to `true`. 1. To send data from the web view to React Native, call `postMessage(data)` within the web view. This forces React Native to execute the `onMessage` prop on the `WKWebView` component. `onMessage` will be called with an event `e`, where `e.nativeEvent.data` will be the data you passed into `postMessage`. 1. To send data from React Native to the web view, call `UIManager.dispatchViewManagerCommand` to dispatch the `UIManager.RCTWKWebView.Commands.postMessage` command. Look at [[ https://fburl.com/u1wusf2f | this part of the existing `<WebView/>` ]] component for more details. After you make the call, React Native will dispatch a `'message'` event to the `document` object within the webview. You can listen to the event by doing `document.addEventListener('message', callback)`. Let the event dispatched be `e`. Then, `e.data` is the data you sent over from React Native. [[ P58627181 | This Playground.js ]] illustrates the usage. Reviewed By: shergin Differential Revision: D6304850 fbshipit-source-id: 29075ef753296e9fb5a9cddeb1ad0f4ff7e28650
2018-08-16 20:33:58 +00:00
#import "RCTWKWebViewManager.h"
Implement WKWebView to replace WebView Summary: @public `UIWebView` has been deprecated and replaced by `WKWebView`. This diff introduces a new component `WKWebView` that simply renders a `WKWebView` on iOS. This is the first in the stack of many diffs that'll be required to fully replace `UIWebView` with `WKWebView` in the `<WebView/>` React Native component. Eventually, I hope to introduce a prop called `useWebKitImplementation`, which, when true, will force RN to use `WKWebView` instead of `UIWebView` for the `<WebView/>` component. The only thing that's been implemented so far is the `source` property. Reviewed By: mmmulani Differential Revision: D6266100 fbshipit-source-id: 65862e34bd98db7fff0349cf26888afee43a56e4
2018-08-16 20:33:53 +00:00
Implement message passing! Summary: @public This diff implements message passing between the `WKWebView` and React Native. As with `<WebView/>`, we can only send/receive strings. **Usage:** 1. Set `messagingEnabled` to `true`. 1. To send data from the web view to React Native, call `postMessage(data)` within the web view. This forces React Native to execute the `onMessage` prop on the `WKWebView` component. `onMessage` will be called with an event `e`, where `e.nativeEvent.data` will be the data you passed into `postMessage`. 1. To send data from React Native to the web view, call `UIManager.dispatchViewManagerCommand` to dispatch the `UIManager.RCTWKWebView.Commands.postMessage` command. Look at [[ https://fburl.com/u1wusf2f | this part of the existing `<WebView/>` ]] component for more details. After you make the call, React Native will dispatch a `'message'` event to the `document` object within the webview. You can listen to the event by doing `document.addEventListener('message', callback)`. Let the event dispatched be `e`. Then, `e.data` is the data you sent over from React Native. [[ P58627181 | This Playground.js ]] illustrates the usage. Reviewed By: shergin Differential Revision: D6304850 fbshipit-source-id: 29075ef753296e9fb5a9cddeb1ad0f4ff7e28650
2018-08-16 20:33:58 +00:00
#import "RCTUIManager.h"
#import "RCTWKWebView.h"
Implement WKWebView to replace WebView Summary: @public `UIWebView` has been deprecated and replaced by `WKWebView`. This diff introduces a new component `WKWebView` that simply renders a `WKWebView` on iOS. This is the first in the stack of many diffs that'll be required to fully replace `UIWebView` with `WKWebView` in the `<WebView/>` React Native component. Eventually, I hope to introduce a prop called `useWebKitImplementation`, which, when true, will force RN to use `WKWebView` instead of `UIWebView` for the `<WebView/>` component. The only thing that's been implemented so far is the `source` property. Reviewed By: mmmulani Differential Revision: D6266100 fbshipit-source-id: 65862e34bd98db7fff0349cf26888afee43a56e4
2018-08-16 20:33:53 +00:00
@implementation RCTWKWebViewManager
RCT_EXPORT_MODULE()
- (UIView *)view
{
return [RCTWKWebView new];
}
RCT_EXPORT_VIEW_PROPERTY(source, NSDictionary)
Implement onLoading(Start|Finish|Error) and injectedJavaScript props Summary: @public This diff includes four very straightforward changes: 1. Whenever the WebView starts loading, the `onLoadingStart` hook should be executed. The event passed into this hook should be decorated with the `navigationType`. 1. Whenever the WebView errors out while loading, the `onLoadingError` hook should be executed. 1. Whenever the WebView finishes loading (without any errors), the `onLoadingFinish` hook should be executed. 1. The serialized JavaScript passed into the `injectedJavaScript` prop should be executed when the WebView finishes loading. After execution finishes, the `onLoadingFinish` prop should be called with the serialized completion value of this JavaScript. Reviewed By: shergin Differential Revision: D6293532 fbshipit-source-id: 21407c766f73413046823ae605afc21e85cf9db6
2018-08-16 20:33:55 +00:00
RCT_EXPORT_VIEW_PROPERTY(onLoadingStart, RCTDirectEventBlock)
RCT_EXPORT_VIEW_PROPERTY(onLoadingFinish, RCTDirectEventBlock)
RCT_EXPORT_VIEW_PROPERTY(onLoadingError, RCTDirectEventBlock)
RCT_EXPORT_VIEW_PROPERTY(injectedJavaScript, NSString)
Implement WKWebView to replace WebView Summary: @public `UIWebView` has been deprecated and replaced by `WKWebView`. This diff introduces a new component `WKWebView` that simply renders a `WKWebView` on iOS. This is the first in the stack of many diffs that'll be required to fully replace `UIWebView` with `WKWebView` in the `<WebView/>` React Native component. Eventually, I hope to introduce a prop called `useWebKitImplementation`, which, when true, will force RN to use `WKWebView` instead of `UIWebView` for the `<WebView/>` component. The only thing that's been implemented so far is the `source` property. Reviewed By: mmmulani Differential Revision: D6266100 fbshipit-source-id: 65862e34bd98db7fff0349cf26888afee43a56e4
2018-08-16 20:33:53 +00:00
Implement message passing! Summary: @public This diff implements message passing between the `WKWebView` and React Native. As with `<WebView/>`, we can only send/receive strings. **Usage:** 1. Set `messagingEnabled` to `true`. 1. To send data from the web view to React Native, call `postMessage(data)` within the web view. This forces React Native to execute the `onMessage` prop on the `WKWebView` component. `onMessage` will be called with an event `e`, where `e.nativeEvent.data` will be the data you passed into `postMessage`. 1. To send data from React Native to the web view, call `UIManager.dispatchViewManagerCommand` to dispatch the `UIManager.RCTWKWebView.Commands.postMessage` command. Look at [[ https://fburl.com/u1wusf2f | this part of the existing `<WebView/>` ]] component for more details. After you make the call, React Native will dispatch a `'message'` event to the `document` object within the webview. You can listen to the event by doing `document.addEventListener('message', callback)`. Let the event dispatched be `e`. Then, `e.data` is the data you sent over from React Native. [[ P58627181 | This Playground.js ]] illustrates the usage. Reviewed By: shergin Differential Revision: D6304850 fbshipit-source-id: 29075ef753296e9fb5a9cddeb1ad0f4ff7e28650
2018-08-16 20:33:58 +00:00
/**
* Expose methods to enable messaging the webview.
*/
RCT_EXPORT_VIEW_PROPERTY(messagingEnabled, BOOL)
RCT_EXPORT_VIEW_PROPERTY(onMessage, RCTDirectEventBlock)
RCT_EXPORT_METHOD(postMessage:(nonnull NSNumber *)reactTag message:(NSString *)message)
{
[self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, RCTWKWebView *> *viewRegistry) {
RCTWKWebView *view = viewRegistry[reactTag];
if (![view isKindOfClass:[RCTWKWebView class]]) {
RCTLogError(@"Invalid view returned from registry, expecting RCTWebView, got: %@", view);
} else {
[view postMessage:message];
}
}];
}
Implement WKWebView to replace WebView Summary: @public `UIWebView` has been deprecated and replaced by `WKWebView`. This diff introduces a new component `WKWebView` that simply renders a `WKWebView` on iOS. This is the first in the stack of many diffs that'll be required to fully replace `UIWebView` with `WKWebView` in the `<WebView/>` React Native component. Eventually, I hope to introduce a prop called `useWebKitImplementation`, which, when true, will force RN to use `WKWebView` instead of `UIWebView` for the `<WebView/>` component. The only thing that's been implemented so far is the `source` property. Reviewed By: mmmulani Differential Revision: D6266100 fbshipit-source-id: 65862e34bd98db7fff0349cf26888afee43a56e4
2018-08-16 20:33:53 +00:00
@end