app.on('event', state => {}) calls within components persist after component is unmounted

[aeblin]

Was noticing a bit of weirdness in a Slater store I've been working on and realized that a few of my components with app.on('event', state => {}) calls inside them have these calls persist after the component is unmounted.

Other functions that don't utilize app.on(...) are wiped out on unmount as expected for components that return a function.

Curious if this behavior is intended?

[aeblin]

Worth noting this is easily resolved by just converting the app.on(...) calls in the components to ctx.on(...) calls consuming the same event, but still seems a bit weird that the app.on(...) calls persist?

[estrattonbailey]

Good shout, that is kinda confusing. The idea is that any handlers added within a component are automatically cleaned up on unmount, but that only happens if you use ctx.on, as you found.

This should definitely be clarified within the docs i.e. listeners added at a top level persist, those added using a component context are ephemeral.

What do you think? Any ideas on how this could be clarified?

[aeblin]

I'd say just a nod to the behavior in docs is probably sufficient? There's definitely value to persisting things with app.on so certainly wouldn't recommend removing that behavior.