I need a setup in which Component A initiates a data request to Component B through LMS (Publish). Component B, upon subscription to the request, will execute certain logic and subsequently publish the data back to A as a response. However, I prefer this process to occur as a promise, meaning that Component A should wait for Component B to send the response before proceeding. Can someone provide insights on how to implement this efficiently?

1 Answer 1


As long as you're certain component B is already subscribed and ready to receive messages, you can do something like this:

sendMessage(message) {
  return new Promise((resolve) => {
    let subscription;
    const callback = (result) => {
    subscription = subscribe(
    publish(this.messageContext, COMPONENT_B_EVENT, message);

Which would then be called as:

let result = await this.sendMessage(message);
// do something with result

Unfortunately, it's required to subscribe and unsubscribe from within the Promise to avoid leaking memory and make sure the function's scope/closure is correct.

I typically use a handshake technique to make sure I'm ready. That is, both component A and component B will fire their first message to the channel. Whichever component receives a message first then knows the other component is ready.

#partnerAvailable = false;
connectedCallback() {
disconnectedCallback() {
notifyPartnerAvailable() {
  publish(this.messageContext, CHANNEL_NAME, { available: true, name: this.constructor.name });
handlePartnerNotify(message) {
  if(message.name !== this.constructor.name) {
    this.#partnerAvailable = message.available;

Using this flag, you can determine if the other component is ready to receive a message. You could even make this logic a mixin or class so that it's easy to use across components.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .