Intl.DateTimeFormat does not output separators on 2 digit month + day (IE 11)

Question

I have encountered a bug in Intl.DateTimeFormat MDN

Environment

Internet Explorer 11.0.6900.19080 on Windows 7

Bug

When only the "2-digit" option is used for month + day the function is not outputting any separators, be it / for en or . for de. This happens only in Internet Explorer on Windows 7. Internet Explorer 11 + Edge on Windows 10 is working. Not tested lower than 11.

Internet Explorer

Intl.DateTimeFormat('en', {month: "2-digit", day: "2-digit"}).format(new Date());
> "‎07‎ ‎25"

Intl.DateTimeFormat('en', {year: "numeric", month: "2-digit", day: "2-digit"}).format(new Date());
> "‎07‎/‎25‎/‎2018"

Chrome

Intl.DateTimeFormat('en', {month: "2-digit", day: "2-digit"}).format(new Date());
> "07/25"

Intl.DateTimeFormat('en', {year: "numeric", month: "2-digit", day: "2-digit"}).format(new Date());
> "07/25/2018"

Context

I have used react-intl when this error occurred and traced the error back to the native Intl.DateTimeFormat()

<FormattedDate
    value={new Date()}
    month="2-digit"
    day="2-digit"
/>

Hyyan Abo Fakher · Accepted Answer · 2018-07-25T09:38:29.000

3

According to caniuse.com DateTimeFormat full support was added to IE11 on released version oct 17 ,2013, so it might be that your Windows 7 has an older version, you can check this by clicking on the link beside the version number.

To fix your issue, you can

Update IE11 (I don't think it is a solution) this will work only for you
Add the separator manually according to your app supported languages

Intl.DateTimeFormat('en', {
    month: "2-digit",
    day: "2-digit"
  })
  .format(new Date()).split(" ").join("/");

Use the following polyfill to get full support

edited Jul 25 '18 at 09:38

answered Jul 25 '18 at 09:28

Hyyan Abo Fakher

3,497
3
21
35

I have a version from July 10, 2018 – Marvin Fischer Jul 25 '18 at 09:30
@MarvinFischer this version on windows 7? could please try the polyfill I have shared – Hyyan Abo Fakher Jul 25 '18 at 09:36
The polyfill works, but a polyfill is not the way I'd want to go for a feature that should be natively supported – Marvin Fischer Jul 25 '18 at 10:02
@MarvinFischer isn't this the purpose of polyfills ?!!!! a piece of code that provides the technology that you, the developer, expect the browser to provide natively. – Hyyan Abo Fakher Jul 25 '18 at 12:14
Yes in the case the browser does not already natively support it. But the browser I am using does indeed support this feature natively. Just seemingly failed at its integration – Marvin Fischer Jul 25 '18 at 13:17

Intl.DateTimeFormat does not output separators on 2 digit month + day (IE 11)

1 Answers1