The Klarna WebView is part of Klarna's React Native Mobile SDK. That means to start using the Klarna WebView first you need to add a dependency to your app. To see how you can do that please refer to React Native: Getting Started.

After adding the required dependency you can import the KlarnaStandaloneWebView component and use it like so:

import {
  KlarnaStandaloneWebView,
  KlarnaWebViewKlarnaMessageEvent,
  KlarnaWebViewError,
  KlarnaWebViewNavigationEvent,
  KlarnaWebViewProgressEvent,
  KlarnaWebViewRenderProcessGoneEvent,
} from 'react-native-klarna-inapp-sdk';

// ...

In what follows we will go through all the props and methods of the KlarnaStandaloneWebView component.

In this section we look at all the props that the KlarnaStandaloneWebView provides.

returnUrl is the only mandatory prop of KlarnaStandaloneWebView. It's a string and is used to redirect third-party apps to your app if required.

This is an optional Android-only prop that allows setting the over scroll mode of the web view. It accepts the following values:

• always
• never
• content

If not provided, the default value will be always.

This is an optional iOS-only boolean prop that allows controlling whether the web view's scroll view bounces past the edge of content and back again. If not provided, the default value will be true.

This prop is optional and is of type ViewStyle. You can use it to style the KlarnaStandaloneWebView.

This prop is an optional lambda that is called when KlarnaStandaloneWebView starts loading/reloading a URL. The lambda has an instance of type KlarnaWebViewNavigationEvent as its only parameter. The properties of KlarnaWebViewNavigationEvent are as follows:

This prop is an optional lambda that is called when KlarnaStandaloneWebView finishes loading a URL. The lambda has an instance of type KlarnaWebViewNavigationEvent as its only parameter. Please refer to the previous section to learn about the properties of KlarnaWebViewNavigationEvent.

This prop is an optional lambda that is called when KlarnaStandaloneWebView is loading a URL. The lambda has an instance of type KlarnaWebViewProgressEvent as its only parameter. The properties of KlarnaWebViewProgressEvent are as follows:

This is an optional lambda that is called when KlarnaStandaloneWebView fails to load a URL. The lambda has an instance of type KlarnaWebViewError as its only parameter. The following table shows all the properties of KlarnaWebViewError.

This is an optional lambda that is called when KlarnaStandaloneWebView receives a message from a Klarna component. The lambda has an instance of type KlarnaWebViewKlarnaMessageEvent as its only parameter. As of now, KlarnaWebViewKlarnaMessageEvent has a single property of type string called action that represents the action of the message.

This is an optional Android-only prop that is called when KlarnaStandaloneWebView's process crashes or is killed by the OS. The lambda has an instance of type KlarnaWebViewRenderProcessGoneEvent as its only parameter. As of now, KlarnaWebViewRenderProcessGoneEvent has a single property of type boolean called didCrash. If it's true it means the render process crashed. When it's false it means the render process was killed by the OS.

KlarnaStandaloneWebView exposes a set of methods via a view’s ref. The methods are as follows.

You can use this method to load a URL in the KlarnaStandaloneWebView. It has a single parameter called url of type string that specifies the URL to load.

This method can be used to reload the current URL. It does not have any parameters.

The method allows you to navigate to the previously loaded URL on the KlarnaStandaloneWebView. In essence, it lets you move back one step in the history of the loaded URLs. When this method is used, the current URL will be replaced with the URL that was loaded immediately prior to it in the browsing history of the KlarnaStandaloneWebView.

The goForward method, on the other hand, enables you to navigate to the next URL in the history of the KlarnaStandaloneWebView. Basically, it allows you to move forward one step in this history. When you apply this method, the current URL is replaced with the URL that you navigated to immediately after the current URL in the KlarnaStandaloneWebView's browsing history, assuming you went back previously. This method is the opposite of goBack.