Adds `opaque` and `underlayColor` to WebView.

Summary:
Enables overwriting of underlying colors for WebViews. Especially useful if you want to give your WebView a transparent background.
Closes https://github.com/facebook/react-native/pull/767
Github Author: Lochlan Wansbrough <lochie@live.com>

Test Plan: Imported from GitHub, without a `Test Plan:` line.

Libraries/Components/WebView/WebView.ios.js

@@ -87,6 +87,8 @@ var WebView = React.createClass({
     html: PropTypes.string,
     renderError: PropTypes.func, // view to show if there's an error
     renderLoading: PropTypes.func, // loading indicator to show
+    bounces: PropTypes.bool,
+    scrollEnabled: PropTypes.bool,
     automaticallyAdjustContentInsets: PropTypes.bool,
     shouldInjectAJAXHandler: PropTypes.bool,
     contentInset: EdgeInsetsPropType,
@@ -131,7 +133,7 @@ var WebView = React.createClass({
       );
     }
 
-    var webViewStyles = [styles.container, this.props.style];
+    var webViewStyles = [styles.container, styles.webView, this.props.style];
     if (this.state.viewState === WebViewState.LOADING ||
       this.state.viewState === WebViewState.ERROR) {
       // if we're in either LOADING or ERROR states, don't show the webView
@@ -145,6 +147,8 @@ var WebView = React.createClass({
         style={webViewStyles}
         url={this.props.url}
         html={this.props.html}
+        bounces={this.props.bounces}
+        scrollEnabled={this.props.scrollEnabled}
         shouldInjectAJAXHandler={this.props.shouldInjectAJAXHandler}
         contentInset={this.props.contentInset}
         automaticallyAdjustContentInsets={this.props.automaticallyAdjustContentInsets}
@@ -213,6 +217,8 @@ var RCTWebView = createReactIOSNativeComponentClass({
   validAttributes: merge(ReactIOSViewAttributes.UIView, {
     url: true,
     html: true,
+    bounces: true,
+    scrollEnabled: true,
     contentInset: {diff: insetsDiffer},
     automaticallyAdjustContentInsets: true,
     shouldInjectAJAXHandler: true
@@ -250,6 +256,9 @@ var styles = StyleSheet.create({
     justifyContent: 'center',
     alignItems: 'center',
   },
+  webView: {
+    backgroundColor: '#ffffff',
+  }
 });
 
 module.exports = WebView;

Libraries/RCTWebSocketDebugger/SRWebSocket.m

@@ -1702,7 +1702,7 @@ static inline int32_t validate_dispatch_data_partial_string(NSData *data) {
     for (int i = 0; i < maxCodepointSize; i++) {
         NSString *str = [[NSString alloc] initWithBytesNoCopy:(char *)data.bytes length:data.length - i encoding:NSUTF8StringEncoding freeWhenDone:NO];
         if (str) {
-            return data.length - i;
+            return (int32_t)(data.length - i);
         }
     }
     

React/Views/RCTWebView.m

@@ -31,6 +31,7 @@
 - (instancetype)initWithEventDispatcher:(RCTEventDispatcher *)eventDispatcher
 {
   if ((self = [super initWithFrame:CGRectZero])) {
+    super.backgroundColor = [UIColor clearColor];
     _automaticallyAdjustContentInsets = YES;
     _contentInset = UIEdgeInsetsZero;
     _eventDispatcher = eventDispatcher;
@@ -95,6 +96,18 @@
                       updateOffset:NO];
 }
 
+- (void)setBackgroundColor:(UIColor *)backgroundColor
+{
+  CGFloat alpha = CGColorGetAlpha(backgroundColor.CGColor);
+  self.opaque = _webView.opaque = (alpha == 1.0);
+  _webView.backgroundColor = backgroundColor;
+}
+
+- (UIColor *)backgroundColor
+{
+  return _webView.backgroundColor;
+}
+
 - (NSMutableDictionary *)baseEvent
 {
   NSURL *url = _webView.request.URL;

React/Views/RCTWebViewManager.m

@@ -25,6 +25,8 @@ RCT_EXPORT_MODULE()
 
 RCT_REMAP_VIEW_PROPERTY(url, URL, NSURL);
 RCT_REMAP_VIEW_PROPERTY(html, HTML, NSString);
+RCT_REMAP_VIEW_PROPERTY(bounces, _webView.scrollView.bounces, BOOL);
+RCT_REMAP_VIEW_PROPERTY(scrollEnabled, _webView.scrollView.scrollEnabled, BOOL);
 RCT_EXPORT_VIEW_PROPERTY(contentInset, UIEdgeInsets);
 RCT_EXPORT_VIEW_PROPERTY(automaticallyAdjustContentInsets, BOOL);
 RCT_EXPORT_VIEW_PROPERTY(shouldInjectAJAXHandler, BOOL);