can't access source object when window.postMessage in Edge

Question

I am currently using Edge 44.18362, I have an authentication window, and a parent window which opens it, once the authentication is done I am posting the message to the parent(opener window) like this

$window.opener.postMessage(data,URL);  

and I am listening to the event in the parent window like this.

window.addEventListener('message', someFunc, false);  

and someFunc() is defined like this

function someFunc(windowData){  
//here I am accessing source as windowData.source  
}  

I am trying to access the source attribute of MessageEvent to access the URL and stuff. in Chrome/Firefox I am able to access source object and functionality works fine, but when it comes to Edge I am not able to access source object and I see this error in console.

Added try-catch around the block of code, this is the error I see.

What is going wrong here, what can be done to fix this?

Answer 1

Try to refer to the following sample code, it works well on my side (using Microsoft Edge 44.18362.449.0). In the receiveMessage function, it is better to do the origin validation. More information, please check the Window.postMessage().

Parent page:

    <script src="Scripts/jquery-1.10.2.min.js"></script>
    <script type="text/javascript">
        //http://localhost:54382/parentpage.html 
        $(function () {
            $("#showWindow").click(function () {
                var popup = window.open("http://localhost:54382/childpage.html");

                // When the popup has fully loaded, if not blocked by a popup blocker:

                // This does nothing, assuming the window hasn't changed its location.
                popup.postMessage("The user is 'bob' and the password is 'secret'",
                    "https://secure.example.net");

                // This will successfully queue a message to be sent to the popup, assuming
                // the window hasn't changed its location.
                popup.postMessage("hello there!", "http://localhost:54382");

                function receiveMessage(event) {
                    // Do we trust the sender of this message?  (might be
                    // different from what we originally opened, for example).
                    if (event.origin !== "http://localhost:54382")
                        return;

                    // event.source is popup
                    // event.data is "hi there yourself!  the secret response is: rheeeeet!"

                    console.log("parent page: "+event.data);
                }
                window.addEventListener("message", receiveMessage, false);
            });
        });
    </script>

<input type="button" id="showWindow" value="Display Window" />

Child page:

    <script type="text/javascript">
        /*
 * In the popup's scripts, running on <http://example.com>:
 */

        // Called sometime after postMessage is called
        function receiveMessage(event) {
            // Do we trust the sender of this message?
            if (event.origin !== "http://localhost:54382")
                return;

            // event.source is window.opener
            // event.data is "hello there!"

            // Assuming you've verified the origin of the received message (which
            // you must do in any case), a convenient idiom for replying to a
            // message is to call postMessage on event.source and provide
            // event.origin as the targetOrigin.
            event.source.postMessage("hi there yourself!  the secret response " +
                "is: rheeeeet!",
                event.origin);

            console.log("child page: " + event.data);
        }

        window.addEventListener("message", receiveMessage, false);
    </script>

If the above sample still not working, try to reset the Edge browser setting.