Provide interpolation values to MissingHandler

[JoosepAlviste]

Clear and concise description of the problem

I'm trying to write tests for my Vue components so that any translations are replaced by the translation key plus the arguments, e.g., t('hello', { name: 'World' }) would output hello__{"name":"World"}. Then, it can be asserted that the translations and the interpolated values are correct.

Suggested solution

I'd propose that the MissingHandler, that can be passed to createI18n, could be passed the interpolation arguments:

createI18n({
  missing: (locale, key, instance, type, arguments) => {
    if (arguments) {
      return `${key}__${JSON.stringify(args)}`;
    }
    return key;
  }
})

I'm not sure how this should work with the plural and other variations of the translation functions from the composer, though.

I would be open to working on this, but I couldn't even find the place that the missing handler is called at. If I got some guidance, then I wouldn't mind trying to work on this :)

Alternative

I tried mocking $t with @vue/test-utils like so:

config.global.mocks.$t = (msg, args) => {
  if (args) {
    return `${msg}__${JSON.stringify(args)}`;
  }
  return msg;
};

But that only works when using $t inside templates and does not work with the useI18n composable.

Maybe there's another way that I could mock that? I looked through the issues, but couldn't find anything that seemed relevant to this. I also couldn't find any docs related to testing so maybe that could cover some best practices?

Additional context

Thanks for the great package!

Validations

• [X] Read the Contributing Guidelines
• [X] Read the Documentation
• [X] Check that there isn't already an issue that request the same feature to avoid creating a duplicate.