CODEWITHSUNDEEP
javascriptmomentjsmoment-timezone
user1756202
user1756202

Reputation: 63

moment timezone js returns wrong datetime

I am using Moment Timezone to get current datetime for Asia/Tokyo timezone.

The code is as following

var currentDateTime = new Date(moment().tz('Asia/Tokyo').format('YYYY-MM-DDTHH:mm:ss'))

Supposed that the current datetime for my local timezone is as following

Thu Jul 22 2021 19:49:47 GMT+0700 (Indochina Time)

I expected the current date for Asia/Tokyo timezone would be as following

Thu Jul 22 2021 21:49:47 GMT+0700 (Indochina Time)

In Chrome I got the expected datetime. But in Safari on my iPhone, I got the wrong datetime.

Fri Jul 23 2021 04:49:47 GMT+0700 (Indochina Time)

It seems the current datetime returned is the right current datetime plus 7 hours.

Here is my environment

iPhone : iPhone 6

iOS : 12.5.4

Upvotes: 0

Views: 1385

Answers (1)

samthecodingman
samthecodingman

Reputation: 26171

The problem you have is caused by the Date constructor parsing the time according to the local timezone (in Chrome) and UTC (on Safari?).

For the time given, this code

moment().tz('Asia/Tokyo').format('YYYY-MM-DDTHH:mm:ss')

returns

"2021-07-22T21:49:47"

You then pass this time into the Date constructor:

var currentDateTime = new Date("2021-07-22T21:49:47")

Because this string has no time zone information, it is assumed to be in the device's local timezone (Chrome) or UTC (Safari) which gives the wrong date object.

While you could inject the timezone into this string (using ZZ), you can build a Date object from the moment object using:

var currentDateTime = moment().tz('Asia/Tokyo').toDate()

but this is effectively the same as

var currentDateTime = new Date()

If the intended output is a string of the format:

"Thu Jul 22 2021 21:49:47 GMT+0900 (Japan Standard Time)"

the closest you could get is:

moment().tz('Asia/Tokyo').format('ddd MMM D YYYY, h:mm:ss a [GMT]ZZ (z)')
// Thu Jul 22 2021 21:49:47 GMT+0900 (JST)

Alternatively, there is also the localized "Month name, day of month, day of week, year, time" format:

moment().tz('Asia/Tokyo').format('llll (z)')
// In my locale, I get:
// Thu, Jul 22, 2021 9:49 PM (JST)

Take a look at the Moment display format documentation for more options.

Upvotes: 2

Related Questions