Set usage isn't IE11-safe

[devnix]

Hi. I'm literally getting a Missing locale data for without more info, it's literally that message in IE11.

Tested code:

new Date().toLocaleString("es", {timeZone: "MADRID/EUROPE"});

Added dependencies:

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/add-all-tz' // Add ALL tz data

Is there something I'm missing from the docs? I've been banging my head on the keyboard for hours.

[longlho]

You have to add es locale data instead of en. Your timezone also isn't valid

[devnix]

@longlho Already tried importing @formatjs/intl-pluralrules/locale-data/es and @formatjs/intl-numberformat/locale-data/es with same results. Also with new Date().toLocaleString("en", {timeZone: "MADRID/EUROPE"}); with both required.

Not specifying a timezone (I'm using this polyfill just for that feature that works on Chrome and other browsers) has the same problem: new Date().toLocaleString("es");

What annoys me more is that white space at the end of the error string:

[longlho]

Do u have a reproducible repo of some sort? Can you use Intl.DateTimeFormat? Date.toLocaleString is significantly slower.

[devnix]

@longlho same Missing locale data for

[longlho]

oh u didn't add any locale data for intl-datetimeformat...

[devnix]

@longlho Didn't I? Look at the last line of the first post:

import '@formatjs/intl-datetimeformat/add-all-tz' // Add ALL tz data

[longlho]

That's timezone data which is separate from locale-data. See https://formatjs.io/docs/polyfills/intl-datetimeformat#simple

[devnix]

Oh no... Will test it tomorrow.

Is there any way to load the browser locale automatically?

Thanks for your patience @longlho

[longlho]

Unfortunately we do not get access to browser default locale due to fingerprinting privacy issue.

[devnix]

@longlho So now it's working, but it does not find the timezone

It should work with this configuration, right?

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

[longlho]

hmm I can't reproduce this. Do you have a reproducible repo? What versions of things are you using?

[boschni]

I was running into the same issue on IE11 and tracked it down to https://github.com/formatjs/formatjs/blob/main/packages/ecma402-abstract/IsValidTimeZoneName.ts .

A Set instance is created by providing an iterable to the constructor, which is not supported in IE11. You can get it working by adding a Set polyfill.

Might be good to change the IsValidTimeZoneName implementation or to mention this dependency at https://formatjs.io/docs/guides/runtime-requirements ?

[longlho]

thanks for the info @boschni that's something we can fix on our side