Search code examples
reactjsreact-intl

React-Intl: Message not formatting in Safari


I have the following translation:

{count, number} {count, plural, one {Kundenbewertung} other {Kundenbewertungen}}

In Chrome it displays 23 Kundenbewertungen just fine but in Safari it displays the translation string and throws the error

Error formatting message: "pdp:product-title:ratings" for locale: "de"

Cannot format message: "pdp:product-title:ratings", using message source as fallback.

In my React Component the code is the following:

<FormattedMessage
  id="pdp:product-title:ratings"
  values={{ count: product.metadata.rating.count }}
/>

I am totally lost, because it works as expected in Chrome. Am I using the syntax correctly?


Solution

  • Reason is that Intl.PluralRules it not available on Safari. Just use this polyfill and everything should work as expected.