why onMessage method get all event?

[OHHAKO]

Bug description:

• in communication between native and web, onMessage method have to invoke when window.ReactNativeWebView.postMessage runs. but onMessage invoked when AutoHeightWebView is resized. so if my code runs, i got these message. {"width":413,"height":103.6319612590799}
  what's happening?

Source (static HTML or url):

 const scriptToGetUrlEvent = `
        /* Send url to React Native*/
        function clickLink(e){
           var href = e.target.closest("a").getAttribute('href');
           window.ReactNativeWebView.postMessage(JSON.stringify(href));
           e.preventDefault();
        }

            /* Add Event Handler to link tag */
            for (var ls = document.links, numLinks = ls.length, i=0; i<numLinks; i++){
              ls[i].addEventListener("click", clickLink);
            }`;

 <AutoHeightWebView
        style={{ width: Dimensions.get('window').width - 15, marginTop: 35 }}
        customScript={scriptToGetUrlEvent}
        customStyle={`
      * {
        font-family: 'Times New Roman';
      }
      p {
        font-size: 16px;
      }
    `}
        onMessage={event => console.log(event.nativeEvent.data)}
        source={{
          html: content.summary,
        }}
        scalesPageToFit={true}
        viewportContent={'width=device-width, user-scalable=no'}
        /*
        other react-native-webview props
        */
      />

Expected behavior:
onMessage print only when postMessage send the data.

Environment:

• OS: expo ios simulator
• OS version: 14.5
• react-native version: sdk-42.0.0.
• react-native-webview version: "react-native-autoheight-webview": "^1.5.8",
• react-native-autoheight-webview version: "react-native-autoheight-webview": "^1.5.8",

[leandrosimoes]

I'm having a similar problem.

As you can see in the image below, this function updateSize is called in every window resize and load events and at line 51 the function window.ReactNativeWebView.postMessage is called with the object stringified.

Then, as you can see in this other image below, this function handleMessage is handling all messages, including that one that I mentioned above. The event is then passing to our onMessage that we passed as param of the WebView.
My problem, besides all the messages being passed through, when I execute some window.ReactNativeWebView.postMessage at my side, the message also passes through this handleMessage function, and then, if my data payload is not an object, it will trigger an error in the console log at line 38, with is very annoying, showing some Red Box on my emulator while I'm developing the app.

My suggestion is to create a way to suppress your messages to be passed through our onMessage handler. Could be a property in the payload that is being stringified to identify the event type and then in the handlerMessage function, this message could be not passed through and also not trigger any console message.

I'll open a PR soon with some changes to get this work.

[iou90]

Should be fixed with v1.6.0.