Search code examples
javascriptfirefoxfirefox-addondom-eventsxul

Change Javascript in a Firefox extension overlay


I wrote an extension for Firefox with an overlay.

When I click on the principal button, the extension loads entconnect.entImmediat, but when I click on "Changez vos identifiants", the extension loads entconnect.openLogs AND entconnect.entImmediat. How can I do for just load entconnect.openLogs when I click on "Changez vos identifiants"? This is the code of my overlay :

<overlay id="entconnect-overlay" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<script src="chrome://entconnect/content/entconnect.js"/>
<toolbarpalette id="BrowserToolbarPalette">
    <toolbarbutton class="toolbarbutton-1 chromeclass-toolbar-additional" id="entconnect-addbar" label="Allez sur votre ENT" type="menu-button" oncommand="entconnect.entImmediat();">
        <menupopup>
            <menuitem label="Changez vos identifiants" oncommand="entconnect.openLogs();"/>
        </menupopup>                             
    </toolbarbutton>
</toolbarpalette>
</overlay>

Solution

  • The command event bubbles up meaning that it will be received by event handlers further up in the DOM hierarchy. You can prevent the event from bubbling further up if you already handled it:

    oncommand="entconnect.openLogs();event.stopPropagation();"
    

    Or you can look at the event target:

    oncommand="if (event.target.localName != 'menuitem') entconnect.entImmediat();"
    

    Or you can simply process only the events that were triggered at the current element:

    oncommand="if (event.eventPhase == event.AT_TARGET) entconnect.entImmediat();"