How to check JavaScript version in web browser? - javascript

I want to check JavaScript Version in my web browser.
Is navigator Object return proper JavaScript version?
navigator.appVersion; /*Is it correct?*/
navigator.appCodeName;
navigator.appName;
Is there any way to detect exact JavaScript Version from Browser console or anything else?

Browsers don't give any real version, because they don't exactly support any one version. They support some (or most) features of some versions.
Any support declared for "JavaScript 1.x" is just a legacy hack for compatibility with Netscape.
Similarly, these navigator fields are useless on purpose. In the past they have been misused to block browsers so much, that the spec now recommends all browsers to lie and say they are Netscape 4.0.
On the web, in general, you should never check version of anything to decide whether it supports the features you need, because it's too easy to make an invalid assumption and break your code in some browser, including future ones you can't test now (e.g. a feature may not be related to the version you assume, or browsers may lie about versions they support in order to work around sites blocking them).
You should use feature detection instead.
You can detect presence of individual JavaScript features by running them and seeing if they work. If the new feature requires a new syntax, you can try running that syntax inside eval. See how it's done on: https://kangax.github.io/compat-table/es6/ (there's a (c) icon with detection code next to features when you expand the list).

Related

How to check the last available version of Chrome and Firefox using C# or JavaScript?

One of the requirements of one of my clients is to show a message to a user that's using an older version of Firefox, Chrome, IE or Safari. For the last two it's easy (IE 9+ and Safari 5+). But for Firefox and Chrome, the requirement is that the site supports the current and the previous version of each browser.
To get the clients browser and version is quite simple, but I need to know what is the last version of each browser. Is there any way of doing that?
Well, technically, all you need is a place that keeps track of what the latest version of each browser (Ideally with a web service).
A quick Googling I was able to find: http://www.webdevelopersnotes.com/articles/latest-browser-versions.php
It's not a web service, but you could simply parse that HTML and get the latest version of each browser. Alternatively, you could keep track yourself and manually update this information in your database.
You should only ever have to worry about IE when it comes to version enforcement. Exception being, of course, if you need a specific API that's just not available in previous versions of Chrome/Firefox, but in that case you'd look and enforce the API, not the browser version. Adding to that, if Chrome/Firefox don't have an API, chances are even the most bleeding edge version of IE won't either, so the point is moot. The fact is Firefox and Chrome, and in part Safari, are far ahead of IE when it comes to browser hosted capabilities that trying to enforce specific versions of the former would likely be a lot of wasted time and effort to yield nothing substantial.
The best I could find was this. It has an export option that allows to export in JSON, XML...
I would strongly suggest that you don't check the browser version, instead try doing feature detection using, say, Modernizr.
What features of your client's site depends on specific versions of each browser? If you use Modernizr you could perform a check on a feature, say some video stuff, and if the current browser does not support that feature, then display a message to the user suggesting they upgrade their browser.
Detecting browser versions via Javascript is very flakey at best.
The only reason I'd say you need this kind of verification is because your webpage has features only available to latest browsers. Instead of relying on version numbers, I suggest learning Modernizr.js for your website.
http://modernizr.com/
It can detect particular html5/css3 features individually.

Understanding Javascript versions

I wanted to ask a few questions about javascript:
1.Does each browser implement javascript by itself ? Or is their a common SDK\API or whatever ?
2.If each browser implement by itself, Is the javascript engine bounded to the browser version ?
I mean, can I have 2 different engines for the same browser version ?
3.Is there any standards all javascript engines must follow ? Does this standard define memory
allocation ? (Lets say, How I allocate a javascript string ?)
And last,
What are the names of implementation for each browser ? For example I understood FirFox uses an
implementation called "Rhino", Am I right ?
Thanks alot !
Michael
Yes, they implement JavaScript on they're own.
Yes, it is bound to the browser version. No, you can't have 2 different engines for the same browser version. You can though for different browser versions.
Yes, it is called EcmaScript. Most implementation follow it pretty good.
FireFox does not use Rhino. Mozilla developed it, but the implementation in FireFox is different. All browsers implement single-threaded JavaScript, while Rhino is not single-threaded.
Each browser does implement its own version of JS. Thus, why some browsers outperform others. They specification on what JS should do and how it should be done is based on the ECMAScript specification. The only case I've seen of having multiple engines (or versions of engines) is with IE's web dev toolbar, where you can "roll back" your IE version to test how previous versions react. I've found the JS engine to be pretty faithful when doing browser version tests.
Wiki has a nice write up on the different engines. http://en.wikipedia.org/wiki/JavaScript_engine#Mozilla
JavaScript is standardized through the ECMAScript specification which most browsers will adhere to.
However, not all features are implemented across all browsers and browser versions and some features have their own browser specific quirks.
You can find more details about ECMAScript and the versions browsers implement here:-
http://en.wikipedia.org/wiki/ECMAScript
You will not get two different JavaScript engines offered to you within the same browser (usually).

Is there an Android built-in browser developer guide? Where to look for JS engine differences?

as I am getting more and more into Android PhoneGap app development, I can see more and more nuances and little details between built-in Android browsers throughout the versions. I searched for some official or fan document, which would deal with these browser version differences. But I can't find anything useful.
It's a lot frustrating, because you have to test everything on all versions of Android emulator and if app grows big, it's A LOT of work to test all the features in all versions.
Everyone is excited about HTML5, I was too, but only to the point when I moved to doing the real thing. I realized that there is so many problems when dealing with different versions of Android behaving sometimes a lot differently.
If anyone has some good resource to share, I would be very happy. Thanks
EDIT: Added example of different behaviour betweeen Android browser versions ( but there is many of them):
This works in Android browser in 1.6, 2.2, 2.3 and 2.3.3. But it failes (application crashes or stops JS execution) in Android 2.1:
Object.keys(var).length
You asked a pretty general question. The general purpose answer is that any sort of cross browser development (even cross versions of the same browser) requires that you develop a familiarity with what features are safe across the targeted browsers, which features are not safe across the targeted browsers and which ones must be used only with careful testing or feature detection with fallback.
While one wouldn't exactly expect the type of difference you saw with the one example you referenced, it is clear that that is a fairly new feature in ECMAScript and it's not consistently implemented across normal browsers so I would put it in the category where it is not safe to assume that it works on all versions of Android, even if you've seen it some versions of Android. That means to me that you should only use it if you've explicitly tested that it's reliable in all the browser versions you are targeting or devise a feature test and only use it when you know it's present and reliable or develop a safer work-around.
As I think has been mentioned previously, this thread has a bunch of proposed work-arounds for the specific issue you mentioned.
I am not aware of any detailed written material that would document in advance for you the details of the differences between different Android browser versions. Since it's open source, there are probably developer checkin notes and some level of release notes, but that will probably be like looking for a needle in a haystack and may not even contain what you want. It is rare for any developers to produce such detailed information. We don't generally get that level of detail from any of the existing desktop browsers or iOS browsers and, even if you were on the development team itself, you probably would only see part of this info. I don't think you're going to find official documentation that covers what you want.
You're going to have to learn to treat is as more of an unknown and learn what areas are "safe", what areas require extensive testing before using and what areas are just too risky. Even when doing that, you'll find Android bugs in some version that trip you up. That's just the nature of building on someone else's platform. At least the Android set of browsers are a much simpler target than trying to target all desktop browsers from IE6 to IE9, Firefox 3 to 5, Safari 3 to 5, Opera 9 to 11, Chrome 9 to 12, all Android, all iOS and use HTML5 when available which is what I'm working on.
Once you've been through this wringer a couple times, you will realize that if the newer language/library feature carries any risk, you shouldn't use it at all unless it's absolutely central to what you're trying to accomplish and then you will have to test the hell out of it. If it's something like getting the length of the associative array which is just a programmer's convenience, then it's probably simpler to stick with a work-around that is guaranteed to be safe and just not spend your time dealing with any browser-support risk.
The only official documentation I am aware of is part of the Android developer documentation. If I were a betting man, I would bet that it only covers a subset of what you are seeking.
The general idea behind cross browser Javascript is inline feature testing (at least how I've come to accept it.) I don't know exactly what "features" you are specifically looking for but it's generally wise to test for the existence of a feature set then use it and have a fallback if that doesn't exist. (Even if the fallback is, "This site requires a browser that supports 'foo'")
Since you didn't give any examples, I'll pick on Ajax. It's always best to check for the existence of window.XMLHttpRequest, then act upon it. Of course, this is not performant if you are doing it for every instance of need so you could write a check procedure or a wrapper to accept your list of necessity let your wrapper cache/call the appropriate methods to perform that task.
Without examples of "features" that you are talking about being different from browser to browser though, it's hard to give any concrete advice on direction.

JavaScript DELETE statement. Query

I was just wondering if the DELETE statement is supported by all browsers e.g:
delete myObj;
I just want to make 100% sure if all browsers support this or not?
Also is there any browser or maybe mobile (cell) phones that do not?
Mozilla's Developer Center provides the following information:
Implemented in: JavaScript 1.2, NES3.0
ECMA Version: ECMA-262
So you can check your target browser against this for an idea of whether it's supported at all or not.
Extreme testing of JavaScript delete operator on different browsers seems to suggest that nearly all major browsers do support it, just not equally well. Furthermore, the author provides an extreme test page for you to experiment with your browser online at http://www.trilancer.com/extreme_delete.html
I would also consider reading the following question for more details on how to property use the delete operator:
Deleting Objects in Javascript
To directly answer your question, as far as I am aware, any browser that supports JavaScript supports delete. I checked and it existed in the specification for ECMAScript 1 (released in 1997) so it's been around for a while now.

What new browser features are available today?

It's the year 2009. Internet Explorer 8 has finally been released, and Firefox is coming up to 3.5. Many of the large browsers are starting to integrate features from CSS3 and HTML 5, or have been doing that for quite a while now. Still, I find myself developing web pages exactly the same way I did back in 2005.
A lot of progress has been made since then, and I think the reason that I haven't started taking advantage of these new possibilities is that it's so hard to know which of the new features that work in all major browsers. Since I'm mostly a backend developer I just don't have the time to keep up these developments anymore. Still, I feel like I'm missing out on a lot of cool stuff that actually would make my life a lot easier.
How can I quickly determine if a feature of CSS3 or HTML5 is supported by all major modern browsers?
Can I Use is a website which tracks browser support for current and upcoming web standards. Check it out if you would like to know whether or not a given feature is widely supported.
Font embedding through CSS, using #font-face. Webkit/Safari has been supporting it since version 3.1, Microsoft since IE4, Mozilla since Firefox 3.5 (browser support overview).
Also, the varied implementations of the Selectors API, which provides a browser-native CSS selector engine for use in DOM scripting.
For other examples, When Can I Use... seems to be a very good reference.
I would say display:table and a range of CSS2.1 selectors are the big wins for designers. display:table solves some unsolvable or difficult layouts like 100% height and inside borders without breaking semantics and using actual tables.
Multiple classes (.c1.c2)
I use min/max-width/height a lot.
Also working :hover and !important are awesome.
I would have liked to add SVG support to that list but naturally Microsoft messed that up.
BTW, big warning to those getting excited about HTML5 features. There is no official date for the adoption of this spec. It's even been implied it could take another 10 years (though I doubt that). The point is anything you do with HTML5 now is subject to breakage when the official spec does arrive and in the meantime you can expect plenty of browser inconsistencies, bugs and API changes (not to mention browsers that don't support the features at all).
Browser support for local storage should enable a bunch of new ideas now that some content can be saved on a user's machine.
Reference docs:
Mozilla Firefox
Internet Explorer

Categories

Resources