Question: What is the recommended best practice for unit testing?

[RyanClementsHax]

Hello! What is the recommended way to set up unit tests with components that use next-translate?

I currently don't see a straightforward way of doing this, so I concocted my own solution (albiet imperfect). Right now I'm creating a custom render function when using testing-library/react. In that, I use I18nProvider then pass in any translations I think it might need, but this can get unwieldy since this would require me to know all the translations my tests will need upfront.

// testUtils.tsx
import React from 'react'
import { render } from '@testing-library/react'
import I18nProvider from 'next-translate/I18nProvider'
import index from 'locales/en/index.json'

const Providers: React.FC = ({ children }) => (
  <I18nProvider lang="en" namespaces={{ index }}>
    {children}
  </I18nProvider>
)

// eslint-disable-next-line @typescript-eslint/no-explicit-any
const customRender: typeof render = ((ui: any, options: any) =>
  render(ui, { wrapper: Providers, ...options })) as unknown as typeof render


export * from '@testing-library/react'

export { customRender as render }

In the test, I'm trying to use getT to get the translation being used, but I get the following error:

Is there a recomended way of going about this?
Thanks

Edit: turns out this is also an open question on stack overflow

[aralroca]

You can fix It adding the config json on global.i18nConfig, config.loadLocaleFrom is not working because config is get from this helper https://github.com/vinissimus/next-translate/blob/b1f0f409508d1a53a11018229a6789b56be76dc6/src/getConfig.tsx#L3-L7