how to show a preference page using mozilla Add-on SDK? - firefox

I am developing an extension using the Addon-SDK. I want to show a preference page in order to get some users' configuration.
simple-prefs is too simple to use as its supported data type is so limited.
In a XUL app, I can use the following
<em:optionsType>3</em:optionsType>
<em:optionsURL>chrome://myaddon/content/options.html</em:optionsURL>
to set my preference page.
I found
the XUL migration guide
which says:
This is provided only as a migration aid, and it's still a good idea to port XUL windows to HTML.
How then can I make an HTML preference page ?
Many thanks!

I solved it in the following way:
Use simple-prefs with the preference type set to control. On its click event, open a page using the tab module, then use simple-storage to store data.
That's it!

Related

How to display popup with html in firefox bootstrapped extensions?

I developed a firefox bootstrapped extension (without add-on sdk). I need to display a popup with html content, something like panel in add-on sdk. Also, it is necessary that the extension could interact with content in the popup. Also, I need a way to display html content in separate tab and interact with this content. So what can I use to implement what I need?
You can append an iframe to that panel, and then load a page into that iframe. That's what I did in this simple addon here - https://github.com/Noitidart/AwesomeBar-Power-Tip/
Here's another gist that does something similar - https://gist.github.com/Noitidart/9445992
I think this is how the SDK does it as well.
but I can not understand how it is possible to implement the interaction between expansion and content inside the panel.
The panel or its frameLoader property should have a messageManager, which can be used to load frame scripts and pass messages to them.

Use selenium IDE to change Firefox Preferences for SDK Addon testing

I am using Selenium IDE to test some behavior in my FireFox SDK Add-On. For example, I load a page and determine that the content script is executing at intended. In my plugin, I use simple-prefs to set some user defined preferences.
For example, I would like to load a page and then ensure that if a preference is changed, that the content script received the update and made the necessary changes to the page based on the new setting.
when I try to navigate with Selenium-IDE to the plugin configuration page chrome://mozapps/content/extensions/extensions.xul?type=extensions / about:addons. I am able to use Selenium to select an entry (<richlistitem />), but I cannot click any of the buttons within the entry because they are not part of the XUL dom. I have tried using Selenium to send enter, tab, clicks, double clicks to the appropriate <richlistitem /> but there is no way of interacting with the "inner part" of the item.
I have also tried going down the path of using selenium to modify entries via about:config, however, the area with all of the entires is just an XUL <treechildren /> and you have no way of targeting individual entries.
Is there a convenient way to change addon setting as part of an automated workflow with selenium-ide?
It seems you should use Selenium Web driver , by driver you can set preference

Opening a bar on top of the page with firefox sdk

I am making a firefox pluggin and I want to open a "topbar" on a few websites. Realy, it would be a few informations about the curent page a link back to my own website. What would be te best way to do that ?
My first idea was to use content script, but that seems to be a very bad practice. I also read about panels, here are my questions :
How can I add my pannel just under the adressbar ?
How can I only open in it on the website I need ?
thx.
Using content script is completely fine.
It is modern, simple, less-code, more compatible way
to add top-panel to some web pages.
Also, code of content script is not injected to the web page, it just uses the dom and context; page script has no access (if you do not provide it explicit) to content script.
The only possible disadvantage is that panel would not look like native part of the browser.
If I convienced you to use content script:
The module you really need in your plugin page-mod
Using Add-on Builder you make have your plugin in a day

Options page for Firefox addon using the Add-on Builder (JetPack)

I am developing a Firefox extension and want to open a custom html page where the user can adjust the settings. I am able to do it in different ways, but would like to use the standard Options button that is shown in the add-on manager of Firefox.
I have seen some documentation about it, but I am having problems on finding proper documentation for this function using the online Add-on Builder:
Preferences system,
Inline options,
Simple prefs.
Does anybody know how to just add that standard Options button that is shown in the add-on manager and handle its click event to show a custom options page? (just like it's possible in Google Chrome)
Builder projects have an 'Properties' dialog that has a field you can paste the extra JSON in that you need to create preferences:
https://www.evernote.com/shard/s1/sh/cdb97850-935d-4cf1-95f1-a25c130d1498/4b0b2553f3aa85e4d6489c1d50492c97
( fixed the link, sorry )
Here's an example in builder that implements all the different types, and contains documentation as well:
https://builder.addons.mozilla.org/package/60337/latest/
You'll notice that one of the type of prefs you can define is a 'control' pref, essentially a button that emits a custom event you can listen of and react to from main.js. You could then open a new tab or addon-page with additional preferences?
https://addons.mozilla.org/en-US/developers/docs/sdk/latest/packages/addon-kit/simple-prefs.html#prefs

Modify contents of Firefox download dialog from add-on kit

I'd like to be able to add an option to the download dialog that pops-up in Firefox when starting a file download. Is it possible to do so using the new add-on SDK or do I have to do it the old way?
edit: Obviously, if the new option is selected, I need a way to know it and execute code based on it.
That's something you would use XUL overlays for. I guess that the dialog you are talking about is chrome://mozapps/content/downloads/downloads.xul - the download manager. AFAIK doing this isn't possible with the Add-on SDK, it only provides the most common UI integration points. You could create a traditional extension however, it can overlay any dialog.
There is no existing module that will help you that I know of, so you would have to create one, or wait for one to be made by someone else. But the main idea to extending browser UI is simple, and goes like this:
When the addon is loaded, scan for open windows of the type that you wish to extend.
extend the open windows by adding xul elements and javascript to the page.
listen for newly opened windows, and test that they are the type that you are looking for once they open
extend newly opened windows while your addon is active
Clean up after yourself when windows close or when your addon is disabled/uninstalled.
The last step is the most important and never matter with old school extensions which were not restartless.
Some for the built-in modules that you can look at that do this are the widget module, the context menu module, and the hotkeys module, all of which you can find here.
I've made a couple myself which are the toolbar button module, the xulkeys module, the menuitems module, and a few others, all of which you can find here.
Recently I wrote an extension do the same things. A bootstrap extension, not using addon-sdk.
I already submit it on AMO, but wait for review
https://addons.mozilla.org/en-US/firefox/addon/download-dialog-tweak/
And the source code
https://github.com/muzuiget/download_dialog_tweak

Resources