How do I test on different languages when the locales are in the SFC?

[trajano]

I am trying to test a component where the localization data is in the <i18n> block of an SFC. But I can't seem to get it working and it always uses the default one

I did it something like this

const i18n = createI18n({ locale: 'en', messages, globalInjection: true })

it('should display age correctly in English', () => {
    i18n.global.locale = 'en'
    const wrapper = mount(LjAge, {
      global: {
        plugins: [i18n],
      },
      props: {
        birthDate: '2014-11-11',
        today: '2024-07-29',
      },
    })
    expect(wrapper.text()).toBe('9y 8m')
})

it('should display age correctly in Spanish', () => {
    i18n.global.locale = 'es'
    const wrapper = mount(LjAge, {
      global: {
        plugins: [i18n],
      },
      props: {
        birthDate: '2014-11-11',
        today: '2024-07-29',
      },
    })
    expect(wrapper.text()).toBe('9a 8m')
})

[trajano]

I inlined it so this works

it('should work with mounted component in Spanish', () => {
  const wrapper = mount(LjAge, {
    global: {
      plugins: [
        createI18n({
          locale: 'es'
        })
      ]
    },
    props: {
      birthDate: '2014-11-11',
      today: '2024-07-29'
    }
  })
  expect(wrapper.text()).toBe('9a 8m')
})