From 9b5350827a2bfd3bd3b3fd80dac74e15601cea63 Mon Sep 17 00:00:00 2001
From: Brent Booker <brentb@psyton.net>
Date: Sun, 29 Jul 2018 16:04:27 -0700
Subject: [PATCH 1/2] Adding postMessage support to the webview.

---
 src/index.js | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

diff --git a/src/index.js b/src/index.js
index d4a0453..610016d 100644
--- a/src/index.js
+++ b/src/index.js
@@ -7,10 +7,11 @@ export default class extends Component {
     scrollEnabled: true,
   };
 
-  state = { html: null };
+  state = { html: null, elementId: null };
 
   constructor(props) {
     super(props);
+    this.state.elementId = props.id || (("" + new Date().getTime()) + ("_" + Math.random()));
     this.handleSource(props.source, props.newWindow);
   }
 
@@ -88,6 +89,11 @@ export default class extends Component {
 
   onMessage = nativeEvent => this.props.onMessage({ nativeEvent });
 
+  postMessage = (message, origin) => {
+    let el = document.getElementById(this.state.elementId);
+    el.contentWindow.postMessage(message, origin);
+  }
+
   handleInjectedJavaScript = html => {
     if (this.props.injectedJavaScript) {
       if (html) {
@@ -109,10 +115,13 @@ export default class extends Component {
       );
     }
 
+    let elementId = this.state.elementId;
+
     const { title, source, onLoad, scrollEnabled } = this.props;
     const styleObj = StyleSheet.flatten(this.props.style);
-    return createElement('iframe', {
+    let contentFrame = createElement('iframe', {
       title,
+      id: elementId,
       src: !source.method ? source.uri : undefined,
       srcDoc: this.handleInjectedJavaScript(this.state.html || source.html),
       width: styleObj && styleObj.width,
@@ -124,6 +133,8 @@ export default class extends Component {
       seamless: true,
       onLoad,
     });
+
+    return contentFrame;
   }
 }
 

From e1137471b452eb29b50b4c140e5868731d6cc61c Mon Sep 17 00:00:00 2001
From: Brent Booker <brentb@psyton.net>
Date: Tue, 31 Jul 2018 14:29:39 -0700
Subject: [PATCH 2/2] Updating pull request based on feedback. Iframe it
 immediately returned. Ref used on iframe and postMessage is called on ref
 rather than using element id.

---
 src/index.js | 14 ++++----------
 1 file changed, 4 insertions(+), 10 deletions(-)

diff --git a/src/index.js b/src/index.js
index 610016d..a02f8e6 100644
--- a/src/index.js
+++ b/src/index.js
@@ -7,11 +7,10 @@ export default class extends Component {
     scrollEnabled: true,
   };
 
-  state = { html: null, elementId: null };
+  state = { html: null };
 
   constructor(props) {
     super(props);
-    this.state.elementId = props.id || (("" + new Date().getTime()) + ("_" + Math.random()));
     this.handleSource(props.source, props.newWindow);
   }
 
@@ -90,8 +89,7 @@ export default class extends Component {
   onMessage = nativeEvent => this.props.onMessage({ nativeEvent });
 
   postMessage = (message, origin) => {
-    let el = document.getElementById(this.state.elementId);
-    el.contentWindow.postMessage(message, origin);
+    this.frameRef.contentWindow.postMessage(message, origin);
   }
 
   handleInjectedJavaScript = html => {
@@ -115,13 +113,11 @@ export default class extends Component {
       );
     }
 
-    let elementId = this.state.elementId;
-
     const { title, source, onLoad, scrollEnabled } = this.props;
     const styleObj = StyleSheet.flatten(this.props.style);
-    let contentFrame = createElement('iframe', {
+    return createElement('iframe', {
       title,
-      id: elementId,
+      ref: frameRef => { this.frameRef = frameRef; },
       src: !source.method ? source.uri : undefined,
       srcDoc: this.handleInjectedJavaScript(this.state.html || source.html),
       width: styleObj && styleObj.width,
@@ -133,8 +129,6 @@ export default class extends Component {
       seamless: true,
       onLoad,
     });
-
-    return contentFrame;
   }
 }