pubsub not working

Question

I've gotten this to work before, but for some reason after fireEvent the listener is never reached.

js where fireEvent happens:

import { LightningElement, track, api, wire } from 'lwc';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';
import { fireEvent } from 'c/pubSub';
import { CurrentPageReference } from 'lightning/navigation';

export default class MissionEdit extends LightningElement {

    @api recordId;
    @wire(CurrentPageReference) pageRef;

    onSaveSuccess(event) {
        console.log('++++++++++++++++++++++++++++++++onSaveSuccess'); //it makes it here
        fireEvent(this.pageRef, "changedMission");
        const toast = new ShowToastEvent({
            title: 'Mission Updated!',
            message: 'Mission successfully modified',
            variant: 'success',
            mode: 'dismissable'
        });
        this.dispatchEvent(toast);
        fireEvent(this.pageRef, "changedMission");
    }
}

js listener:

import { LightningElement, api, track, wire } from 'lwc';
import Utility from 'c/utility';
import { CurrentPageReference } from 'lightning/navigation';
import { registerListener, unregisterAllListeners } from 'c/pubSub';

export default class MissionDetailHeaderInfo extends Utility {

    @api recordId;
    @wire(CurrentPageReference) pageRef;

    connectedCallback(){
        console.log('RrosMissionDetailsPage----connectedCallback');
        registerListener("changedMission", this.handleChanged, this);
    }

    disconnectedCallback() {
        console.log('disconnectedCallback');
        unregisterAllListeners(this);
    }

    handleChanged(event) {
        console.log('header refreshed +++++++++++++++++++++++++++++++++++++');//doesn't reach here
        this.renderMissionHeaderDetails();
    }
}

Any idea what I'm doing wrong?

Answer 1

The pubsub module is an open source "workaround" for use when you need to do cross-DOM communication (not parent/child or child/parent) but there is no official mechanism available in your usage context. It is less than ideal, and has various drawbacks and missing capabilities, such as:

• The need to explicitly track registrations so you can cleanly unregister when no longer subscribing - e.g. on component destruction.
• Problems with page references in different technology stacks (e.g. Aura/LWC vs Visualforce), though this has been alleviated with the introduction of DomainCreator.
• Lack of support for cross-namespace messaging.

If you are able, it would be a good idea to adopt Lightning Message Service (assuming you are working in usage contexts it supports) since this is an official, supported mechanism.

As mentioned in comments, trailhead covers communicating between unrelated components which might be a good place to start.