In Trans, extraction of `See <strong>{{foo}}</strong>` does not match react-i18n extraction

[pcorpet]

Describe the bug

When extracting string to translate from a Trans component, if it contains an HTML tag that should be kept and that this HTML tag contains more than a simple string, e.g. See <strong>{{foo}}</strong>, then babel-plugin-i18n-extract extracts it differently than react-i18n.

How to reproduce

I'm writing some text within a Trans component that is not extracted the same way while extracting and while rendering.

Babel configuration:

['i18next-extract', {keySeparator: null, nsSeparator: null, useI18nextDefaultValue: ['en']}],

Reproduction:

const MyComponent = () => {
  const foo = Math.random()
  return <Trans>
    See <strong>{{foo}}</strong>
  </Trans>
}

I run the extractor first. Then I use it live in i18next debug mode to see which key it's searching for.

Expected behavior

babel-plugin-i18next-extract and react-i18next should both be extracting the same string.

What actually happens

Strings extracted:

• babel-plugin-i18next-extract: See <strong>{{foo}}</strong>
• react-i18next: See <1>{{foo}}</1>

I think I prefer the style from babel-plugin-i18next-extract but I it would be a breaking change to change the one from react-i18next.

Your environment

• OS (e.g. ArchLinux): Linux 37dfc14918c4 5.3.0-24-generic #26-Ubuntu SMP Thu Nov 14 01:33:18 UTC 2019 x86_64 GNU/Linux (within Docker)
• Plugin version (e.g. 0.3.0): 0.4.0
• Node version (e.g. 12.13.0): ? 11.12.0

Additional context

It looks like react-i18next is checking whether the child of a "kept element" (e.g. strong, b, i, etc.) is a single string: https://github.com/i18next/react-i18next/blob/8b6caf105d0100686b1bdda7d5cdda9d1c91edba/src/Trans.js#L40

[gilbsgilbs]

Yeah, nice catch, thanks. Looks like this behavior is overly convoluted in i18next unfortunately.

As a workaround, given that you prefer the <1>{foo}</1> form, you could just disable transKeepBasicHtmlNodeFor option in both react-i18next and the plugin.

Sorry about that :man_facepalming: .

[pcorpet]

Sorry @gilbsgilbs, I still have a bug sometimes with the numbers being off by one. I'll open a new issue.