Adding event listeners after joining Conference

On the conference instance, I add all event listeners before I call join(). This works fine for me but doesn’t seem to work when I add event listeners after calling join().

In my case, I’m passing the conference instance as a prop in a vuejs3 app and later adding the event listeners in the child component.

In essence, I want to listen to the conference joined event later. Is that even possible?

If you add the “conference joined” listener after you call join() then you have a race condition; the join might complete, and the event fire, before you add the listener. It would be better to structure your code so that you add the listener before calling join().

Yeah, I get this scenario. My main problem is, when I attach other event listeners to the instance which I passed as a prop to the child element, it doesn’t listen to the necessary events.
In this case, I want to listen to the JitsiMeetJS.events.conference.TRACK_ADDED on the instance which I passed as a prop inside the child component.
Not sure whether it’s a vuejs issue or a jitsi issue.

Also should all event listeners be added before we call join()?

Event listeners should be added before calling join() if the act of joining will (eventually) cause them to fire. With TRACK_ADDED for example, remote tracks may be added soon after joining the room (if there are other participants in the room already), so if you add the listener after joining you may miss (some of) the events.

You may consider adjusting the structure of your code so that you listen to the events before joining the room. If you decouple things so that you pass the events between components in your app as needed, then you should not be forced to listen to the event at a specific location in your code.

1 Like