intlify / vue-i18n-jest Goto Github PK
View Code? Open in Web Editor NEW:globe_with_meridians: vue-jest wrapper for i18n custom blocks
License: MIT License
:globe_with_meridians: vue-jest wrapper for i18n custom blocks
License: MIT License
Hello,
I use a common dictionary for translations a lot like this:
<i18n lang="yaml" src="../locales/common.yaml"></i18n>
However, it is not supported by vue-i18n-jest which assumes that the translation is inserted directly into the i18n
element.
Could you please add the support?
Best regards
Beda
add .github
directory
https://codesandbox.io/s/2z362mk09r?module=%2Fsrc%2FApp.test.js
You'll see in App.vue
that $t('greeting')
is being used to display a message to the user, where greeting
is defined in i18n
of the SFC.
It works as expected on the browser, this should also happen on the test.
<template>
<div>{{ $t("greeting") }}</div>
</template>
<script>
export default {
i18n: {
messages: {
en: {
greeting: "Hello World!"
}
}
}
};
</script>
With Jest and @vue/test-utils
, it will only show the translation key.
expect(received).toEqual(expected)
Expected value to equal:
"Hello World!"
Received:
"greeting"
9 | it("Should translate", () => {
10 | const wrapper = mount(App, { i18n, localVue });
> 11 | expect(wrapper.text()).toEqual("Hello World!");
12 | });
Not sure whether this is for @eddyerburgh or you guys, whatever suits! Hope it makes sense.
Hi! vue-jest
4.0.1 has been released, and the current peerDep definition of -beta.3
does not include this patch version.
Also, @vue/vue2-jest
has been released, and I think the following versions should be supported, too: ^27.0.0 || ^27.0.0-alpha
.
I was about to open a PR but I'm not sure how to define all the 4 versions โย if needed?
๐
Good afternoon, thanks for your work.
I have a problem. Can't test components when there is an tag inside the component.
I example example:
https://github.com/ivolkoff/vue-i18n-next-jest-bug
Run test:
https://github.com/ivolkoff/vue-i18n-next-jest-bug/blob/main/src/tests/unit/App.spec.js
I expect that the text will change depending on the locale, but it remains the same, since it does not find the block with the translation.
https://github.com/ivolkoff/vue-i18n-next-jest-bug/blob/main/src/tests/unit/__snapshots__/App.spec.js.snap
the text transformation plugin used to help me, but now it is not supported
https://github.com/intlify/vue-i18n-jest
Is there a way to set up a test?
Hi,
I have a vue2 project that I'm trying to run tests on and I use the following:
Jest 28
@vue/vue2-jest@28
[email protected]
vue-i18n@8
@vue/[email protected]
I have added to my jest.config.js the following:
globals: {
'@vue/vue2-jest': {
transform: {
'i18n': 'vue-i18n-jest'
}
}
},
transform: {
'^.+\\.vue$': '@vue/vue2-jest'
}
note: I also tried the vue-jest
key in the globals section with the same results.
My tests fail with the following error:
TypeError: Cannot read properties of undefined (reading 't')
line in question:
data() {
headers: [
{
text: this.$i18n.t('admin.users.headers.name'),
My test render call:
it('renders', () => {
const wrapper = shallowMount(UserList, {
Vue,
propsData: {
users,
},
});
Thank you for any guidance.
vue-i18n-jest should be supported for Vue 2 / Vue 3 and jest 26 / jest 27 like vue-jest.
Originally posted by @kazupon in #38 (comment)
Hello,
using @
in the path when including translation files like this:
<i18n lang="yaml" src="@/locales/common.yaml"></i18n>
is not supported, even though it is completely legitimate.
Would it be possible to add support for this?
Thanks
Beda
Hi, I'm not sure if this place is the appropriate place to ask but I think it says there is version 2 for Vue 3, and is it available? I can not install vue-i18-jest since it can not resolve dependency of vue
npm ERR! Could not resolve dependency:
npm ERR! peer vue@"^2.5" from [email protected]
I am using
"vue": "^3.2.31",
"vue-i18n": "^9.1.10",
"vite": "^2.5.4",
"vitest": "^0.15.2",
for rollup building
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.