Is there something in firefox addon through which we can register a callback which gets invoked when the addon is closed by clicking the x button on the left?
What I need is, when a user closes the addon bar using the x button, my extension loaded on that bar should be notified. Now what happens is, even though the user closes the addon bar, it is not getting closed; instead it just hides.
If we can be informed through a callback that the user has clicked on x button, then i could listen to that in the extension.
Yes sir there absolutely is: MutationObserver.
Copy paste this to a scratchpad file in Browser envirnoment and then as addon bar is closed and opened you will see a message.
// select the target node
var win = Services.wm.getMostRecentWindow('navigator:browser');
var target = win.document.querySelector('#addon-bar');
// create an observer instance
var observer = new win.MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
if (mutation.attributeName == 'collapsed') {
Services.prompt.alert(null,'title','addon bar toggled it WAS = ' + mutation.oldValue);
}
});
});
// configuration of the observer:
var config = { attributes:true, attributeOldValue:true };
// pass in the target node, as well as the observer options
observer.observe(target, config);
// later, you can stop observing
//observer.disconnect();
The easiest way to do this is to attach a command handler to the button in question. If your code runs inside the browser window, this will do:
var closeButton = document.getElementById("addonbar-closebutton");
closeButton.addEventListener("command", function(event) {
// Add-on bar is being closed, do something
}, false);
Note that this code is bound to stop working very soon as the add-on bar is being removed from Firefox.
Related
I have a Electron App which, on the press of a button, opens a new Window. Said Window has another button with the id of "closeBtn". Now i try to handle it in the js associated to said element with the following code
const electron = require("electron")
const path = require("path")
const remote = electron.remote
const closeBtn = document.getElementById("closeBtn")
closeBtn.addEventListener("click", function(e) {
var window = remote.getCurrentWindow();
window.close();
})
But somehow that doesn´t work, and the new window is not closing on the Button Press. What am i doing wrong?
Fixed it by adding webPreferences {nodeIntegration: true} to the values of my newly generated Window.
Is there an API that makes it possible to get the current tab's history in a Web Extension in Firefox? Just like when clicking and holding on the Back button, a dropdown will appear to show the current tab's history.
No. You cannot ask for the list for a certain tab by default.
You can, however, listen for the tab events onUpdated, onCreated etc. Using the tabId which stays the same, you can keep a list of URLs in a background script (background.js) which is always running if the addon is enabled.
You would do it like this:
let arr=[]; // At the top of background.js
browser.tabs.onCreated.addListener(handleCreated); // Somewhere in background.js
function handleCreated(tab) {
let tabId = tab.id;
if(arr[tabId]==null) arr[tabId] = [];
arr[tabId].push(url);
}
function getHistoryForCurrentTab(){
function currentTabs(tabs) {
// browser.tabs.query returns an array, lets assume the first one (it's safe to assume)
let tab = tabs[0];
// tab.url requires the `tabs` permission (manifest.json)
// We will now log the tab history to the console.
for(let url of arr[tab.id]){
console.log(url);
}
}
function onError(error) {
console.log(`This should not happen: ${error}`);
}
browser.tabs.query({currentWindow: true, active: true}).then(currentTabs, onError);
}
The above code is a proof of concept. Some improvements you will need to consider: implement onClosed which resets the tab history for that id (arr[tabId] = null), implement onUpdated (will be needed for sure, same logic as in handleCreated).
Links:
https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/tabs
I have a Firefox add on that displays a pop-up when it sees a certain response header. This works fine when I have a single window. However, when I have multiple windows open, and one of the tabs in a window triggers the pop-up code in my add-on (due to the presence of said header) I get a pop-up in each of my open windows. For example, if I have 3 windows open, I get 3 different pop ups, one for each windows. Is this the default behavior, and is there an easy in-built way to fix this using their SDK.
Edit:
I have the following code:
Util.requestBlock(httpChannel) {
/*load response headers here*/
if (responseHeaders.includes("header_xyz"))
alert("show popup");
}
Util.monitor = function(w) {
this.obsService = Components.classes['#mozilla.org/observer-service;1'].getService(Components.interfaces.nsIObserverService);
this.obsService.addObserver(this, 'http-on-examine-response', false);
}
Util.monitor.prototype = {
'observe': function(subject, topic, data). {
if (topic == 'http-on-examine-response'). {
var channel = subject.QueryInterface(Components.interfaces.nsIHttpChannel);
var block_response = new Util.RequestBlock(channel);
}
},
};
The Util.monitor adds an observer. Whenever a response is received, the "Observe" function is called.
var windows = require("window-utils");
for (window in windows.browserWindowIterator)
doToWindow(window);
I develop my first firefox extension. My usecase (already sucessfully implemented as a chrome extension):
Inject CSS of a specific page
Default load: contentscript-on.js
On Click icon (icon-on.png / icon-off.png) switch from contentscript-on.js to contentscript-off.js and backward
The contentscript-on.js already works on page load. I´ve searched a lot to find help or an example for my usecase. Any ideas?
Thank you very much!
main.js
var pageMod = require("sdk/page-mod");
var self = require("sdk/self");
pageMod.PageMod({
include: "https://app.example.de/dashboard",
contentScriptFile: [self.data.url("jquery-1.11.0.min.js"), self.data.url("contentscript-on.js")]
});
In my chrome extension, I use a background.js to toggle on / off and switch between the scripts
//toggle = true, because the contenscript-on.js is already loaded on initial loading of the page
var toggle = true;
chrome.browserAction.onClicked.addListener(function(tab) {
toggle = !toggle;
if(toggle){
//change the icon after pushed the icon to On
chrome.browserAction.setIcon({path: "icon-on.png", tabId:tab.id});
//start the content script to hide dashboard
chrome.tabs.executeScript({file:"contentscript-on.js"});
}
else{
//change the icon after pushed the icon to Off
chrome.browserAction.setIcon({path: "icon-off.png", tabId:tab.id});
//start the content script to hide dashboard
chrome.tabs.executeScript({file:"contentscript-off.js"});
}
});
Is there a similar way to this in firefox extensions?
The PageMod constructor has an optional onAttach property which passes a content worker to your function. This worker can be destroyed to remove the scripts from the page
var contentWorker; // Global (or greater scope) variable
// …
onAttach: function(worker) {
contentWorker = worker;
}
Then, in your click listener
var tab = contentWorker.tab;
contentWorker.destroy();
contentWorker = tab.attach( {
contentScriptFile: [self.data.url("jquery-1.11.0.min.js"), self.data.url("contentscript-off.js")]
});
Frankly, it would probably be easier just to attach both and toggle them somehow from within the content script code
As a side note, there's a new toggle button that you can can use that will have an activated/deactivated look that sounds like it would be good for your scenario.
I have a surely somehow stupid problem with adding an eventlistener to a window I create in a commonJS module in Titanium Mobile.
Consider i.e. the following code:
var SegmentListWindow = function(){
var window = S.ui.createWindow("Testwindow");
window.addEventListener("app:customListener", function(){ doSomething();});
return window;
}
exports.SegmentListWindow = SegmentListWindow;
The window is nicely generated using
var Window = require(".....").SegmentListWindow;
var win = new Window();
S.ui is just a simple helper method to create some standard window in my app.
But the event listener is never called, I tryTi.App.fireEvent("app:customListener"), but the event doesn't reach the listener.
Only when Using Ti.App.addEventListener and adding a global eventlistener it's working.
I think maybe that problem is I am not adding the event listener to the "instance" of the window? But how to fix this? I don't want to add the event listener manually when instantiating the window somewhere in the app. Can't I do this in the commonJS module?
Well, that really was a simple question.
I am doing a Ti.App.fireEvent, but was listening for window.addEventListener, that couldn't work.
Now I am doing the following:
Adding an eventlistener on window instantiation to the global Ti.App-Object, and remove this listener on the window's close event.
That works perfectly.
You could also define the SegmentListWindow as you did in the question:
var SegmentListWindow = function(){
var window = Ti.UI.createWindow({title:"Testwindow"});
window.addEventListener("win:customListener", function(){ doSomething();});
return window;
}
exports.SegmentListWindow = SegmentListWindow;
and then fire the event on the win object:
var Window = require(".....").SegmentListWindow;
var win = new Window();
win.fireEvent('win:customListener');