Added mediaPlaybackRequiresUserAction to WebView

Summary:Just added a pass through to the `WebView` for `mediaPlaybackRequiresUserAction` and `setMediaPlaybackRequiresUserGesture` to allow auto-playing audio and video elements Closes facebook#5956 Differential Revision: D3053554 Pulled By: mkonicek fb-gh-sync-id: a1f362c1551de1a0218f5d23c70668e4c8078993 shipit-source-id: a1f362c1551de1a0218f5d23c70668e4c8078993
meituan · Mar 16, 2016 · 0be6031 · 0be6031
1 parent 26d9417
commit 0be6031
Show file tree

Hide file tree

Showing 4 changed files with 22 additions and 0 deletions.
diff --git a/Libraries/Components/WebView/WebView.android.js b/Libraries/Components/WebView/WebView.android.js
@@ -137,6 +137,12 @@ var WebView = React.createClass({
      * Used to locate this view in end-to-end tests.
      */
     testID: PropTypes.string,
+
+    /**
+     * Determines whether HTML5 audio & videos require the user to tap before they can
+     * start playing. The default value is `false`.
+     */
+    mediaPlaybackRequiresUserAction: PropTypes.bool,
   },
 
   getInitialState: function() {
@@ -212,6 +218,7 @@ var WebView = React.createClass({
         onLoadingFinish={this.onLoadingFinish}
         onLoadingError={this.onLoadingError}
         testID={this.props.testID}
+        mediaPlaybackRequiresUserAction={this.props.mediaPlaybackRequiresUserAction}
       />;
 
     return (

diff --git a/Libraries/Components/WebView/WebView.ios.js b/Libraries/Components/WebView/WebView.ios.js
@@ -233,6 +233,12 @@ var WebView = React.createClass({
      * @platform ios
      */
     allowsInlineMediaPlayback: PropTypes.bool,
+
+    /**
+     * Determines whether HTML5 audio & videos require the user to tap before they can
+     * start playing. The default value is `false`.
+     */
+    mediaPlaybackRequiresUserAction: PropTypes.bool,
   },
 
   getInitialState: function() {
@@ -311,6 +317,7 @@ var WebView = React.createClass({
         onShouldStartLoadWithRequest={onShouldStartLoadWithRequest}
         scalesPageToFit={this.props.scalesPageToFit}
         allowsInlineMediaPlayback={this.props.allowsInlineMediaPlayback}
+        mediaPlaybackRequiresUserAction={this.props.mediaPlaybackRequiresUserAction}
       />;
 
     return (

diff --git a/React/Views/RCTWebViewManager.m b/React/Views/RCTWebViewManager.m
@@ -46,6 +46,8 @@ - (UIView *)view
 RCT_EXPORT_VIEW_PROPERTY(onLoadingError, RCTDirectEventBlock)
 RCT_EXPORT_VIEW_PROPERTY(onShouldStartLoadWithRequest, RCTDirectEventBlock)
 RCT_REMAP_VIEW_PROPERTY(allowsInlineMediaPlayback, _webView.allowsInlineMediaPlayback, BOOL)
+RCT_REMAP_VIEW_PROPERTY(mediaPlaybackRequiresUserAction, _webView.mediaPlaybackRequiresUserAction, BOOL)
+
 
 RCT_EXPORT_METHOD(goBack:(nonnull NSNumber *)reactTag)
 {

diff --git a/ReactAndroid/src/main/java/com/facebook/react/views/webview/ReactWebViewManager.java b/ReactAndroid/src/main/java/com/facebook/react/views/webview/ReactWebViewManager.java
@@ -267,6 +267,7 @@ public void setScalesPageToFit(WebView view, boolean enabled) {
   public void setDomStorageEnabled(WebView view, boolean enabled) {
     view.getSettings().setDomStorageEnabled(enabled);
   }
+
 
   @ReactProp(name = "userAgent")
   public void setUserAgent(WebView view, @Nullable String userAgent) {
@@ -276,6 +277,11 @@ public void setUserAgent(WebView view, @Nullable String userAgent) {
     }
   }
 
+  @ReactProp(name = "mediaPlaybackRequiresUserAction")
+  public void setMediaPlaybackRequiresUserAction(WebView view, boolean requires) {
+    view.getSettings().setMediaPlaybackRequiresUserGesture(requires);
+  }
+
   @ReactProp(name = "injectedJavaScript")
   public void setInjectedJavaScript(WebView view, @Nullable String injectedJavaScript) {
     ((ReactWebView) view).setInjectedJavaScript(injectedJavaScript);