DEV Community

Jochem Stoel
Jochem Stoel

Posted on

Electron Tray application: How to reference target balloon in event handler of balloon-clicked event?

Electron Tray applications can show balloons using the Tray.displayBalloon method that takes an object with title, content and optional icon property.

To my knowledge, the balloon interface does not include a click or onClick property. The Tray class does have a balloon-click event that fires when a balloon is clicked as well as a balloon-closed and balloon-show event. However the event object passed to the callback function does not seem to include a reference to the balloon that dispatched the event. (the balloon that was displayed, clicked or closed)

tray.on('balloon-click', console.log)
tray.on('balloon-show', console.log)
tray.on('balloon-closed', console.log)
Enter fullscreen mode Exit fullscreen mode

Log:

    { preventDefault: [Function: preventDefault],
      sender:
       Tray {
         _events:
          { 'balloon-click': [Function],
            'balloon-show': [Function: consoleLog] },
         _eventsCount: 2 } }
Enter fullscreen mode Exit fullscreen mode

My Tray application sends balloon notifications from different sources. What happens when you click the balloon (where to navigate to or what window to open) kinda depends on what the balloon is saying.

I need a reference to the balloon that was clicked, not just that there was a balloon click somewhere at some point. It strongly expected this to be there.

I can think of many ways to implement a solution ranging from a simple wrapper function and an activeBalloon variable to an entire BalloonManager class but I don't feel like wasting my time if I just overlooked this in the Electron Tray API documentation.

This question was also asked on discuss.atom.io in August 2017

Source: [https://discuss.atom.io/t/tray-balloon-click-how-to-know-which-balloon-is-clicked/46744][2]

Latest comments (0)