We're trying to detect usage of global variables in our js code by using a sonar analysis. It seems that this rule was present in old versions of the javascript plugin, but not anymore (we're using version 1.2 of the plugin).
Are we doing something wrong ? Or is there a way to use XPath to mimic this rule ?
Thanks in advance
Previous version of the Sonar Javascript plugin was based on JSLint, and JSLint has a check for global variables. However, in the newest versions of the Sonar Javascript plugin, we removed JSLint and implemented our own parser and rules. This is why you don't get violations on this now.
Currently, we haven't implemented this rule but it's in our backlog (see http://jira.codehaus.org/browse/SONARPLUGINS-1821). Feel free to vote for it to push it up to the top of the backlog!
I'm not familiar with Sonar, but you can detect globals using this nifty little bookmarklet; or you could use the source code to work the results into your testing or CI framework, etc, etc.
Related
I am very happy with Eclipse and don't want to change my IDE, but find the pre-bundled Eclipse plugin for JavaScript too difficult to work with.
Too many of the features that I got used to developing Java (not JavaScript) in Eclipse seem to be missing or incomplete, such as an intelligent code analysis, smart refactorings, a truly language-related (not full-text) reference search, class inheritance trees, etc.
Any suggestions for alternative Eclipse plugins for JavaScript development?
Admittedly, it is a lot more difficult to analyze JavaScript code (compared to Java) not only for a plugin but also for any human programmer, because JavaScript comes with fewer structural elements, and because there are so many different ways to do common things like inheritance or modularization. But there's got to be something, right?
As Nodeclipse lead, I am always looking for what is available in Eclipse ecosystem.
JavaScript support is Eclipse JSDT project.
It gives Editor, and JSDoc support.
For ES5 support, JSDT validation is to be disabled and JSHint-Eclipse used.
Also there is new Tern-IDE plugins, that gives hints and go to definition by using Tern.js.
The same author leads AngularJS plugin
All mention plugins can be got via Enide Studio 2014 (installed as plugins or downloaded as stand-alone product).
Nodeclipse site has even more links,
and I am inviting to collaborate on the JavaScript tools on GitHub
There are also JSON Editor and Json Tools.
Unfortunately VJET is no longer continued as there is no backing company now.
All effort are community driven. The simplest contribution is reporting bug or taking own issue to research and share.
Any suggestions for alternative Eclipse plugins for JavaScript development?
No alternative plugins, just get more of them.
The VJET plugin seems to provide better JavaScript support, although I haven't tested it very extensively.
http://eclipse.org/vjet/
For necessary code hygiene I recommend to use JSHint (a sane version of JSLint).
http://marketplace.eclipse.org/content/jshint-eclipse
Both are installable through the built-in Eclipse Marketplace.
The popular Aptana IDE, which is based on Eclipse, is also available as plugin, but I haven't tested it as plugin.
http://www.aptana.com/products/studio3/download
My personal opinion: Eclipse has outdated syntax validators (no ECMAScript 5 support) and non of the plugins can fix that. The problem is known for years (Bug Report), but nothing is done about it. Code completion seems to be a lot better in the WebStorm IDE or Sublime Text with certain plugins. Right now, I'm quite happy using Eclipse for my backend Java stuff and WebStorm for the frontend code for the same project.
A. In the Eclipse world...in my opinion... the best JavaScript support is currently given by Eclipse Orion, a web based variant of Eclipse:
https://orionhub.org
Orion applies tern.js to get JavaScript features like highlighting and completion:
Eclipse orion code completion
The JavaScript library tern.js seems to be up to date:
https://github.com/ternjs/tern
And it is applied by several Source Code Editor plugins:
https://ternjs.net/#plugins
B. On the other hand, all JavaScript plugins for Eclipse seem to be outdated.
See for example
http://www.eclipse.org/webtools/development/news/main.php (last updated 2016)
The Eclipse Plugin for tern.js seems to be out of date, too:
https://marketplace.eclipse.org/content/tern-eclipse-ide
I was not able to install it on the current Eclipse version Photon.
Also see https://github.com/angelozerr/tern.java/issues/463
C. If you are open for a commercial JavaScript editor, try to use WebStorm, als already suggested by Tilman.
If there is a good Eclipse based JavaScript solution, that I am not aware of and that is able to compete with the features of WebStorm, please let me know.
I think that Visual Studio's biggest let down is the Javascript editor. I have been told to use Aptana as an editor for my javascript files, but I would prefer to stick with visual studio if possible.
I have read other similar plugin posts, but none focus specifically on Javascript.
VS2010 may offer some improvements, but will they be up to Apatana standards? I have briefly tested the beta, but I'm not overly impressed.
Is there anything out there that will bring Javascript closer to c# development? Considering the wide spread use of Javascript I think there must be something....... I hope! :)
Many thanks in advance... this is something that has always bugged me!
There's a couple recent plugins that may be helpful :
From Microsoft :
JScript Editor Extensions
Brace Matching
Outlining / Cold-folding
Current Word Highlighting
IntelliSense Doc-Comments Support
JSEnhancements
Outlining and matching braces highlighting
(I wouldn't think installing both of these is a good idea - and the Microsoft plugin has more features so try that one first)
VS is a pretty good IDE (especially when coupled with Resharper) but not so hot with Javascript. The debugger is good and there's the JSLint plugin but other than that I'm not sure. Aptana (based on Eclipse) is an excellent javascript IDE but it doesn't like it much when the javascript is embedded in aspx files (unless they updated the support recently). So far I'm not sure there's an ideal .net platform IDE for both client and server side stuff just yet.
Update: Resharper 6 added pretty good JavaScript support - so now I'd recommend that combination if you're doing a lot of debugging across client and server at the same time. If you're focussing on pure client code then I find WebStorm to be an excellent JavaScript/HTML IDE - even better than Aptana.
I'd really like to recommend Webstorm. It does not! treat your JS as text files.
Its a full blown JS editor and has become my favourite JS editor working in parallel with VS to handle my server side stuff.
WS has actual object intellisense across JS files. That means when I press . (dot) it shows me the functions on that objects, even if its located physically in another file.
It will recognize my objects (or their type if you will) created in other JS files referred to in the file I'm working on.
I have 'Find usages' on JS functions
I have 'find all references' on JS object / function / class / variable or whatever you want to search on. In the end its all objects but Webstorm knows this.
If I change the short/cut to F12, I can press F12 on my function call and it will jump to the implementation of that JS functon. Even if its located in another file.
Ofc. you have code folding and colouring, extract method and other neat code re factoring, overview creating tools.
Oh. And by the way.
I'd like to kill off a rumour going around in the cloud on forums I come across from time to time, looking for better ways to handle JS.
reSharper DO NOT SUPPORT JAVASCRIPT! A little piece of me dies every time I read some guy repeating what he saw on the reSharper site. It may have a some poor intellisense and some low level syntax check, but that has nothing to do with support.
Notepad++ supports JS better than VS in my opinion.
Münster
Don't forget to grab Chirpy to handle minifying your scripts in VS.
If you use Visual Studio, add the
/// <reference path="myOtherJsFile.js" />
directive at top of your js files and install Web Essentials you get pretty decent (but not perfect) intellisense, go to definition by using F12 and find all references (sort of..) by using SHIFT+F12
I just spent some time debugging a problem that boiled down to forgetting to use the var keyword in front of a new variable identifier, so Javascript was automatically creating that variable in the global scope. Is there any way to prevent this, or change the default behavior, without using a validator like JSLint?
Running a validator in between writing and executing Javascript code seems like a poor excuse for compiling, which is the step I'd usually rely on to catch this sort of thing.
I'm guessing the answer is a "no," so I'm looking into a JSLint Eclipse plugin as I post this.
ES5 strict mode prevents automatic creation of global variables, but it's probably going to be a year before there are any shipping browsers that recognise strict mode, so JSLint is probably your best bet until then :-/
Check this handy bookmarklet created by Remy Sharp, you can use it to check whether any variables have slipped out to the global namespace.
Not that I know of -- JS developers have historically been adverse to adding "seat belts" to the core language, so they've been implemented in external tools like JSLint instead. You might consider adding JSLint to your build/test process via it's Rhino version, and make the test suite fail if JSLint reports errors.
The answer is indeed no - but you could use the Eclipse plugin as you said, which can as far as I know run when saving etc., so it won't require additional steps.
IntelliJ IDEA is also able to spot undeclared variables. IntelliJ does it real-time as you type and can also analyze your codebase jslint-style. Probably some other alternatives too.
I made a bookmarklet some time ago to inspect and detect global variables.
(source: thinkweb2.com)
It has some additional features (like filtering out Prototype.js or Google Analytics properties) too.
Install Firebug, and enable it on your site. It will complain each time you create a global without var, as well as some other situations which you might or might not want to catch.
You can also do this using the about:config option javascript.options.strict, but since that's global it'll affect all the other sites you browse too.
Has anyone compiled jQuery against Google's newly-released Closure compiler?
There has been reported huge savings in code size. I'm curious what the benefit is if jQuery was compiled with it.
John Resig reported a bug on recursive functions when he attempted to compile a nightly of jQuery 1.4, so there are a few kinks to be worked out. I wouldn't use a jQuery compiled with Closure Compiler without making sure it passes the jQuery testbed.
http://code.google.com/p/closure-compiler/issues/detail?id=1&can=1#c2
I tried with jQuery jQuery 1.3.2
jQuery-1.3.2.min.js 57254 Bytes
jQuery closure compiler 49730 Bytes
-----------------------------------
Reduced by 7524 Bytes
Saved 13.31% off the original size
Saved 10.87% off the gzipped size
Gain of ~7KB
But it also reports 15 Warnings and I didn't test if it still works
The closure compiler eliminates any code that you don't actually use. The typical web page will only use a small fraction of jQuery functions, so the most benefit will come from compiling your code together with the full version of jQuery.
With ADVANCED_OPTIMIZATIONS turned off:
jquery-1.3.2.min.js: 57254 bytes
jquery-1.3.2.closure.js 55346 bytes (-3.4%)
jquery-1.3.2.min.js.gz: 19680 bytes
jquery-1.3.2.closure.js.gz: 18666 bytes (-5.2%)
With ADVANCED_OPTIMIZATIONS turned on: it doesn't work unmodified. With ADVANCED_OPTIMIZATIONS turned on and everything I can find to export exported... it still doesn't quite work, and the code is already up to 53466 bytes again (and 18785 gzipped, which is more than the gzipped closured code without ADVANCED_OPTIMIZATIONS) so it doesn't look like a winning proposition.
As of jQuery 1.4, Google's Closure Compiler is used as the default minification technique for jQuery releases. However, jQuery only uses the SIMPLE_OPTIMIZATIONS settings. The jQuery team has no plans to support ADVANCED_OPTIMIZATIONS.
Out of curiosity, I put together a SlickSpeed test of the latest Prototype and jQuery libs, shrunk with YUI and Closure. You can run the tests here.
As others have noted, compiling with ADVANCED_OPT does not work but if someone wants to do the work, I'll be happy to add the results to the SlickSpeed test.
Doesn't Closure just minimize and renames vars? jQuery already has a .min version. Minifying with closure again will probably be minimally helpful and potentially dangerous.
Edit: I just did it.
Compilation was a success!
Original Size: 55.91KB (19.28KB gzipped)
Compiled Size: 54.05KB (18.28KB gzipped)
Saved 3.34% off the original size (5.18% off the gzipped size)
This is on top of the already mined version. There's a demo here: http://closure-compiler.appspot.com/home
I tried with their online compiler, it works well.
I used Closure (with ADVANCED_OPTIMIZATIONS) to compress the javascript code for a single-page site that I host and saw a significant size savings over the YUI Compressor. So I started looking into shrinking jQuery for that site as well, since it certainly doesn't use the entier jQuery library.
I get warnings every time I run jQuery through the compiler, mostly pointing out portions of the code that are not used. Even still, the compiled code doesn't work. The primary issue I see is that things aren't being exported properly by the compiler. I was able to easily export functions from my own code by attaching them to the window object, but I have not yet been able to do this yet with jQuery.
The good news is that John Resig is already experimenting with Closure. I suspect that we'll see new releases of both that are compatible in the near future.
jQuery is not compatible (yet) with the Closure Compiler in advanced mode. I agree it would be a very good thing to make it compatible, because its method-chaining syntax lends very readily to prototype virtualization for much improved execution speed.
In fact, among the popular JavaScript libraries (other than Closure Library, that is), only the Dojo Toolkit is compatible with Closure Advanced mode.
http://dojo-toolkit.33424.n3.nabble.com/file/n2636749/Using_the_Dojo_Toolkit_with_the_Closure_Compiler.pdf?by-user=t
My team's current project involves re-writing retrieval libraries in JavaScript. We are basically looking for a setup which enables us to apply test-driven development methods.
So far we plan to use Vim to write the code, no fancy IDE. For generating output we would use Spidermonkey's shell environment. JSLint could serve as a moderate syntax checking tool.
The essential question remains: How do you develop JavaScript (browser-independent) programs?
If we are already on the right track, then maybe you can supply us with a few tips and tricks.
You can test your code in Spidermonkey or Rhino (an older JS interpreter in Java), but you won't really know which browsers it works in until you test your scripts in them!
I agree with the earlier poster, using a browser-independent library like jQuery is probably a good idea.
I have not used Spidermonkey, but I know Rhino has a good debugging GUI, allowing the usual: setting breakpoints, watches, and stepping through code.
Only testing you'll make your JavaScript code browser-independent.
If you have the chance to rewrite it all, you might consider jQuery.
It's essentially browser agnostic. Or at least it requires much less object sniffing than plain javascript.
Yes,I'm using the same environment to develop standalone JS apps (vim + SpiderMonkey). I only would add up, that I've made small in-browser IDE for reading/writing/launching JS scripts on the server-side. Sometimes it's very helpful. Also, I'm looking for using WXJavascript project, which seems to be very promising.