Here's my test codes running from https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat
const number = 123456.789;
const locale = new Intl.Locale('en-DE', { region: 'DE' });
console.log(new Intl.NumberFormat(locale, { style: 'currency', currency: 'EUR' }).format(number));
console.log(new Intl.NumberFormat('en-DE', { style: 'currency', currency: 'EUR' }).format(number));
console.log(new Intl.NumberFormat(locale).format(number));
console.log(new Intl.NumberFormat('en-DE').format(number));
In Safari, it outputs the following results:
> "123.456,79 €"
> "123.456,79 €"
> "123.456,789"
> "123.456,789"
In Chrome, it outputs the following:
> "€123,456.79"
> "€123,456.79"
> "123.456,789"
> "123.456,789"
Language locale is "English(Germany)", region is "Germany". The expectation is that the number should be formatted by region which is Germany. Safari appears to be correct and consistent between currency number and non-currency number. In Chrome however, the currency number is displayed in English format while the non-currency number is displayed in German format.
What is more troubling for me is that the exact behavior is mirrored in React Native. In iOS the result is the same as in Safari, while in Android the result is the same as in Chrome.
Any suggestions for a fix or workaround, especially on the React Native side?