i18next-icu incompatible with react-i18next <Trans>

[cellog]

🐛 Bug Report

When using i18next-icu 2.0.0 with a react-i18next <Trans> component, the parsing fails, and no arguments are replaced.

This is because IntlMessageFormat 2.x did not have the ignoreTag option. Version 9.4.6 now has this, which means that when IntlMessageFormat sees a placeholder like <0></0> it expects that to exist in the options, much like the value in the reproduce case below. react-i18next and other implementations handle the placeholders above the icu parser, and so the ignoreTag option should be enabled.

To Reproduce

// Paste your code here
import { Trans } from "react-i18next/icu.macro";

function ComponentThatUsesTrans () {
  const value = "this is not replaced";
  return (
    <Trans i18nKey="some-key">
      This <b>bold tag</b> triggers an error, and as a result
      {value} is not replaced
    </Trans>
  );
}

Expected behavior

The translation should be "This <b>bold tag</b> triggers an error, and as a result this is not replaced" but is "This <b>bold tag</b> triggers an error, and as a a result {value}"

Your Environment

• runtime version: i.e. node v14, deno, browser xy
• i18next version: i.e. 19.5.3
• os: Mac, Windows, Linux
• any other relevant information

[cellog]

@jamuhl apologies to ask this again, but this is a pretty serious regression I missed in the work for 2.0.0, do you think. you might have time to look over the PR fixing it in the next few days?

[cellog]

(if not, it's fine, I have a stopgap, just want to know if I need to use our forked package until there is time to review, or if I can wait for 2.0.1)

[tngwoerleij]

Would be great to have this fixed & merged soon.

We're experiencing the same issue - I thought at first this was intended behaviour and escaped the tags, but I would be better to avoid this.

[tngwoerleij]

Thanks for your quick response! This fixes the issues and allows me to avoid explicitly escaping tags. I have already updated the dependency to latest 2.0.2 👍