{"id":18782883,"url":"https://github.com/rescript-react-native/webview","last_synced_at":"2025-04-13T12:08:46.022Z","repository":{"id":40708388,"uuid":"206154615","full_name":"rescript-react-native/webview","owner":"rescript-react-native","description":"ReScript bindings for react-native-webview","archived":false,"fork":false,"pushed_at":"2023-03-05T16:19:44.000Z","size":185,"stargazers_count":8,"open_issues_count":3,"forks_count":4,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-04-13T12:08:38.063Z","etag":null,"topics":["react","react-native","rescript","rescript-react","rescript-react-native","webview"],"latest_commit_sha":null,"homepage":"","language":"ReScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/rescript-react-native.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2019-09-03T19:17:33.000Z","updated_at":"2024-08-02T02:21:59.000Z","dependencies_parsed_at":"2023-01-19T20:55:04.956Z","dependency_job_id":"ee541a98-4309-4c6d-89fa-2817a00f7b87","html_url":"https://github.com/rescript-react-native/webview","commit_stats":{"total_commits":39,"total_committers":3,"mean_commits":13.0,"dds":"0.33333333333333337","last_synced_commit":"e41d3eed00b3f694996c8e3095d7029f695894d8"},"previous_names":["reason-react-native/webview"],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rescript-react-native%2Fwebview","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rescript-react-native%2Fwebview/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rescript-react-native%2Fwebview/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rescript-react-native%2Fwebview/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/rescript-react-native","download_url":"https://codeload.github.com/rescript-react-native/webview/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248710430,"owners_count":21149190,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["react","react-native","rescript","rescript-react","rescript-react-native","webview"],"created_at":"2024-11-07T20:37:22.677Z","updated_at":"2025-04-13T12:08:46.000Z","avatar_url":"https://github.com/rescript-react-native.png","language":"ReScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# `@rescript-react-native/webview`\n\n[![Build Status](https://github.com/rescript-react-native/webview/workflows/Build/badge.svg)](https://github.com/rescript-react-native/webview/actions)\n[![Version](https://img.shields.io/npm/v/@rescript-react-native/webview.svg)](https://www.npmjs.com/@rescript-react-native/webview)\n[![ReScript Forum](https://img.shields.io/discourse/posts?color=e6484f\u0026label=ReScript%20Forum\u0026server=https%3A%2F%2Fforum.rescript-lang.org)](https://forum.rescript-lang.org/)\n\n[ReScript](https://rescript-lang.org) bindings for\n[`react-native-webview`](https://github.com/react-native-webview/react-native-webview).\n\nExposed as the `ReactNativeWebView` module.\n\n`@rescript-react-native/webview` X.y.\\* means it's compatible with\n`@react-native-community/react-native-webview` X.y.\\*\n\n## Installation\n\nWhen\n[`react-native-webview`](https://github.com/react-native-webview/react-native-webview)\nis properly installed \u0026 configured by following their installation instructions,\nyou can install the bindings:\n\n```console\nnpm install @rescript-react-native/webview\n# or\nyarn add @rescript-react-native/webview\n```\n\n`@rescript-react-native/webview` should be added to `bs-dependencies` in your\n`bsconfig.json`. For example,\n\n```diff\n{\n  //...\n  \"bs-dependencies\": [\n    \"@rescript/react\",\n    \"rescript-react-native\",\n    // ...\n+    \"@rescript-react-native/webview\"\n  ],\n  //...\n}\n```\n\n## Usage\n\n### Types\n\n#### `DataDetectorTypes.t`\n\nValid values are:\n\n• `DataDetectorTypes.phoneNumber`\n• `DataDetectorTypes.link`\n• `DataDetectorTypes.address`\n• `DataDetectorTypes.calendarEvent`\n• `DataDetectorTypes.none`\n• `DataDetectorTypes.all`\n• `DataDetectorTypes.trackingNumber`\n• `DataDetectorTypes.flightNumber`\n• `DataDetectorTypes.lookupSuggestion`\n\n#### `DecelerationRate.t`\n\nValues may be created using `DecelerationRate.value`\n\n```rescript\nvalue: float =\u003e t\n```\n\nOther valid values are `DecelerationRate.normal` and `DecelerationRate.fast` which are equivalent to specifying `0.998` and `0.99` and match the underlying iOS settings for `UIScrollViewDecelerationRateNormal` and `UIScrollViewDecelerationRateFast` respectively.\n\n#### `NavigationType.t`\n\nValid values are:\n\n• `NavigationType.click`\n• `NavigationType.formsubmit`\n• `NavigationType.backforward`\n• `NavigationType.reload`\n• `NavigationType.formresubmit`\n• `NavigationType.other`\n\n#### `Source.t`\n\nSource to be loaded in the `WebView`, as specified by the [`source`(#source-source.t) prop can be either a URI or static HTML.\n\n##### `Source.uri`\n\nCreates a URI source\n\n```rescript\nuri:\n    (\n      ~uri: string=?,\n      ~method: [\n                 | `CONNECT\n                 | `DELETE\n                 | `GET\n                 | `HEAD\n                 | `OPTIONS\n                 | `PATCH\n                 | `POST\n                 | `PUT\n                 | `TRACE\n               ]\n                 =?,\n      ~headers: Js.t('a)=?,\n      ~body: string=?,\n      unit\n    ) =\u003e\n    t\n```\n\n- `uri` specifies the URI (local or remote) to load in the WebView.\n- `method` specifies HTTP Method to use, defaults to `` `GET ``. Only `` `GET `` and `` `POST `` are supported on Android.\n- `headers` specifies additional HTTP headers to send with the request. This can only be used with `` `GET `` requests on Android.\n- `body` specifies HTTP body to send with the request. This must be a valid UTF-8 string, and will be sent exactly as specified, with no additional encoding (e.g. URL-escaping or base64) applied. This can only be used with `` `POST `` requests on Android.\n\n##### `Source.html`\n\nCreates a static HTML source\n\n```rescript\nhtml: (~html: string=?, ~baseUrl: string=?, unit) =\u003e t\n```\n\n- `html` specifies static HTML to display in the WebView as `string`.\n- `baseUrl` specifies the base URL to be used for any relative links in the HTML. It is also used for the origin header with CORS requests made from the WebView. Refer to [Android WebView Docs](https://developer.android.com/reference/android/webkit/WebView#loadDataWithBaseURL).\n\n#### `UnionCallback.t`\n\nType of function passed to the [`onLoadEnd`](#onloadend-unioncallbackt) prop, to handle the union type [`webViewNavigationOrError`](#webviewnavigationorerror). Defined as\n\n```rescript\nReactNative.Event.syntheticEvent(Js.t(webViewNavigationOrError)) =\u003e unit\n```\n\n##### `UnionCallback.make`\n\nCreates a function of type `UnionCallback.t`\n\n```rescript\nmake:\n  (\n    ~navigationCallback: WebViewNavigationEvent.t =\u003e unit,\n    ~errorCallback: WebViewErrorEvent.t =\u003e unit\n  ) =\u003e\n  t;\n```\n\n##### `UnionCallback.uncurriedMake`\n\nCreates a function of type `UnionCallback.t`\n\n```rescript\nuncurriedMake:\n  (\n    ~navigationCallback:(. webViewNavigationEvent) =\u003e unit,\n    ~errorCallback:(. webViewErrorEvent) =\u003e unit\n  ) =\u003e\n  t;\n```\n\n#### `element`\n\nRepresents a `WebView` instance, to be used with [methods](#methods).\n\n#### `nativeConfig`\n\nShould be constructed as below:\n\n```rescript\nnativeConfig:\n  (\n    ~component: React.component('a)=?,\n    ~props: Js.t('b)=?,\n    ~viewManager: Js.t('c)=?\n  ) =\u003e\n  nativeConfig\n```\n\nYou may refer to [iOS↗](https://github.com/react-native-webview/react-native-webview/blob/master/docs/Custom-iOS.md) and [Android↗](https://github.com/react-native-webview/react-native-webview/blob/master/docs/Custom-Android.md) specific guides on how to create a custom `WebView`.\n\n#### `ref`\n\nReact `ref` intended to access a `WebView` instance. Defined as\n\n```rescript\ntype ref = React.Ref.t(Js.nullable(element))\n```\n\n#### `Js.t(webViewNativeEvent)`\n\nHas the below keys, which can be accessed with `##`.\n\n- `target: ReactNative.NativeTypes.nodeHandle`\n- `url: string`\n- `title: string`\n- `loading: bool`\n- `canGoBack: bool`\n- `canGoForward: bool`\n\n#### `Js.t(webViewError)`\n\nHas the below keys, which can be accessed with `##`.\n\n- `target: ReactNative.NativeTypes.nodeHandle`\n- `url: string`\n- `title: string`\n- `loading: bool`\n- `canGoBack: bool`\n- `canGoForward: bool`\n- `description: string`\n- `domain: option(string)`\n- `code: int`\n- `didFailProvisionalNavigation: option(bool)`\n\nNote: `domain` key only exists on iOS\n\n#### `Js.t(webViewHttpError)`\n\nHas the below keys, which can be accessed with `##`.\n\n- `target: ReactNative.NativeTypes.nodeHandle`\n- `url: string`\n- `title: string`\n- `loading: bool`\n- `canGoBack: bool`\n- `canGoForward: bool`\n- `description: string`\n- `statusCode: int`\n\nNote: `description` key only exists on iOS\n\n#### `Js.t(webViewMessage)`\n\nHas the below keys, which can be accessed with `##`.\n\n- `target: ReactNative.NativeTypes.nodeHandle`\n- `url: string`\n- `title: string`\n- `loading: bool`\n- `canGoBack: bool`\n- `canGoForward: bool`\n- `data: string`\n\n#### `Js.t(webViewNativeProgressEvent)`\n\nHas the below keys, which can be accessed with `##`.\n\n- `target: ReactNative.NativeTypes.nodeHandle`\n- `url: string`\n- `title: string`\n- `loading: bool`\n- `canGoBack: bool`\n- `canGoForward: bool`\n- `progress: float`\n\n#### `Js.t(webViewNavigation)`\n\nHas the below keys, which can be accessed with `##`.\n\n- `target: ReactNative.NativeTypes.nodeHandle`\n- `url: string`\n- `title: string`\n- `loading: bool`\n- `canGoBack: bool`\n- `canGoForward: bool`\n- `navigationType: ReactNativeWebView_NavigationType.t`\n- `mainDocumentURL: option(string)`\n\n#### `Js.t(webViewShouldStartLoadWithRequest)`\n\nHas the below keys, which can be accessed with `##`.\n\n- `target: ReactNative.NativeTypes.nodeHandle`\n- `url: string`\n- `title: string`\n- `loading: bool`\n- `canGoBack: bool`\n- `canGoForward: bool`\n- `navigationType: ReactNativeWebView_NavigationType.t`\n- `mainDocumentURL: option(string)`\n- `lockIdentifier: int`\n\n#### `webViewErrorEvent`\n\nwraps [`Js.t(webViewError)`](#jstwebviewerror) in `ReactNative.Event.syntheticEvent`\n\n```rescript\ntype WebViewErrorEvent.t =\n  ReactNative.Event.syntheticEvent(Js.t(webViewError));\n```\n\npassed to the handler specified for [`onError`](#onerror-webviewerrorevent--unit)\n\n#### `webViewHttpErrorEvent`\n\nwraps [`Js.t(webViewHttpError)`](#jstwebviewhttperror) in `ReactNative.Event.syntheticEvent`\n\n```rescript\ntype WebViewHttpErrorEvent.t =\n  ReactNative.Event.syntheticEvent(Js.t(webViewHttpError));\n```\n\npassed to the handler specified for [`onHttpError`](#onhttperror-webviewhttperrorevent--unit)\n\n#### `webViewMessageEvent`\n\nwraps [`Js.t(webViewMessage)`](#jstwebviewmessage) in `ReactNative.Event.syntheticEvent`\n\n```rescript\ntype WebViewMessageEvent.t =\n  ReactNative.Event.syntheticEvent(Js.t(webViewMessage));\n```\n\npassed to the handler specified for [`onMessage`](#onmessage-webviewmessageevent--unit)\n\n#### `webViewNavigationEvent`\n\nwraps [`Js.t(webViewNavigation)`](#jstwebviewnavigation) in `ReactNative.Event.syntheticEvent`\n\n```rescript\ntype WebViewNavigationEvent.t =\n  ReactNative.Event.syntheticEvent(Js.t(webViewNavigation));\n```\n\npassed to handlers specified for [`onLoad`](#onload-webviewnavigationevent--unit) or [`onLoadStart`](#onloadstart-webviewnavigationevent--unit)\n\n#### `webViewProgressEvent`\n\nwraps [`Js.t(webViewNativeProgressEvent)`](#jstwebviewnativeprogressevent) in `ReactNative.Event.syntheticEvent`\n\n```rescript\ntype WebViewProgressEvent.t =\n  ReactNative.Event.syntheticEvent(Js.t(webViewNativeProgressEvent));\n```\n\npassed to the handler specified for [`onLoadProgress`](#onloadprogress-webviewprogressevent--unit)\n\n#### `webViewTerminatedEvent`\n\nwraps [`Js.t(webViewNativeEvent)`](#jstwebviewnativeevent) in `ReactNative.Event.syntheticEvent`\n\n```rescript\ntype WebViewTerminatedEvent.t =\n  ReactNative.Event.syntheticEvent(webViewNativeEvent);\n```\n\npassed to the handler specified for [`onContentProcessDidTerminate`](#oncontentprocessdidterminate-webviewterminatedevent--unit)\n\n#### `webViewNavigationOrError`\n\nUnion type passed to the handler specified for [`onLoadEnd`](#onloadend-unioncallbackt), is of type [`webViewNavigationEvent`](#webviewnavigationevent) if loading succeeds and [`webViewErrorEvent`](#webviewerrorevent) if it fails.\n\nRefer to [`UnionCallback.t`](#unioncallbackt) for information on how to create the appropriate handler.\n\n### Props\n\n### `ref: ref`\n\nShould be specified to be able to access the `WebView` instance and apply [`methods`](#methods). Also refer to [`element`](#element) and [`ref`](#ref).\n\nAs an alternative, refer to [React documentation on `forwardRef`](https://reactjs.org/docs/forwarding-refs.html).\n\n#### `allowingReadAccessToURL: string`\n\nSpecifies URLs which can be referenced in scripts, AJAX requests and CSS imports. Used only for URIs specified as `file://`. Defaults to the URL provided in the URI.\n\n#### `allowFileAccess: bool`\n\nAllows access to the file system via URI specified as `file://` when `true`, defaults to false.\n\n#### `allowUniversalAccessFromFileURLs: bool`\n\nJavaScript running in the context of a file scheme URL should be allowed access to content from any origin including content from other file scheme URLs when `true`, defaults to `false`.\n\n#### `allowsBackForwardNavigationGestures: bool`\n\n_iOS only_\n\nHorizontal swipe gestures are allowed when `true`, defaults to `false`.\n\n#### `allowsFullscreenVideo: bool`\n\nFullscreen playback of videos is allowed when `true`, defaults to `false`.\n\n#### `allowsInlineMediaPlayback: bool`\n\nDetermines whether HTML5 videos play inline or use the native full-screen controller, defaults `false`.\n\n#### `allowsLinkPreview: bool`\n\n_iOS only_ _required 3D Touch support_\n\nPressing on a link displays a preview of the target when `true`. Defaults to `true` on iOS 10 and later, to `false` otherwise.\n\n#### `androidHardwareAccelerationDisabled: bool`\n\n_Android only_\n\nDisables Hardware Acceleration in the WebView when `true`, defaults to `false`.\n\n#### `` androidLayerType: [ | `none | `software | `hardware ] ``\n\n_Android only_\n\nSpecifies the layer type.\n\n#### `applicationNameForUserAgent: string`\n\nSpecifies `string` value to append to the `User-Agent` header, will be overridden if `userAgent` is set.\n\nFor example when `applicationNameForUserAgent=\"DemoApp/1.1.0\"` as below:\n\n```rescript\n\u003cReactNativeWebView\n  source=ReactNativeWebView.Source.uri(~uri=\"https://facebook.github.io/react-native\", ())\n  applicationNameForUserAgent=\"DemoApp/1.1.0\"\n/\u003e\n```\n\nResulting `User-Agent` may be as below:\n\n##### Android\n\n```\nMozilla/5.0 (Linux; Android 8.1.0; Android SDK built for x86 Build/OSM1.180201.021; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/61.0.3163.98 Mobile Safari/537.36 DemoApp/1.1.0\n```\n\n##### iOS\n\n```\nMozilla/5.0 (iPhone; CPU iPhone OS 12_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Mobile/15E148 DemoApp/1.1.0\n```\n\n#### `automaticallyAdjustContentInsets: bool`\n\nControls 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.\n\n#### `bounces: bool`\n\nWebView bounces as edge of the content is reached when `true`, defaults to `true`.\n\n#### `cacheEnabled: bool`\n\nSets whether WebView should use browser caching, defaults to `true`.\n\n#### `` cacheEnabled: [ | `default | `cacheOnly | `cacheElseNetwork | `noCache ] ``\n\nOverrides default caching behavior, which depends on the navigation type. For a normal page load, cache is checked and content is revalidated as needed. When navigating back, content is not revalidated, but simply retrieved from the cache.\n\n| Value                   | Behavior                                                                                                                                                                                        |\n| :---------------------- | :---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n| `` `default ``          | Default cache usage mode. If the navigation type doesn't impose any specific behavior, use cached resources when they are available and not expired, otherwise load resources from the network. |\n| `` `cacheOnly ``        | Don't use the network, load resources from the cache.                                                                                                                                           |\n| `` `cacheElseNetwork `` | Use cached resources when available, even when expired. Otherwise, load resources from the network.                                                                                             |\n| `` `noCache ``          | Don't use the cache, load resources from the network.                                                                                                                                           |\n\n#### `containerStyle: ReactNative.Style.t`\n\nallows to customize the WebView container style. Please note that there are default styles (example: `~flex=0.` needs to be specified to use the `height` prop).\n\n#### `contentInset: ReactNative.View.edgeInsets`\n\nRefer to [`rescript-react-native` documentation on View](https://github.com/rescript-react-native/rescript-react-native/blob/master/src/components/View.md).\n\n#### `` contentInsetAdjustmentBehavior: [ | `never | `always | `automatic | `scrollableAxes] ``\n\n_iOS only_\n\nSpecifies how safe area insets are used to modify content area of the scroll view, defaults to `` `never ``. Available on iOS 11 and later.\n\n#### `` contentMode: [ | `recommended | `mobile | `desktop] ``\n\n_iOS only_\n\nControls the type of content to load. Available on iOS 13 and later. Defaults to `recommended`, which loads mobile content on iPhone \u0026 iPad Mini but desktop content on larger iPads.\n\nMore at \u003chttps://github.com/react-native-webview/react-native-webview/blob/master/docs/Reference.md#contentMode\u003e\n\n#### `dataDetectorTypes: array(DataDetectorTypes.t)`\n\nSpecifies types of data to be converted to clickable URLs in content of the WebView, defaults to `[|DataDetectorTypes.phoneNumber|]`. Refer to [`DataDetectorTypes.t`](#datadetectortypest) for all valid values.\n\n#### `decelerationRate: DecelerationRate.t`\n\n_iOS only_\n\nSpecifies how quickly the scroll view should decelerate once the user lifts their finger, defaults to `DecelerationRate.fast`. Refer to [`DecelerationRate.t`](#decelerationratet) for all valid values.\n\n#### `directionalLockEnabled: bool`\n\n_iOS only_\n\nDisables scrolling in a particular direction when `true`, defaults to `true`.\n\n#### `domStorageEnabled: bool`\n\n_Android only_\n\nDOM Storage is enabled when `true`.\n\n#### `geolocationEnabled: bool`\n\n_Android only_\n\nSet whether geolocation is enabled in the `WebView`, defaults to `false.`\n\n#### `hideKeyboardAccessoryView: bool`\n\n_iOS only_\n\nKeyboard accessory view will be hidden when `true`.\n\n#### `incognito: bool`\n\nDoes not store any data within the lifetime of the `WebView.`\n\n#### `injectedJavaScript: string`\n\nSpecifies JavaScript that will be injected into the web page when loaded. The string should evaluate to a valid type (e.g. `true`) and not otherwise throw an exception.\n\nExample below passes`window.location` as a JSON object to be handled by the function passed to `onMessage`\n\n```rescript\nlet injectedJavaScript = \"(function() {\n  window.ReactNativeWebView.postMessage(JSON.stringify(window.location));\n})();\";\n\n\u003cReactNativeWebView\n  source=ReactNativeWebView.Source.uri(~uri=\"https://facebook.github.io/react-native\", ())\n  injectedJavaScript=injectedJavaScript\n  onMessage={e =\u003e Js.Console.warn(e##nativeEvent##data)}\n/\u003e\n```\n\nNote that the JavaScript will only be run once when the page is loaded for the first time; it will not be run again even if the page is reloaded or navigated away.\n\nRefer to the [Communicating between JS and Native](https://github.com/react-native-webview/react-native-webview/blob/master/docs/Guide.md#communicating-between-js-and-native) guide for more information.\n\nOn iOS, also refer to documentation on [WKUserScriptInjectionTimeAtDocumentEnd](https://developer.apple.com/documentation/webkit/wkuserscriptinjectiontime/wkuserscriptinjectiontimeatdocumentend?language=objc).\n\n#### `injectedJavaScriptForMainFrameOnly: bool`\n\n_iOS only_\nScript specified with `injectedJavaScript` will be loaded for all frames (main frame and iframes) when `false`, defaults to `true` (only for the main frame).\n\n#### `injectedJavaScriptBeforeContentLoaded: string`\n\nSpecifies JavaScript that will be injected into the web page after the document element is created, but before any other content is loaded. The string should evaluate to a valid type (e.g. `true`) and not otherwise throw an exception.\n\nExample below passes`window.location` as a JSON object to be handled by the function passed to `onMessage`\n\n```rescript\nlet injectedJavaScript = \"(function() {\n  window.ReactNativeWebView.postMessage(JSON.stringify(window.location));\n})();\";\n\n\u003cReactNativeWebView\n  source=ReactNativeWebView.Source.uri(~uri=\"https://facebook.github.io/react-native\", ())\n  injectedJavaScriptBeforeContentLoaded=injectedJavaScript\n  onMessage={e =\u003e Js.Console.warn(e##nativeEvent##data)}\n/\u003e\n```\n\nRefer to the [Communicating between JS and Native](https://github.com/react-native-webview/react-native-webview/blob/master/docs/Guide.md#communicating-between-js-and-native) guide for more information.\n\nAlso refer to documentation on [WKUserScriptInjectionTimeAtDocumentStart](https://developer.apple.com/documentation/webkit/wkuserscriptinjectiontime/wkuserscriptinjectiontimeatdocumentstart?language=objc).\n\n#### `injectedJavaScriptBeforeContentLoadedForMainFrameOnly: bool`\n\n_iOS only_\nScript specified with `injectedJavaScriptBeforeContentLoaded` will be loaded for all frames (main frame and iframes) when `false`, defaults to `true` (only for the main frame).\n\nNote that it may not be possible to inject JS into iframes in this stage of the page lifecycle, therefore exercise caution when setting to `false`.\n\n### `javaScriptCanOpenWindowsAutomatically: bool`\n\nA Boolean value indicating whether JavaScript can open windows without user interaction. The default value is `false`.\n\n#### `javaScriptEnabled: bool`\n\n_Android only_\n\nEnables JavaScript in the WebView when `true`, defaults to `true`. JavaScript is already enabled by default on iOS.\n\n#### `keyboardDisplayRequiresUserAction: bool`\n\n_iOS only_\n\nWeb content can programmatically display the keyboard when `false`, defaults to `true`.\n\n#### `mediaPlaybackRequiresUserAction: bool`\n\nHTML5 audio and video playback requires the user to tap them when `true`, defaults to `true`.\n\nSome videos may hang while loading on iOS when `true`. As the props defaults to `true`, setting `mediaPlaybackRequiresUserAction=false` may fix this issue.\n\n#### `` mixedContentMode: [@bs.string] [ | `never | `always | `compatibility] ``\n\n_Android only_\n\nSpecifies mixed content mode, defaults to `` `never ``.\n\n| Value                | Behavior                                                                                  |\n| :------------------- | :---------------------------------------------------------------------------------------- |\n| `` `never ``         | WebView will not allow a secure origin to load content from an insecure origin.           |\n| `` `always ``        | WebView will allow a secure origin to load content from any other (even insecure) origin. |\n| `` `compatibility `` | WebView will attempt to be compatible with how modern web browsers treat mixed content.   |\n\n#### `nativeConfig: nativeConfig`\n\nOverrides the native component used to render the `WebView`. Enables a custom native `WebView` which uses the same JavaScript as the original WebView. Refer to the [`nativeConfig`](#nativeconfig) type on how to specify the custom component.\n\nYou may refer to [iOS-](https://github.com/react-native-webview/react-native-webview/blob/master/docs/Custom-iOS.md) and [Android-](https://github.com/react-native-webview/react-native-webview/blob/master/docs/Custom-Android.md)specific guides on how to create a custom `WebView`.\n\n#### `onContentProcessDidTerminate: WebViewTerminatedEvent.t =\u003e unit`\n\n_iOS only_\n\nSpecifies function to be invoked when the WebView content process is terminated. The process may be terminated due to reasons such as running too long or using too many resources, however, once terminated a blank page is displayed and the `WebView` becomes unusable. Please refer to the [PR](https://github.com/react-native-webview/react-native-webview/pull/774) which added the functionality to allow handling this issue.\n\n```rescript\n\u003cReactNativeWebView\n  source=ReactNativeWebView.Source.uri(~uri=\"https://facebook.github.io/react-native\", ())\n  onContentProcessDidTerminate={_ =\u003e\n    ReactNativeWebView.reload()\n\n    this.refs.webview.reload();\n  }}\n/\u003e\n```\n\n#### `onFileDownload: WebViewDownloadEvent.t =\u003e unit`\n\n_iOS only_\n\nSpecifies function to be invoked when the `WebView` is about to download a file.\n\nMore at \u003chttps://github.com/react-native-webview/react-native-webview/blob/master/docs/Reference.md#onFileDownload\u003e\n\n#### `onError: WebViewErrorEvent.t =\u003e unit`\n\nSpecifies function to be invoked when the `WebView` fails to load.\n\n#### `onLoad: WebViewNavigationEvent.t =\u003e unit`\n\nSpecifies function to be invoked when the `WebView` has finished loading.\n\n#### `onLoadEnd: UnionCallback.t`\n\nSpecifies function to be invoked when the `WebView` succeeds or fails to load.\n\n#### `onLoadProgress: WebViewProgressEvent.t =\u003e unit`\n\nSpecifies function to be invoked while the `WebView` is loading.\n\n#### `onLoadStart: WebViewNavigationEvent.t =\u003e unit`\n\nSpecifies function to be invoked when the `WebView` starts to load.\n\n#### `onMessage: WebViewMessageEvent.t =\u003e unit`\n\nSpecifies function to be invoked when the `WebView` calls `window.ReactNativeWebView.postMessage`. Setting this prop will inject that global into the webview.\n\n`window.ReactNativeWebView.postMessage` accepts one `string` argument, which will be available as e.g. `e##nativeEvent##data` where `e` is the event object.\n\nRefer to the [Communicating between JS and Native](https://github.com/react-native-webview/react-native-webview/blob/master/docs/Guide.md#communicating-between-js-and-native) guide for more information.\n\n#### `onNavigationStateChange: Js.t(webViewNavigation) =\u003e unit`\n\nSpecifies function to be invoked when the WebView starts or ends loading.\n\nNote that this method will not be invoked on hash URL changes (e.g. from https://example.com/users#list to https://example.com/users#help). A workaround may be found in the [Guide](https://github.com/react-native-webview/react-native-webview/blob/master/docs/Guide.md#intercepting-hash-url-changes).\n\n#### `onRenderProcessGone: WebViewRenderProcessGone.t =\u003e unit`\n\n_Android only_\nFunction that is invoked when the `WebView` process crashes or is killed by the OS.\n\nMore at \u003chttps://github.com/react-native-webview/react-native-webview/blob/master/docs/Reference.md#onRenderProcessGone\u003e\n\n#### `onShouldStartLoadWithRequest: Js.t(webViewShouldStartLoadWithRequest) =\u003e bool`\n\nAllows custom handling of any `WebView` requests. Specified function should return `true` to allow requests and `false` to stop loading.\n\nOn Android, the function is not called on first load.\n\n#### `originWhitelist: array(string)`\n\nSpecifies `array(string)` listing origin strings to which navigation is allowed. Strings will be matched against just the origin (not the full URL) and wildcards are allowed. Any URL not whitelisted will be handled by the OS. Defaults to `[|\"http://\", \"https://\"|]`.\n\n#### `` overScrollMode: [ | `never | `always | `content] ``\n\n_Android only_\n\nSpecifies the over scroll mode, defaults to `` `always ``.\n\n| Value          | Behavior                                                                                |\n| :------------- | :-------------------------------------------------------------------------------------- |\n| `` `always ``  | Always allow a user to over-scroll the view if scrollable                               |\n| `` `never ``   | Never allow a user to over-scroll the view                                              |\n| `` `content `` | Allow a user to over-scroll the view only if scrollable and the content is large enough |\n\n#### `pagingEnabled: bool`\n\n_iOS only_\n\nAs the user scrolls, scroll view stops on multiples of the its bounds when `true`, defaults to `false`.\n\n#### `pullToRefreshEnabled: bool`\n\n_iOS only_\n\nBoolean value that determines whether a pull to refresh gesture is available in the `WebView`. The default value is `false`. If `true`, sets `bounces` automatically to `true`.\n\nMore at \u003chttps://github.com/react-native-webview/react-native-webview/blob/master/docs/Reference.md#pullToRefreshEnabled\u003e\n\n#### `renderError: string =\u003e React.element`\n\nSpecifies a function to be invoked when there is an error.\n\n```rescript\n\u003cReactNativeWebView\n  source=ReactNativeWebView.Source.uri(~uri=\"https://facebook.github.io/react-native\", ())\n  renderError={errorName =\u003e \u003cError name=errorName /\u003e}\n/\u003e\n```\n\n#### `renderLoading: unit =\u003e React.element`\n\nSpecifies a function to be invoked when the `WebView` is loading. Requires setting `startInLoadingState=true` .\n\n```rescript\n\u003cReactNativeWebView\n  source=ReactNativeWebView.Source.uri(~uri=\"https://facebook.github.io/react-native\", ())\n  startInLoadingState=true\n  renderLoading={() =\u003e \u003cLoading /\u003e}\n/\u003e\n```\n\n#### `saveFormDataDisabled: bool`\n\n_Android only_\n\n`bool` determines whether the WebView should disable saving form data., defaults to `false`. Has no effect on Android API level 26 and abovem as there is an Autofill feature storing form data.\n\n#### `scalesPageToFit: bool`\n\n_Android only_\n\nWeb content is scaled to fit the view and the user may change the scale when `true`, defaults to `true`.\n\n#### `scrollEnabled: bool`\n\n_iOS only_\n\nEnables scrolling in the WebView, defaults to `true`. When `false`, document body will not be moved if the keyboard obstructs an input.\n\n#### `sharedCookiesEnabled: bool`\n\n_iOS only_\n\nWhen set `true`, shared cookies from `[NSHTTPCookieStorage sharedHTTPCookieStorage]` should be used for every load request in the WebView, defaults to `false`.\n\n#### `showsHorizontalScrollIndicator: bool`\n\nHorizontal scroll indicator is shown in the WebView when `true`, defaults to `true`.\n\n#### `showsVerticalScrollIndicator: bool`\n\nVertical scroll indicator is shown in the WebView when `true`, defaults to `true`.\n\n#### `source: Source.t`\n\nSpecifies the resource to be loaded in the WebView as static HTML or a URI (with optional headers). Note that setting originWhitelist to `[|\"*\"|]` is required when source is some static HTML. Refer to [Source.t](#sourcet) for information on how to create the appropriate type.\n\n#### `startInLoadingState: bool`\n\nForces the WebView to show the loading view on first load; must be set to `true` for the `renderLoading` prop to work.\n\n#### `textZoom: float`\n\n_Android only_\n\nResolves issue where custom font sizes on Android leads to undesirable scaling of the interface when set to `100.0` (i.e. `textZoom=100.0`).\n\n#### `ignoreSilentHardwareSwitch: bool`\n\n_iOS only_\n\nWhen set to true the hardware silent switch is ignored. Default: `false`\n\n#### `thirdPartyCookiesEnabled: bool`\n\nEnables third party cookies in WebView when `true`, defaults to `true` on iOS and Android versions below 5.0.\n\n#### `userAgent: string`\n\nSpecifies `User-Agent` header for the WebView\n\n### `View` props\n\nRefer to\n[`rescript-react-native`](https://github.com/rescript-react-native/react-native)\n[documentation](https://rescript-react-native.github.io/en/docs/components/View/).\n\nPlease do note the below:\n\n#### `style: ReactNative.Style.t`\n\nallows to customize the WebView style. Please note that there are default styles (example: `~flex=0.` needs to be specified to use the `height` prop).\n\n### Methods\n\nFor the methods below, [`element`](#element) representing the `WebView` instance needs to be determined from the [`ref`](#ref) which itself can be defined and passed to the `WebView` [`ref`](#ref-ref) prop as below:\n\n```rescript\nlet ref = React.createRef();\n\n\u003cReactNativeWebView\n  ref=ref\n```\n\nThe `element` can be determined and the method [`reload`](#reload-element--unit) may be called as below:\n\n```rescript\nswitch (ref -\u003e React.Ref.current -\u003e Js.Nullable.toOption) {\n| None =\u003e Js.Console.warn(\"no element\")\n| Some(e) =\u003e ReactNativeWebView.reload(e)\n};\n```\n\n#### `clearFormData: element =\u003e unit`\n\n_Android only_\nRemoves the autocomplete popup (if present) from the currently focused form field.\n\n#### `clearCache: element =\u003e unit`\n\n_Android only_\nClears the resource cache for all WebViews in the application.\n\n#### `clearHistory: element =\u003e unit`\n\n_Android only_\nClears WebView's internal back/forward list\n\n#### `requestFocus: element =\u003e unit`\n\nRequest focus for the WebView.\n\n#### `goBack: element =\u003e unit`\n\nNavigates back one page in the WebView history.\n\n#### `goForward: element =\u003e unit`\n\nNavigates forward one page in the WebView history.\n\n#### `reload: element =\u003e unit`\n\nReloads the current page.\n\n#### `stopLoading: element =\u003e unit`\n\nStop loading the current page.\n\n#### `injectJavaScript: (element, string) =\u003e unit`\n\nInjects JavaScript as `string` into the web page. The string should evaluate to a valid type (e.g. `true`) and not otherwise throw an exception.\n\nRefer to the [Communicating between JS and Native](https://github.com/react-native-webview/react-native-webview/blob/master/docs/Guide.md#communicating-between-js-and-native) guide for more information.\n\n---\n\n## Changelog\n\nCheck the [changelog](./CHANGELOG.md) for more information about recent\nreleases.\n\n## Contribute\n\nRead the [contribution guidelines](https://github.com/rescript-react-native/.github/blob/master/CONTRIBUTING.md) before contributing.\n\n## Code of Conduct\n\nWe want this community to be friendly and respectful to each other. Please read\n[our full code of conduct](https://github.com/rescript-react-native/.github/blob/master/CODE_OF_CONDUCT.md) so that you can understand what\nactions will and will not be tolerated.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frescript-react-native%2Fwebview","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frescript-react-native%2Fwebview","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frescript-react-native%2Fwebview/lists"}