Electron tray.displayBalloon() not working from async calls - windows

This works:
tray.displayBalloon({ title: 'my app', 'content': 'Access app settings from tray menu.' });
This does not:
setTimeout(function() {
tray.displayBalloon({ title: 'my app', 'content': 'Access app settings from tray menu.' });
}, 100);
Why?
P.S. I'm running it on Win10 and Electron 1.8.1

Looks like this is a known 'wontfix'
The solution is to provide an icon in the options for the displayBalloon call.
setTimeout(function () {
let img = nativeImage.createFromPath('some path to a png works');
tray.displayBalloon({
title: 'my app',
content: 'Access app settings from tray menu.',
icon: img
});
}, 100);

Make sure that your application is running at the moment when you call tray.displayBalloon. To prevent application quit you can handle will-quit event (see docs)
app.on('will-quit', function (event) {
event.preventDefault()
})
Calling event.preventDefault() in will-quit event handler will prevent the default behaviour, which is terminating the application.

Related

Teams auth popup wont close or redirect after completing sign in (React)

I have a React app (with React Router) running inside of a MS Teams tab, and I'm trying to have the user sign-in with azure ad redirect. A popup opens when they click the sign in button, but when they finish the auth procedure, the redirect happens inside the popup instead of closing and redirecting back to the tab.
When the sign-in button is clicked this runs inside of the SignIn component:
function loginTeams() {
microsoftTeams.authentication.authenticate({
url: window.location.origin + "/teams-auth",
width: 600,
height: 535,
successCallback: function (result) {
console.log('success')
},
failureCallback: function (reason) {
console.log('failed')
}
});
}
Then it redirects to the TeamsAuth component which opens the popup:
useEffect(() => {
microsoftTeams.initialize();
microsoftTeams.getContext(function (context) {
let authorizeEndpoint = buildAzureSSOLink(context);
window.location.assign(authorizeEndpoint);
});
}, []);
The redirect uri is set to /teams-auth-end which redirects to the TeamsAuthEnd component,
which calls the notify success method:
const queryParams = parseQueryParams(location);
useEffect(() => {
microsoftTeams.initialize();
microsoftTeams.authentication.notifySuccess({
accessToken: queryParams.access_token
})
}, []);
I suspect the problem has to do with calling microsoftTeams.initialize() in more than one spot, but removing them stops the popup from opening. Any ideas on what I'm doing wrong?

Hide window instead closing in Electron

My helper window is implemented like that:
updWindow = new BrowserWindow({
width: 400,
height: 200,
resizable: false,
show: false,
center: true,
maximizable: false,
minimizable: false,
title: 'Apdate Available'
});
updWindow.on('close', function () {
});
updWindow.loadURL(url.format({
pathname: path.join(__dirname, 'updateAvailable.html'),
protocol: 'file:',
slashes: true
}));
updWindow.setMenuBarVisibility(false);
When I click "x" button at window header the window will be closed and destroyed. So I will not be able to open it again using updWindow variable. Is there a way to keep window object for new opennings without reinitializations? I still want to use "x" button for this purpose.
My app is targeted to Mac OS.
You can use the function preventDefault on the event Electron will hand your handler over, i.e. like this:
updWindow.on("close", (evt) => {
evt.preventDefault(); // This will cancel the close
updWindow.hide();
});
This is mentioned in the Electron documentation, namely here.
Using this solution, you will later be able to un-hide the window by calling updWindow.show();.

How to create a toolbar on firefox?

I need to create two toolbar on Firefox : one is horizontal on top and the other vertical on right side of the browser. But the sdk lib to firefox dont have resources to do it. Any sugestion ?
This might help, pretty simple guide laid out for easy reading:
http://www.borngeek.com/firefox/toolbar-tutorial/
Since version 1.15 the Addon SDK allows you to create toolbars and add buttons to it. I don't think it's possible to create a vertical toolbar, only horizontal ones.
There's a nice example on how to do it in the Addon SDK official repository:
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
"use strict";
const { Toolbar } = require("sdk/ui/toolbar");
const { Frame } = require("sdk/ui/frame");
const { Button } = require("sdk/ui/button");
let button = new Button({
id: "button",
label: "send!",
icon: "./favicon.ico",
onClick: () => {
frame.postMessage({
hello: "content"
});
}
});
let frame = new Frame({
url: "./index.html",
onAttach: () => {
console.log("frame was attached");
},
onReady: () => {
console.log("frame document was loaded");
},
onLoad: () => {
console.log("frame load complete");
},
onMessage: (event) => {
console.log("got message from frame content", event);
if (event.data === "ping!")
event.source.postMessage("pong!", event.source.origin);
}
});
let toolbar = new Toolbar({
items: [frame],
title: "Addon Demo",
hidden: false,
onShow: () => {
console.log("toolbar was shown");
},
onHide: () => {
console.log("toolbar was hidden");
}
});
Also, there's an older SO thread explaining how to do it on older versions of the Addon SDK and for XUL-based addons.
The code above only works on Firefox Australis (upcomming version 29.0). You can use a Jetpack module like toolbarwidget-jplib by Rob--W.
So you can add widgets on the navigation bar:
require("toolbarwidget").ToolbarWidget({
toolbarID: "nav-bar", // <-- Place widget on Navigation bar
id: "mozilla-icon",
label: "My Mozilla Widget",
contentURL: "http://www.mozilla.org/favicon.ico"
});

How to remove an event listener?

I use the Mozilla's Add-on Builder. I am looking for a way to remove an event listener in a contentScript. I use the port way to communicate between add-on script code and the content script code.
The problem is the callback on event "response" is called more than once. I want it to be called once and declared in the callback of the event show.
Can someone help me with that?
main.js code:
var Panel = require("panel").Panel;
var popup_panel = Panel({
width: 286,
height: 340,
contentURL: require("self").data.url("popup.html"),
allow: { script: true },
contentScriptWhen: "end",
contentScriptFile : [
require("self").data.url("test.js")
],
onShow: function(){
this.port.emit("show");
var pan = this;
this.port.on("hide", function(){pan.hide();});
}
});
var Widget = require("widget").Widget;
var widget = Widget({
id: "mozilla-icon",
label: "My Mozilla Widget",
contentURL: "http://www.mozilla.org/favicon.ico",
panel: popup_panel
});
popup_panel.port.on("get", function(){
popup_panel.port.emit("response");
});
Content script (test.js):
self.port.on("show", function(){
console.log("show");
function response(){
console.log("reponse called");
}
self.port.emit("get");
self.port.once("response", response);
self.port.removeListener("response", response);
});
full source code
Finally I found the problem. It is a bug in the add-on kit. In the file api-utils/lib/content/content-worker.js in the function removeListener the index is always -1.
The parameter given in the indexOf is the name of the event and it search a function. It is incorrect.
So to solve the problem I replace the line let index = listeners[name].indexOf(name); by let index = listeners[name].indexOf(callback);.
EDIT
The bug has been fixed. It will publish in the version 1.10 see here

Find URL of current tab. Making a FireFox Browser add-on

I'm making a Firefox Browser Add-on and need to find the url of the current tab
I've tried this post Opening a URL in current tab/window from a Firefox Extension but it tells me that 'window' is not defined. (I think because I am making an add-on rather than an extension.)
Here's what I've tried to do:
var widgets = require('widget');
var tabs = require('tabs');
var widget1 = widgets.Widget({
id: "widget1",
label: "widget1",
contentURL: "http://www.mozilla.org/favicon",
onClick: function() {
console.log(tabs.url);
}
})
I've made a widget such that when I click it the url of the current tab should be 'console.log'ed.
Doesn't seem to happen! Keep getting "info: undefined" which clearly means that tabs.url isn't returning anything. But this seems to be the way to use it according to https://addons.mozilla.org/en-US/developers/docs/sdk/1.5/packages/addon-kit/docs/tabs.html
Anyone have any ideas?
Thanks,
Will
You're almost there:
const { ActionButton } = require("sdk/ui/button/action");
const clipboard = require("sdk/clipboard");
const tabs = require('sdk/tabs');
let button = ActionButton({
id: "my-button-id",
label: "Button Label",
icon: {
"32": "chrome://mozapps/skin/extensions/extensionGeneric.png"
},
onClick: function(state) {
let url = tabs.activeTab.url;
console.log("active tab url:", url);
require("sdk/notifications").notify({
title: "Active Tab's Url is "+url,
text: "Click to copy.",
onClick: function() {
clipboard.set(url);
}
});
}
});
You should check out the documentation on the tabs module.
Note: I've updated this code example to use the new ui modules available since Firefox 29 - the 'widget' module used in the original question was valid at the time but has since been deprecated and then removed.

Resources