react-native-web-webview

react-native-web-webview copied to clipboard

Hello. My use case is multiple WebViews per screen, and each posting messages (separately) to track their content height.

Turns out:

• window.ReactNativeWebView.postMessage (inside iframe) fails, whereas this is the correct way for Android/iOS
• using window.postMessage (inside iframe) with onMessage={listen} won't propagate
• using window.parent.postMessage (inside iframe) with onMessage={listen} works, BUT you can't tell between instancess (unless you pass some guid back and forth)

Proposal: Instead of window.addEventListener('message', this.onMessage, true); use this.frameRef.contentWindow.addEventListener('message', this.onMessage, true); (see this topic https://stackoverflow.com/questions/10338344/html5-setting-onmessage-handler-for-iframe-in-parent-script)

Additionally, put window.ReactNativeWebView = window or something similar.

I'm in exactly the same situation - multiple WebViews that need to separately track their heights through postMessage (using https://github.com/iou90/react-native-autoheight-webview for that purpose).

I managed to make postMessage calls in react-native-autoheight-webview work thanks to advice from this comment: https://github.com/react-native-web-community/react-native-web-webview/issues/55. But, as noted, window.parent.postMessage equally affects all WebViews, so they get set the same height, which is incorrect.

I'm now working towards passing a guid for identification, but it would be nice if react-native-web-webview just worked out of the box. I tried replacing window.addEventListener with this.frameRef.contentWindow.addEventListener as suggested, but that didn't work for me.

Could someone please make a Pull Request with a fix?