Search code examples
javascriptreactjswebpackmessage-bus

Postal.js subscription not receiving post from other react component

I have two decoupled components running on the one page and would like to use Postal.js to send a message when one is clicked to the other.

When the first component is clicked it publishes a post:

postal.publish({
  channel: 'carts',
  topic: 'item.add',
  data: {
    quantity: newQuantity
  }
});

Then in the second component I subscribe to that channel in componentDidMount():

postal.subscribe({
  channel: 'carts',
  topic: 'item.add',
  callback: this.handleStorageChange.bind(this)
});


When I add a wiretap to the subscribed component it shows that the channel was successfully subscribed to but never shows the post from the other component:

{"channel":"postal","topic":"subscription.created","data":{"event":"subscription.created","channel":"carts","topic":"item.add"},"timeStamp":"2018-03-14T01:59:38.309Z"}

When I add a wiretap to the posting component it shows that the message was posted:

{"channel":"carts","topic":"item.add","data":{"quantity":34},"timeStamp":"2018-03-14T01:59:41.844Z"}

What am I doing wrong here?

Solution

  • It turns out having my two components in different webpack packs caused issues with communication between the two.

    Packing the two components together fixed the issue.