I need access to the bootstrap entry points but also want access to the nice features that the Firefox Add-on SDK provides.
What's the best way to go about this?
After more investigation, the most elegant option seems to be the use of the experimental --templatedir=TEMPLATEDIR option that appears perfectly suited for doing precisely this (using a custom bootstrap.js file). This allows me to hook into those install/uninstall functions (if necessary) and use the rest of the SDK like normal.
Edit: someone asked me to give a clarification on how cfx is to be used with --templatedir.
Copy somewhere the directory called app-extension that contains the bootstrap.js, application.ini, and install.rdf files in it from the downloaded SDK.
Run your cfx xpi command like regular but add --templatedir=path/to/cloned/directory to the options.
You can use the Loader. This is the same thing that the SDK uses and you can actually set it up to be able to load SDK modules. Although IIRC this isn't well documented and there are some subtle details on how you need to do the setup or some SDK modules will not work correctly.
I suggest you read the linked documentation above and then use the SDK bootstrap.js as a base and strip it down as needed (e.g. remove all those fancy test stuff).
Also, to give another example, #erikvold (who works or worked on the SDK team as well) implemented minimal support for internally loading (some) SDK modules in Scriptish.
Related
Recently after the latest chrome update version 42, NPAPI support was disabled by default in Chrome thus effectively dropping support for Silverlight, Java, Facebook Video and other similar NPAPI based plugins.As per the chromium developer docs we can temporarily re-enable NPAPI by overriding via
chrome://flags/#enable-npapi(Enable NPAPI). However this option will be there only till Sept 2015.They have also mentioned that this wait is for mission-critical plugins to make transition.
We are using an enterprise plugin and we have some dependency on chrome , to make the transition we have to re-implement the plugin.
What are the things we need to do for re-implementing and make it work for chrome, guys please shade some light on this.
It really depends on what exactly your plugin needs to do; FireBreath 2 is nearly ready and supports plugins in Chrome via native messaging, however:
For Chrome you must install an extension as well as installing the binary (the binary installer can trigger the extension install, but must be confirmed by the user)
There is no direct drawing model, so you'd need to use a javascript layer to draw and access it from the plugin
All APIs of FireBreath 2 plugins are now asynchronous.
FireBreath 2 is not quite ready, though you're welcome to help us get it ready.
Other options include Native Client, which has much better drawing support but is sandboxed, and Emscripten which allows you to compile C++ to javascript and is shockingly fast, but is also of course sandboxed. You could also write your own native messaging host to do what you need.
As #smorgan says, there is no one solution that is a drop-in replacement.
There is no general-purpose replacement that can do everything NPAPI plugins could do, so without knowing what your plugin does there's no way to answer that question.
You should look at the last section of the deprecation guide, and see if your plugin fits into one of the categories there. If not, you should post a specific question about what you want to accomplish.
I recently wrote something in typescript. I used the Set data structure like this
var myset = new Set<string>();
I didn't need to include any extra libraries in Typescript and it just works. However, I found out that this only works in IE, as chrome cannot resolve Set data type. Also, when I publish I didn't see anything like lib.d.ts being included in the folder.
How does this work. I am running into some trouble researching as the word "set" has too many meanings and I can't get any useful search result.
Adding to the other answer, Set is part of the ECMAScript 6 collections API that is not enabled by default in Chrome. You can enable it by checking the "Enable Experimental JavaScript" box in the Chrome chrome://flags page, though you're probably better off just not using Set yet since very few people will have this enabled. It will be more widespread in browsers in a year or two, most likely.
See also https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set
The lib.d.ts file is a Typescript Definition file, and is only needed by the compiler to provide information about external libraries. The file does not contain any browser executable code, only interface and method information for the compiler, therefore it is not needed by the browser, so you will not see it load in the page, or in the published folder contents.
See this link for information on typescript definitions.
Now as far as your problem with the library, this is most likely a problem with the code itself. What library contains this Set object? Is it a third party library, or is it a library written by you?
I just bought WebStorm 5 and so far have been really enjoying its Inspection features. One hitch I've run in to when developing my Chrome extension is that it doesn't recognize the chrome variable:
Is there a way I can add the chrome variable to the Inspector so that it can autocomplete as I type? I'm guessing I would need to add Chromium as an External Library but I'm unsure where to start.
First Time Setup
Open the Settings dialog (File > Settings)
Click Languages & Frameworks > Javascript > Libraries
Click Download
Make sure TypeScript community stubs is selected
Select chrome from the list (you can find it quickly by just typing chrome)
Click Download and Install
Click OK to close the Settings dialog.
Steps 2-6 illustrated below:
In Subsequent Projects
In any subsequent project, you just:
Open the Settings dialog again (File > Settings)
Click Languages & Frameworks > Javascript > Libraries again
Check chrome-DefinitelyTyped
Click OK to close the dialog.
Steps 2-4 shown below:
UPDATE 2:
It's now supported out of the box, see the complete answer below.
UPDATE:
There is a more complete stub file that can be added as a library to get code completion. It's a part of the Closure Compiler project. Download chrome_extensions.js.
See also the feature request for WebStorm to add this library automatically from the IDE.
You need to get the JavaScript library for the Chrome API somewhere, or use a stub to get basic completion.
Library or a stub can be configured in WebStorm.
I found the JSON files with the Extension API. One can write a script that will build JS stubs from these JSON files, the stubs can look like the basic version linked on GitHub above, but with the automatic generation they will contain almost complete API and JSDoc comments so that documentation like here can be viewed directly in the IDE.
JSON => JavaScript object stubs mapping is pretty straightforward in this case and writing this kind of converter should not take more than a day (or several hours for the skilled coder).
If someone goes ahead and implements it, please post the link to the results here.
WebStorm should one day accept json definitions directly to enable autocomplete for the functions defined. Meanwhile, you can use the program at https://github.com/QuickrWorld/jsgen to convert the json files to js to enable auto-complete for the chrome extension APIs.
For writing AppScript, functions and classes such as DriveApp, SpreadsheetApp, there is a plugin in WebStorm or Intellij called google-app-script.
The installation method is the same as above. On the other hand, you should mark or open the .gs file as JavaScript. (July 2017)
I would like to be able to add custom snippets of javascript to any site that matches a regex. This is mostly because of sites that I use daily because of specialized content, but which have a poor design. I want to be able to do something like:
Visit site See that sidebar overwrites content
Whip out developer tools, find div id for sidebar
Edit a snippet of javascript which is executed on document.ready for this domain:
$('#sidebar-right').remove();
A bit of searching for user scripts tells me that I need to be writing a Chrome extension, which seems unfortunate and overkill. Is there not an easier way, or an extension which is nothing but a javascript editor that assigns snippets to domains? I'd really like to be able to edit in Chrome itself, or at least have a file that I can just leave open in MacVim all the time. An extension requires unloading/installing to update as far as I can tell.
If I just had one big javascript file, that would be fine. I'd just wrap my customizations in domain checks.
Bonus love if I can write in CoffeeScript.
The answer is to use the Tampermonkey chrome extension.
https://chrome.google.com/webstore/detail/dhdgffkkebhmkfjojejmpbldmpobfkfo
Why not dotjs http://defunkt.io/dotjs/ ? It's local, you can version it with git, you can easily take it to another computer...
Another alternative that neatly solves the problem is Custom JavaScript for websites. You just need to install the extension, which takes around 2 seconds, and then you can immediately start typing your custom JavaScript for the specified website.
The extension automatically recognizes the current website, so all you need to do is write your code and click on Save. You can also easily import jQuery or your external scripts for convenience.
Custom JavaScript for Websites 2 is an alternative to Custom JavaScript for Websites, with some bug fixes and sync scripts across devices feature.
Snippets are available directly in Chrome Devtools
https://developers.google.com/web/tools/chrome-devtools/javascript/snippets
Witchcraft is another Google Chrome extension for loading custom Javascript and CSS, and it is supposedly for more avanced users. The older dotjs project repository lists Witchcraft as its successor.
What you're looking for is Greasemonkey. But wait, Greasemonkey is for Firefox only, right? Turns out, you can install Greasemonkey user-scripts as native Chrome add-ons. Just go to userscripts.org and hit the Install button on one of them, and Chrome will automatically convert it into a native add-on. Then, write your own and install it using Chrome.
Note: This only works in Chrome 4.0.
Anyone know where is some usable XPJS, or XPCOM in JS, documentation for recent versions of Firefox/Gecko? And sample code/ tutorials would be great too.
I need to write my own Component, but without .IDL (no C++ compiled interface), so I could access it via
Components.classes['#com.mareksebera/compname;1']
.getService().wrappedJSObject;
or this way is not supported anymore? I can't use
Components.classes['#com.mareksebera/compname;1']
.createInstance(Components.interfaces.nsICompName);
Because of missing compiled interface nsICompName
And yes, I know that NSGetModule is deprecated, and I use NSGetFactory and XPCOMUtils.jsm
I know these, but those are not usable with up to date browsers versions
https://developer.mozilla.org/en/Creating_Custom_Firefox_Extensions_with_the_Mozilla_Build_System
https://developer.mozilla.org/en/Using_XPCOM_in_JavaScript_without_leaking
https://developer.mozilla.org/en/how_to_build_an_xpcom_component_in_javascript
The third link you mentioned is pretty good. Another way to get examples though is to actually download the Mozilla source code and look in the /tests subdirectories. There are some examples there of javascript created XPCOM objects.
One example that comes to mind can be found at:
<mozilla-central>\content\xtf\test\unit
But there are a ton of examples throughout the codebase.
If you prefer you can also browse the code online via mxr.