Search code examples
i18nextreact-i18next

Shouldn't i18next wait for language detection result before loading fallback language


I use react-i18next example as a base. I replaced 'i18next-browser-languagedetector' by custom language detector:

class MyLanguageDetector {
  constructor(services, options = {}) {
    this.async = true;
    this.init(services, options);
  }

  init(services, options = {}, i18nOptions = {}) {  }

  detect(callback) {
    setTimeout(() => {
      callback('de')
    }, 5000);
  }

  cacheUserLanguage(lng, caches) {  }
}

MyLanguageDetector.type = 'languageDetector';

Config:

i18n
  .use(MyLanguageDetector)
  .use(Backend)
  .use(reactI18nextModule)

  .init({
    fallbackLng: 'en',
    debug: true,

    interpolation: { escapeValue: false },

    react: { wait: true }
  });

What I see is:

i18next::backendConnector: loaded namespace translation for language en

and after ~5 seconds:

i18next::backendConnector: loaded namespace translation for language de

I expected that 'en' won't be loaded since detected language is 'de'


Solution

  • fallbackLng is always loaded so that it can be used if current language translation file missing the particular key/resource

    See related issue