How to avoid multiple listeners when extension is reloaded

I’m developing an extension that registers an event listener in a content script (on the document element). I load this extension via about:debugging. Whenever I reload the extension with the “Reload” button, the event listener is registered again and I end up with two.

How can I prevent this from happening? I think the correct thing would be to remove the listener and then add the new one. I tried to do this using browser.runtime.onUpdateAvailable but I think this event is only available to background scripts because it appears undefined in the content script.

You will have to send a second content script on shtudown of the extension to remove all the stuff the first content script injected.

Or setup a listener in your one content script, that receives a message on shutdown of your addon. Then on your addon shutdown proc, send a message to all content scripts to remove what they added.