Skip to content
Closed
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
114 changes: 82 additions & 32 deletions Libraries/Components/WebView/WebView.ios.js
Original file line number Diff line number Diff line change
Expand Up @@ -82,7 +82,26 @@ var defaultRenderError = (errorDomain, errorCode, errorDesc) => (
);

/**
* Renders a native WebView.
* `WebView` renders web content in a native view.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

no-trailing-spaces: Trailing spaces not allowed.

*
*```
* import React, { Component } from 'react';
* import { WebView } from 'react-native';
*
* class MyWeb extends Component {
* render() {
* return (
* <WebView
* source={{uri: 'https://github.com/facebook/react-native'}}
* style={{marginTop: 20}}
* />
* );
* }
* }
*```
*
* You can use this component to navigate back and forth in the web view's
* history and configure various properties for the web content.
*/
var WebView = React.createClass({
statics: {
Expand All @@ -109,7 +128,7 @@ var WebView = React.createClass({
source: PropTypes.oneOfType([
PropTypes.shape({
/*
* The URI to load in the WebView. Can be a local or remote file.
* The URI to load in the web view. Can be a local or remote file.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just curious why split out "web view" instead of codifying WebView? Aren't all these talking about the specific instance of the WebView in question? Or is "web view" the more generic thing that is being discussed?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could be either/or. Sometimes it's a more generic thing being discussed. In this case not.

*/
uri: PropTypes.string,
/*
Expand Down Expand Up @@ -155,96 +174,124 @@ var WebView = React.createClass({
*/
renderLoading: PropTypes.func,
/**
* Invoked when load finish
* Function that is invoked when the web view has finished loading.
*/
onLoad: PropTypes.func,
/**
* Invoked when load either succeeds or fails
* Function that is invoked when the web view load succeeds or fails.
*/
onLoadEnd: PropTypes.func,
/**
* Invoked on load start
* Function that is invoked when the web view starts loading.
*/
onLoadStart: PropTypes.func,
/**
* Invoked when load fails
* Function that is invoked when the web view load fails.
*/
onError: PropTypes.func,
/**
* Boolean value that determines whether the web view bounces
* when it reaches the edge of the content. The default value is `true`.
* @platform ios
*/
bounces: PropTypes.bool,
/**
* A floating-point number that determines how quickly the scroll view
* decelerates after the user lifts their finger. You may also use string
* shortcuts `"normal"` and `"fast"` which match the underlying iOS settings
* for `UIScrollViewDecelerationRateNormal` and
* `UIScrollViewDecelerationRateFast` respectively.
* decelerates after the user lifts their finger. You may also use the

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think you still wanted to keep the @platform android, right?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good catch!

* string shortcuts `"normal"` and `"fast"` which match the underlying iOS
* settings for `UIScrollViewDecelerationRateNormal` and
* `UIScrollViewDecelerationRateFast` respectively:
*
* - normal: 0.998
* - fast: 0.99 (the default for iOS WebView)
* - fast: 0.99 (the default for iOS web view)
* @platform ios
*/
decelerationRate: ScrollView.propTypes.decelerationRate,
/**
* Boolean value that determines whether scrolling is enabled in the
* web view. The default value is `true`.
* @platform ios
*/
scrollEnabled: PropTypes.bool,
/**
* Controls whether to adjust the content inset for web views that are
* placed behind a navigation bar, tab bar, or toolbar. The default value
* is `true`.
*/
automaticallyAdjustContentInsets: PropTypes.bool,
/**
* The amount by which the web view content is inset from the edges of
* the scroll view. Defaults to {top: 0, left: 0, bottom: 0, right: 0}.
*/
contentInset: EdgeInsetsPropType,
/**
* Function that is invoked when the web view loading starts or ends.
*/
onNavigationStateChange: PropTypes.func,
startInLoadingState: PropTypes.bool, // force WebView to show loadingView on first load
/**
* Boolean value that forces the web view to show the loading view
* on the first load.
*/
startInLoadingState: PropTypes.bool,
/**
* The style to apply to the web view.
*/
style: View.propTypes.style,

/**
* Used on Android only, JS is enabled by default for WebView on iOS
* @platform android
* Boolean value to enable JavaScript in the web view. Used on Android only
* as JavaScript is enabled by default on iOS. The default value is `true`.
*/
javaScriptEnabled: PropTypes.bool,

/**
* Used on Android only, controls whether DOM Storage is enabled or not
* Boolean value to control whether DOM Storage is enabled. Used only in
* Android.
* @platform android
*/
domStorageEnabled: PropTypes.bool,

/**
* Sets the JS to be injected when the webpage loads.
* Set this to provide JavaScript that will be injected into the web page
* when the view loads.
*/
injectedJavaScript: PropTypes.string,

/**
* Sets the user-agent for this WebView. The user-agent can also be set in native using
* WebViewConfig. This prop will overwrite that config.
* Sets the user-agent for the web view.
* @platform android
*/
userAgent: PropTypes.string,

/**
* Sets whether the webpage scales to fit the view and the user can change the scale.
* Boolean that controls whether the web content is scaled to fit
* the view and enables the user to change the scale. The default value
* is `true`.
*/
scalesPageToFit: PropTypes.bool,

/**
* Allows custom handling of any webview requests by a JS handler. Return true
* or false from this method to continue loading the request.
* Function that allows custom handling of any web view requests. Return
* `true` from the function to continue loading the request and `false`
* to stop loading.
* @platform ios
*/
onShouldStartLoadWithRequest: PropTypes.func,

/**
* Determines whether HTML5 videos play inline or use the native full-screen
* controller.
* default value `false`
* **NOTE** : "In order for video to play inline, not only does this
* property need to be set to true, but the video element in the HTML
* document must also include the webkit-playsinline attribute."
* Boolean that determines whether HTML5 videos play inline or use the
* native full-screen controller. The default value is `false`.
*
* **NOTE** : In order for video to play inline, not only does this
* property need to be set to `true`, but the video element in the HTML
* document must also include the `webkit-playsinline` attribute.
* @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`.
* Boolean that determines whether HTML5 audio and video requires the user
* to tap them before they start playing. The default value is `false`.
*/
mediaPlaybackRequiresUserAction: PropTypes.bool,
},
Expand Down Expand Up @@ -337,7 +384,7 @@ var WebView = React.createClass({
},

/**
* Go forward one page in the webview's history.
* Go forward one page in the web view's history.
*/
goForward: function() {
UIManager.dispatchViewManagerCommand(
Expand All @@ -348,7 +395,7 @@ var WebView = React.createClass({
},

/**
* Go back one page in the webview's history.
* Go back one page in the web view's history.
*/
goBack: function() {
UIManager.dispatchViewManagerCommand(
Expand All @@ -370,6 +417,9 @@ var WebView = React.createClass({
);
},

/**
* Stop loading the current page.
*/
stopLoading: function() {
UIManager.dispatchViewManagerCommand(
this.getWebViewHandle(),
Expand All @@ -389,7 +439,7 @@ var WebView = React.createClass({
},

/**
* Returns the native webview node.
* Returns the native web view node.
*/
getWebViewHandle: function(): any {
return ReactNative.findNodeHandle(this.refs[RCT_WEBVIEW_REF]);
Expand Down