post-robot icon indicating copy to clipboard operation
post-robot copied to clipboard

post-robot in React - cannot read properties of undefined (send)

Open lcpages opened this issue 2 years ago • 2 comments

I have install the post-robot package to my react project.

My project works as a web app which is embedded into a Web Client application and displayed within an IFrame. I know this web client uses post-robot library to handle communication events and I also know it is has an EventListening set on "loading".

Like any other packages, I have imported post robot in my main app component

import { postRobot } from 'post-robot'

I tried to send the corresponding message the webclient is expecting :

const sendMessage = (message, success) => {
    //parent window is the holding web client, message is "loading", success is false
    postRobot.send(window.parent, message, success)

however, when this function is called in the hook at runtime, an error occurs saying that React does not recognize '.send()' as a valid method.

error1

I am puzzled. React seems to not recognize post-robot package, however, VS does not preventively throw any warning/errors (like it usually does) which would mean the package has been installed successfully. Am I doing this wrong or is post-robot not meant to be used on a React project ?

lcpages avatar Feb 03 '23 20:02 lcpages

You need to use the default export

import postRobot from 'post-robot'; // will work

Not a named export

import { postRobot } from 'post-robot'; // won't work

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import

zackspear avatar Mar 13 '23 20:03 zackspear

@zackspear , thank you for the answer. It works.

lcpages avatar Mar 19 '23 16:03 lcpages