Chrome timeZone option to Date.toLocaleString()

Matt Johnson-Pint picture Matt Johnson-Pint · Jul 4, 2013 · Viewed 44.3k times · Source

I have recently discovered that there is a new extension to JavaScript. This adds several features to the Date object in the toLocaleString, toLocaleDateString and toLocaleTimeString functions. Reference here.

I am particularly interested in the timeZone option, that supports IANA/Olson time zones, such as America/New_York or Europe/London. This is currently only supported in Google Chrome.

Previous advice was that to work in JavaScript with any other time zone than UTC or your own local time zone, one had to use a library. But now, it appears that this is starting to be incorporated directly into the browser. So now you can do this:

new Date().toLocaleString("en-US", {timeZone: "America/New_York"})

// output: "7/4/2013 5:15:45 PM"

Or:

new Date().toLocaleString("en-NZ", {timeZone: "Pacific/Chatham",
                                    timeZoneName: "long"})

// output:  "7/5/2013 9:59:52 AM GMT+12:45"

Or:

new Date().toLocaleString("en-GB", {timeZone: "Europe/London",
                                    timeZoneName: "short"})

// output:  "4/7/2013 22:18:57 United Kingdom Time"
// (strange time zone name, but ok)

This is very cool, but I have a few questions:

  • Is this part of a new standard? Perhaps buried somewhere in ECMAScript 6? Or is it just something custom to Chrome?
  • Why just Google Chrome? Is it supported anywhere else? Are there plans to supported it anywhere else?
  • I checked node.js, which uses Chrome's JavaScript runtime, but it doesn't work there. Why not?
  • Is the time zone data accessible in any other way than the functions I listed? If only available when formatting strings, then doing any calculations based on the results may be difficult.
  • This is focused on output, but how would I use it for input? Is there a way to pass the time zone in the constructor to the Date object? I tried the following:

    // parsing it with a date and time
    new Date("2013-01-01 12:34:56 America/New_York")
    
    // passing it as a named option
    new Date(2013,0,1,12,34,56,{timeZone:"America/New_York"})
    

    Neither worked. I couldn't find anything in the specs, so I don't think this exists (yet), but please tell me if I am wrong.

  • The issue described in this post, created by a flaw in the ECMAScript 5 spec, still affects the output, even when the correct data is in the TZDB. How is it that both old and new implementations are coexisting? One would think it would be all the old way, or all the new way. For example, with my computer's time zone set to US Eastern Time:

    new Date(2004,10,7,0,0).toLocaleString("en-US",{timeZone:"America/New_York"})
    

    returns "11/6/2004 11:00:00 PM". It should return midnight, since I started at midnight and my local time zone matches the output time zone. But it places the provided input date at the wrong UTC point due to the ES5 issue.

  • Can I expect that as IANA releases updates to the TZDB that Google will push Chrome updates that contain the changes?

Answer

Esailija picture Esailija · Jul 5, 2013

update

There is pretty extensive write-up about the API here


Is this part of a new standard? Perhaps buried somewhere in ECMAScript 6? Or is it just something custom to Chrome?

Yes, these are part of the ECMAScript Internationalization API. It is implemented separate from ECMAScript, but the requirement of implementing ECMAScript Internationalization API is to first have correct implementation of ECMAScript 5.1

Why just Google Chrome? Is it supported anywhere else? Are there plans to supported it anywhere else?

For the recent years, Google Chrome has mostly been first to implement new features. Mozilla is more conservative, still for example discussing whether to implement the download attribute of a elements. It is now available in IE11 Beta and Opera too. It will be available in Firefox 25.

I checked node.js, which uses Chrome's JavaScript runtime, but it doesn't work there. Why not?

node.js just uses the same engine, which is a separate project from the Google Chrome browser. The engine just implements Ecmascript 5.1. This is an extension node.js would have to implement separately right now. It will become available in V8 in Q3 so probably a bit after that you can use it in node.js.

This is focused on output, but how would I use it for input? Is there a way to pass the time zone in the constructor to the Date object? I tried the following:

There is nothing about inputting dates in the specification. I personally cannot see how this would be useful, you are doing it wrong if you are not transmitting UTC timestamps because something like "2013-01-01 12:34:56 America/New_York" is ambiguous during transitions from DST to standard time.

The issue described in this post, created by a flaw in the ECMAScript 5 spec, still affects the output, even when the correct data is in the TZDB.

This is input issue, not output. Again, constructing a date with local timezone that you cannot influence or detect is doing it wrong. Use the timestamp constructor overload or Date.UTC.

Can I expect that as IANA releases updates to the TZDB that Google will push Chrome updates that contain the changes?

Nothing in the spec but I think it will be reasonable to expect that the rules are not too much behind.