Modern guide to XUL?

[PseudoDistant]

I'm trying to create a XUL extension for Pale Moon and Basilisk, but I don't know where to start. All of the guides I've found here are full of dead links or seem to target Firefox 3 (and not work on latest Pale Moon/Basilisk). I've only found a couple of working links that actually provide working information, but they don't cover very much (I had to figure out toolbarpalette by a combination of reading a bunch of old extensions on GitHub and spending several hours doing research on 2014 StackOverflow threads). Is there a good documentation/guide for XUL extensions in 2024, or any support thread/site for it?

[Moonchild]

This would be a good starting point: http://udn.realityripple.com/docs/Archive/Mozilla/XUL

[vannilla]

You should also check out other people's extensions to see how you do certain things where documentation happen to be sparse.
Here is a list of my works; except for ηMatrix they are simple and hopefully easy to understand.

[moonbat]

You should also check out other people's extensions to see how you do certain things where documentation happen to be sparse.

That can wait when one is starting from scratch, knowing the basics is what counts. The link above is thanks to RealityRipple here, he archived the old Mozilla XUL docs before they were nuked.

From the same site, there are a few guides that you should start with - the XUL School Tutorial that takes you step by step through a 'hello world' first extension, the XUL Tutorial for referring to slightly more advanced stuff and for the rest, peruse the main page of the archive above. Mozilla never bothered to make a properly navigable and consistent documentation portal for the XUL API so it's a bit of a mess.
RealityRipple has added the ability to report broken links that may point to now non existent Mozilla developer docs, you can search for the same page on this site and report the link to be fixed.

Get a hang of building extensions and only then look at other people's code. From what I've seen, even so called good extensions have terribly sloppy coding practices, worst one being mixing UI with event handling (as in adding eventhandler references to the XUL directly), or using document.createElement() for static UI elements instead of defining them in XUL.

[PseudoDistant]

This would be a good starting point: http://udn.realityripple.com/docs/Archive/Mozilla/XUL

Thank you so much, I somehow didn't get this in my search results.

You should also check out other people's extensions to see how you do certain things where documentation happen to be sparse.
Here is a list of my works; except for ηMatrix they are simple and hopefully easy to understand.

I can kind of understand some things. What I'm really struggling with right now is accessing site content. I want to be able to access a URL stored in a variable in the site's script, but I can't seem to find out how.
For example, on Newgrounds, Flash content is stored in `window.embedded_controller.getFileURL()` (from the console's context), I don't know how to access this from my extension script. (I did figure out how to actually style the toolbar button and add an event listener on "DOMContentLoaded" tho, thank you both.)
How would I be able to access site script data? I can't seem to find it in the docs. idk if it's very well hidden or if I'm just bad. :/

[vannilla]

What do you need to do?
Accessing content values is not exactly immediate, it might easier to make a userscript if you don't need menus or any other "chrome".

[PseudoDistant]

What do you need to do?
Accessing content values is not exactly immediate, it might easier to make a userscript if you don't need menus or any other "chrome".

I actually kind of do need some Extension functionality, like detecting when the user switches tabs, and having a menu (albeit admittedly very basic). I've considered making a userscript, as I have past experience with both userscripts and userstyles, but I genuinely need an extension for what I'm trying to do.
See, I've been messing with Adobe Flash Player content lately on some sites I used to use when I was younger. Call it a nostalgia trip, but it is what it is. I have had past experience with both Pale Moon and Basilisk, so I know it's capable of still running the Flash Player plugin.
The issue I have is a lot of Flash gallery sites have employed Ruffle. While Ruffle works very well with some things, it isn't perfect and seems to break a lot of older games I want to play again. Using Basilisk and Adobe Flash Player, these work, but not when Ruffle runs.
A few sites have workarounds, like for `dagobah.net`, replacing `flash` in the URL with `flashswf` just directly loads the SWF file (I wish to do this in a slightly more sophisticated way by replacing the Ruffle embed with Flash Player, but all in due time), but for other sites (Like Newgrounds, as I had mentioned previously), I need to pull the SWF file out of the site's JavaScript. While both of these can be done manually, I'd like to not only automate the process, but (if possible) even reintegrate Flash into these websites. I want it to be selective tho, as I know some sites using Flash may be less secure than others, which is what the menu is for. I'm willing to learn the XUL platform for this, as I've always wanted to experiment with it ever since I discovered Pale Moon in Puppy Linux way back in like 2018 or so. I am kind of struggling with it a bit, but it's been at least kind of fun so far.

[Kris_88]

Install Greasemonkey and write a script for the problematic site. Embed the menu directly into the website page.
This will make things easier for you.

https://github.com/janekptacijarabaci/g ... es/latest/
Direct link:
https://github.com/janekptacijarabaci/g ... Branch.xpi

[PseudoDistant]

Install Greasemonkey and write a script for the problematic site. Embed the menu directly into the website page.
This will make things easier for you.

https://github.com/janekptacijarabaci/g ... es/latest/
Direct link:
https://github.com/janekptacijarabaci/g ... Branch.xpi

I think you misunderstand.
I'm not editing one site. I want to inject into any site that has Flash content and Ruffle. I feel like making a userscript for hundreds of websites would be a pain. Not to mention, I still want it to be toggleable, and automatic on page load when enabled. A userscript can't do that.
Another goal in mind is I want to experiment with XUL, I specifically want to use XUL.

[moonbat]

I actually kind of do need some Extension functionality, like detecting when the user switches tabs, and having a menu (albeit admittedly very basic). I've considered making a userscript, as I have past experience with both userscripts and userstyles, but I genuinely need an extension for what I'm trying to do.

Ok, I'll point you to a few places to start.
Tabbed browser
Interaction between privileged/non privileged pages
The pageModifier section from my PureURL extension. This shows you how to capture page load for a webpage and get hold of its document for DOM manipulation. See how pageModifier is initialized as well, you can search the file for that.

[PseudoDistant]

Ok, I'll point you to a few places to start.
Tabbed browser
Interaction between privileged/non privileged pages
The pageModifier section from my PureURL extension. This shows you how to capture page load for a webpage and get hold of its document for DOM manipulation. See how pageModifier is initialized as well, you can search the file for that.

Thank you!
So as it turns out, the issue I was having with the site script was completely irrelevant and unnecessary.
I was still thinking in JavaScript, ig. :/
While reading the page HTML, trying to figure out if I was doing something wrong, I found a funne HTML embed for Ruffle.

Upon finding this, and reading the src URL, I found an even more funne alternate path to the swf file.
With a bit of regex, I managed to get:

Code: Select all

gBrowser.contentDocument.getElementById("ruffle_embed").src.match(/https%3A%2F%2F(.+?)swf/)[0].replace(/%2F/g, "/").replace(/%3A/g, ":")

Which works perfectly, doesn't require any access to an unprivileged script, and should work on any site that uses Ruffle (with little tweaking).
While there's still a lot I need to learn about UXP in terms of addon development, this specific issue I'm having was completely due to my own illiteracy, and I apologize.

[moonbat]

While there's still a lot I need to learn about UXP in terms of addon development, this specific issue I'm having was completely due to my own illiteracy, and I apologize.

We all started at the beginning at some point, so don't worry about it
What's important is that you took your own efforts instead of expecting to be spoonfed and all you needed was to be set on the right path of documentation.
On that note if you're interested in further extension development, I'd recommend sticking to XUL (and not the later 'restartless' technologies), and use the XUL School Tutorial that shows you the basic steps and structure of an extension. After that you can dive into specific sections, be it monitoring or modifying webpages as in this case, or browser internals. You'll find that there are XPCOM Interfaces to almost every component of the browser, and a Services.jsm module to gain access to some important ones.

[PseudoDistant]

We all started at the beginning at some point, so don't worry about it
What's important is that you took your own efforts instead of expecting to be spoonfed and all you needed was to be set on the right path of documentation.
On that note if you're interested in further extension development, I'd recommend sticking to XUL (and not the later 'restartless' technologies), and use the XUL School Tutorial that shows you the basic steps and structure of an extension. After that you can dive into specific sections, be it monitoring or modifying webpages as in this case, or browser internals. You'll find that there are XPCOM Interfaces to almost every component of the browser, and a Services.jsm module to gain access to some important ones.

Yea, I don't like guides that tell you exactly what to do for specific applications, which is why I tried to avoid specifics until prompted. I want to understand the tech, not just know how to type Ctrl + C.
I kinda want to also eventually port CustomTube, as YouTube's abysmal modern layout is seriously the only thing keeping me from using Pale Moon or Basilisk as my daily driver.
Everything else I do works fine, but YouTube's modern layout is an eyesore, which is why on Firefox I normally use this.
https://addons.mozilla.org/en-US/firefo ... ustomtube/
If I get good enough with XUL extensions, I may be able to port it myself, and enjoy a YouTube UI that isn't trash.
Thank you again, btw.

[moonbat]

One thing though, if you're making an extension to fix a website, that too a Google owned one - be prepared for constant breakage. The Pale Moon addons site discourages submitting addons for websites for this reason apart from the licensing issue (you may be violating a site's TOS by using an extension to access it instead of via the regular webpage), many such site specific addons get abandoned soon because the author couldn't keep up with changes. You may be making it for personal use only, but keep this in mind as well.

Google is notorious for inventing the 'change for its own sake' culture of constant breaking updates and rolling releases that everyone including Windows has copied.

[PseudoDistant]

One thing though, if you're making an extension to fix a website, that too a Google owned one - be prepared for constant breakage.

Yea, I've seen. I used to maintain a userscript that brought back the Cosmic Panda layout a few years back. I kept up with it for two years, then Google broke literally everything.
That's why I'll instead be porting someone else's YouTube work.
Hell, depending on exactly what CustomTube does I might even be able to automate it with some metaprogramming funnes.

I remember, when I was a kid, there was this extension called "IETab" that had the option to open a page using Internet Explorer through Firefox, because a lot of sites were targeting IE due to it's market dominance at the time.
Is something like that still possible on UXP? I wouldn't be against trying to make a ChromeTab with the Chromium Embedded Framework. (Tho I know I'll likely die in the process.)

[vannilla]

Is something like that still possible on UXP?

From a purely technological point of view, yes it is.
Just write a binary XPCOM component to bridge the CEF, expose it as a binding for XUL and integrate the chrome (heh) with it.
In practice? It's basically voodoo, the kind you'd see on Monkey Island.

[PseudoDistant]

From a purely technological point of view, yes it is.
Just write a binary XPCOM component to bridge the CEF, expose it as a binding for XUL and integrate the chrome (heh) with it.
In practice? It's basically voodoo, the kind you'd see on Monkey Island.

How would one go about writing an XPCOM binary these days?
Are the tools still available? Is there a plugin for Eclipse, CLion, or VS Code?

[vannilla]

How would one go about writing an XPCOM binary these days?
Are the tools still available? Is there a plugin for Eclipse, CLion, or VS Code?

It's mostly C++, anything able to colorize its keywords is fine. To actually compile it you need to use special tools anyway, you are better off writing a Makefile and configure your editor/IDE/whatever to execute the Makefile.

[PseudoDistant]

It's mostly C++, anything able to colorize its keywords is fine. To actually compile it you need to use special tools anyway, you are better off writing a Makefile and configure your editor/IDE/whatever to execute the Makefile.

What libraries do I need?
Perusing the archives, I've found references to an XULRunner SDK, but I can't seem to find a download for it.. Are there any decent examples of XPCOM components, as well?

[PseudoDistant]

I found the SDK for Firefox 52, but I'm still struggling with actually using it. It seems Firefox 52's WebIDE no longer works, and every guide I've found on how to set it up in VS Code refers to really old versions of VS Code and no longer even work with current builds.