Testing the fallback language - Chai

[GeniaT]

Hi and thank you for the great work! The fallback in my app behaves fine but the test I wrote doesn't fall back to 'en' language. See my test:

...
Vue.i18n.fallback('en');
const payloadZX = {
  navbar: {
    street: 'street'
  }
};
Vue.i18n.add('zx', payloadZX);
 //store.state.i18n.translations = {
 //en: {navbar.newmessage: 'New Message'},
 //zx: {navbar.street: 'street'}
 //}
const translated = Vue.i18n.translate('zx', store.state.i18n.translations.zx['navbar.newmessage']);
expect(translated).to.equal('New message');
}
==> Error: AssertionError: expected 'zx' to equal 'New message'

Did I miss something?

[tikiatua]

Hi @GeniaT

Thank you for your feedback. There should be three options to make it work

1. Make the casing of your assertion and your translation match (i.e. New Message / New message). Please keep in mind, that you are actually passing the string "New Message" to the translation method and not referencing the key navbar.newmessage with your current code. Therefore, the translate method will return the string that you passed to the translate method and not the fallback translation of the key.

2. Set the current language and add only the key of the translation to the translate method. Vuex-i18n should figure out the correct fallback message by itself.

   // set the default locale
   Vue.i18n.set('zx');
   // set the fallback locale
   Vue.i18n.fallback('en');
   // .. add the translations
   ...
   // get the translated string
   const translated = Vue.i18n.translate('navbar.newmessage');
   expect(translated).to.equal('New Message');

3. Use the translateIn method to specify in which language the translation should occur initially.

   // get the translated string
   const translated = Vue.i18n.translateIn('zx', 'navbar.newmessage');
   expect(translated).to.equal('New Message');

Proper testing of the plugin is in our pipeline. Unfortunately, we are currently super-busy finalizing the first validated version of a huge project with a custom vue-based collaborative rich-text and flowchart editor which is consuming all our resources.

However, we will also use vuex-i18n at a later stage in this project and good testing coverage for the library as well as documentation on how to implement testing will definitely be part of the project.

[GeniaT]

@tikiatua Thanks for your quick answer and nice catch on casing. Works perfect now.