DEV Community

Jochem Stoel
Jochem Stoel

Posted on

2 1

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]

Image of Datadog

The Essential Toolkit for Front-end Developers

Take a user-centric approach to front-end monitoring that evolves alongside increasingly complex frameworks and single-page applications.

Get The Kit

Top comments (0)

SurveyJS custom survey software

Simplify data collection in your JS app with a fully integrated form management platform. Includes support for custom question types, skip logic, integrated CCS editor, PDF export, real-time analytics & more. Integrates with any backend system, giving you full control over your data and no user limits.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay