React Native Webview

Our latest react native plugin is currently under review. React Native Webview
A simple and elegant WebView component for Bubble native apps, allowing you to display external web content within your application.

Video link; https://www.youtube.com/shorts/-vEpnh3ozZ4

2 Likes

Published!

Hey i just purchased your webview react native plugin, and I am having issues with load time. I am simply embedding a webview into a sheet, setting the url as a custom state and setting that state to a stripe onboarding link for my usres. When the sheet popups up, the webview takes like 20+ seconds to load. Anyone else getting load-time issues?

1 Like

This is a first but if you send us the url you’re using we’ll test and see if we can replicate the issue and resolve.

Send it to info@nocodeventure.com

Thank you!

@patrick.white we just pushed a fix for this, the loading time is now reduced to about 1-2 seconds, weird enough this was only happenign on Stripe links from what we’ve tested.

1 Like

Hey @nocodeventure! It’s happening again! Happening with stripe links, takes like 20 seconds to load.

1 Like

this works exactly as needed. as a tip for others: set your view to “non-scrollable”.

1 Like

hi @nocodeventure,

I’m using your WebView plugin (Bubble Mobile)( Webview (Bubble Mobile) Plugin | Bubble ) to integrate an HTML page into my native application. I have an important question regarding receiving messages sent from the WebView.

In my HTML code, I send a message to the parent element via:

window.postMessage(JSON.stringify({ status: “success”, asset_id: “123” }), “*”);

or possibly:

window.parent.postMessage(…)

window.top.postMessage(…)

However, in Bubble, the event

“Webview A — Message Received”
doesn’t receive my JSON message. The received_message field always displays automatic messages like:

type: DOMChanged
timestamp: XXXXXX

Therefore, I would like to know:

:one: What is the exact channel your WebView listens for to receive messages from the HTML page?

(For example: window.top.postMessage, window.parent.postMessage, window.ReactNativeWebView.postMessage, or something else?)

:two: What format should the message be in for Bubble to correctly capture it in received_message?

– A JSON string?

– A simple string?

– An object?

:three: Is there a specific configuration in the plugin to enable/retrieve messages sent from the HTML page?

My goal is to trigger a Bubble workflow as soon as my WebView sends:

{ “status”: “success”, “asset_id”: “…” }

Thank you very much for your help.

We just updated our docs: Messaging | React Native Plugins | No-Code Venture @Alexandre1605