timezone plugin broken in IE11 (unsupported method)

[joshgeller]

Describe the bug
Intl.DateTimeFormat.formatToParts is not supported in IE11. This method is used by the timezone plugin here. Using the plugin in IE11 results in a runtime error.

Expected behavior
IE11 support. Documentation states "Currently the following browsers are used for the ci system: Chrome on Windows XP, IE 8, 9, and 10 on Windows 7, IE 11 on Windows 10, latest Firefox on Linux, and latest Safari on OSX 10.8 and 10.11."

Information

• Day.js Version 1..10.4
• OS: Windows 10
• Browser IE11
• Time zone: GMT-07:00 DST (Pacific Daylight Time)

[lfzs]

+1

[MattStaudinger]

I also ran into this issue. I tried the recommended polyfill from your docs, but this polyfill does not support formatToParts as stated here . From what I searched, there does not seem to be a polyfill for formatToParts yet. So I am wondering, if timezones are not supported for IE11 in dayjs or if I am missing something on how to polyfill formatToParts?

[MattStaudinger]

I now found a way to make this work. There were 2 things that I had to change:

1. I used the syntax dayjs.tz("2014-06-01 12:00", "America/New_York") which is using formatToParts under the hood. When I used dayjs("2014-06-01 12:00").tz("America/New_York") IE 11 doesn't complain anymore.

2. After that change IE 11 then output Invalid Date for any kind of timezone. This had to do with an issue explained in here. I implemented the polyfill suggested there and it worked.

It obviously feels a little hacky, but solves the problem. So I think it would be good if the documentation was updated and going a little more into detail how timezones can be made to work in IE 11.

[imhuynq]

+1

[javier-garcia-meteologica]

@MattStaudinger

I used the syntax dayjs.tz("2014-06-01 12:00", "America/New_York") which is using formatToParts under the hood. When I used dayjs("2014-06-01 12:00").tz("America/New_York") IE 11 doesn't complain anymore

These expressions have different meanings and produce different results, they should not be used interchangeably.

$ dayjs.tz("2014-06-01 12:00", "America/New_York").toISOString();
"2014-06-01T16:00:00.000Z"
$ dayjs("2014-06-01 12:00").tz("America/New_York").toISOString();
"2014-06-01T09:00:00.000Z"

This comment formatjs/formatjs#2529 (comment) explains how to polyfill Intl.DateTimeFormat properly.

import '@formatjs/intl-getcanonicallocales/polyfill';
import '@formatjs/intl-locale/polyfill';

import '@formatjs/intl-pluralrules/polyfill'
import '@formatjs/intl-pluralrules/locale-data/en' // locale-data for en

import '@formatjs/intl-numberformat/polyfill'
import '@formatjs/intl-numberformat/locale-data/en' // locale-data for en

import '@formatjs/intl-datetimeformat/polyfill'
import '@formatjs/intl-datetimeformat/locale-data/en' // locale-data for en
import '@formatjs/intl-datetimeformat/add-all-tz' // Add ALL tz data