How to create UI with Mozilla Add-on SDK?

1
votes

I want to crate an extension for Mozilla Firefox which processes HTML code and generates screen reader output in a new window. I need to create a UI window (without tabs, panels, and addressbar) and I've only found a tab and window method in SDK API which opens a new tab or a new browser window, but I need a custom window with my buttons.

I've started building an overlay extension with a window in XUL, but this is an old type of extension. So, I decided to make a restartless extension.

How can I make a user interface with SDK? Is it a good practice if I use XUL window in SDK?

1
javascriptfirefoxfirefox-addonfirefox-addon-sdkxul
What have you tried so far? See How to Ask - David
I´ve done an overlay extension, with a window in XUL. Then i just started creating a new extension with SDK from scratch, i´ve followed the guide from MDN, i´ve created a button in the panel, and all i can open is a tab or browser window, but i don´t need the tabs bar, the panel and address bar. And I wonder if there is any way to do the same window with SDK, and I don´t know if it´s a good practice to use a XUL window in SDK extension. - Antoxic
All I found about building interfaces is: The SDK generally expects you to specify your user interface using HTML, not XUL. - Antoxic
This repo is a basic demo addon that creates an HTML page (as xhtml) which allows localization, you can then open your xhtml page in the new tab or browser or panel :) github.com/Noitidart/l10n/tree/xhtml-xul it also shows you xul if you want to go xul route (of course with localization) :) - Noitidart
Tank your for your help, but i´ve done the same as you and the problem I have is that i need a new window without tabs, address bar and without toolbars. - Antoxic

1 Answers

2
votes

I think the use of the panel API or simply loading a HTML page from the addon XPI into a tab and using page-mod is encouraged for addon UIs.

If you really want to open a separate window with a completely custom layout you can use window/utils#open. HTML is preferred (you can just use a * {unset: all} + some flexbox styles to get basic XUL-like behavior).

If you want the addon to directly interact with the window (instead of message-passing) you should open it with chrome privileges, otherwise it might get moved into the content process with e10s which would break direct access from addon code.