How to install my own firefox extension

Question

I am new to FF extensions development. I work on Windows OS. I am using web extensions. I started my first extension. I created a directory in My Documents which contains my extension files. The files are based on the example in: Your First WebExtension which are: manifest.json, icons/myicon.png, myextension.js. Like the example, all what the extension does is a border aroud mozilla page. This is the js code: document.body.style.border = "5px solid red";

When I come to installing the extension in my browser, I navigated to:about:debugging then I clicked in the Load Temprary Addon button and I selected the the .js file. I get this error: There was an error during installation: Extension is invalid. Can you point what the problem is?

Tachistoscope

See Install a personal firefox web extension permanently - Stack Overflow and its linked questions. _____________________________________________________________________________________________ Also: you can open the browser console (not developer console!) by pressing ctrl+shift+j (there's a GUI button in Firefox developer edition), there should be more info of the error there. – While

Answer 1

The problem was that extensions must be saved in specific directory. In winows, the directory is: C:\Users\"YourUser"\AppData\Roaming\Mozilla\Firefox\Profiles\"YourFireFoxProfile"\extensions After that, try the steps I mentioned in the original post and you should find the extension added.

Tachistoscope

While this might have solved whatever actual problem you had, extensions which are loaded as temporary, using about:debugging, do not need to be in any specific directory on your machine. Only when an extension is installed persistently is it placed in the extensions directory within the profile. While you can place it there manually (Firefox will ask you to confirm the installation), it will be copied there by Firefox using the normal installation methods. – Hunger

Answer 2

Most likely an error in the manifest.json file. Double-check that code; if it all looks good, try temporarily removing optional things from it, then removing-and-reloading your addon in the debugger until it works. Then you can narrow down what's up (hard to say exactly, without seeing your code). The most minor error in the JSON will result in the addon failing to load (such as an out-of-place bracket, etc).

See also: Anatomy of a WebExtension

Orangy

To add on that: you can see error log in the console. It's not always useful but in my case I could see that the error was in the loadManifestFromWebManifest function which helped me fix it. – Daredeviltry

Answer 3

Problem with my setup was incorrect use of content_scripts.matches, correct solution for a "match-all" is

"matches": ["*://*/"],

Attribution : https://discourse.mozilla.org/t/web-extensions-noob-getting-there-was-an-error-during-installation-extension-is-invalid/12828/3

Lucerne

Same kind of error for me: "matches": ["*://*.youtube.com/*"] is correct, but "matches": ["*://*youtube.com/*"] is incorrect. – Savdeep

Same here. I think that the main problem for extensions newcomers like us, is that we are trying to use regexp on "matches:" – Harp