Permalink
Browse files

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
  • Loading branch information...
RSNara authored and kelset committed Aug 16, 2018
1 parent e90d9ca commit 9b3a6ec84b2956ae3e567adb54f4da429421f415
@@ -0,0 +1,22 @@
/**
* Copyright (c) 2015-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @format
* @flow
* @providesModule WKWebView
*/
const React = require('React');
const View = require('View');
const Text = require('Text');
module.exports = () => {
return (
<View>
<Text>Android version not implemented.</Text>
</View>
);
};
@@ -0,0 +1,14 @@
/**
* Copyright (c) 2015-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @format
* @flow
* @providesModule WKWebView
*/
const requireNativeComponent = require('requireNativeComponent');
module.exports = requireNativeComponent('RCTWKWebView');
View
@@ -0,0 +1,22 @@
/**
* Copyright (c) 2015-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*/
#import <React/RCTView.h>
@class RCTWKWebView;
@protocol RCTWKWebViewDelegate <NSObject>
@end
@interface RCTWKWebView : RCTView
@property (nonatomic, weak) id<RCTWKWebViewDelegate> delegate;
@property (nonatomic, copy) NSDictionary *source;
@end
View
@@ -0,0 +1,72 @@
#import "RCTWKWebView.h"
#import <WebKit/WebKit.h>
#import <React/RCTConvert.h>
#import "RCTAutoInsetsProtocol.h"
@interface RCTWKWebView () <WKUIDelegate>
@end
@implementation RCTWKWebView
{
WKWebView *_webView;
}
- (void)dealloc
{
}
- (instancetype)initWithFrame:(CGRect)frame
{
if ((self = [super initWithFrame:frame])) {
super.backgroundColor = [UIColor clearColor];
_webView = [[WKWebView alloc] initWithFrame:self.bounds];
_webView.UIDelegate = self;
[self addSubview:_webView];
}
return self;
}
- (void)setSource:(NSDictionary *)source
{
if (![_source isEqualToDictionary:source]) {
_source = [source copy];
// Check for a static html source first
NSString *html = [RCTConvert NSString:source[@"html"]];
if (html) {
NSURL *baseURL = [RCTConvert NSURL:source[@"baseUrl"]];
if (!baseURL) {
baseURL = [NSURL URLWithString:@"about:blank"];
}
[_webView loadHTMLString:html baseURL:baseURL];
return;
}
NSURLRequest *request = [RCTConvert NSURLRequest:source];
// Because of the way React works, as pages redirect, we actually end up
// passing the redirect urls back here, so we ignore them if trying to load
// the same url. We'll expose a call to 'reload' to allow a user to load
// the existing page.
if ([request.URL isEqual:_webView.URL]) {
return;
}
if (!request.URL) {
// Clear the webview
[_webView loadHTMLString:@"" baseURL:nil];
return;
}
[_webView loadRequest:request];
}
}
- (void)layoutSubviews
{
[super layoutSubviews];
_webView.frame = self.bounds;
}
@end
@@ -0,0 +1,18 @@
#import "RCTViewManager.h"
#import "RCTWKWebView.h"
@interface RCTWKWebViewManager : RCTViewManager
@end
@implementation RCTWKWebViewManager
RCT_EXPORT_MODULE()
- (UIView *)view
{
return [RCTWKWebView new];
}
RCT_EXPORT_VIEW_PROPERTY(source, NSDictionary)
@end

0 comments on commit 9b3a6ec

Please sign in to comment.