Utilizing Jest-Preview with Vue-CLI.
npm set up --save-dev @testing-library/vue concurrently jest-preview wait-on
npm uninstall @vue/test-utils
-
In
jest.config.js
add:rework: css
-
In
checks/unit/setup.js
import any world CSS like so:import '../../public/world.css';
import 'bootstrap/dist/bootstrap.min.css';
-
In
checks/unit/setup.js
add this:import { jestPreviewConfigure } from 'jest-preview';
-
jestPreviewConfigure({ autoPreview: true });
`
-
In checks, change:
-
from:
import { shallowMount } from '@vue/test-utils';
-
to:
import { render } from '@testing-library/vue';
-
from:
-
In checks change:
-
from:
const wrapper = shallowMount(MyComponent, choices);
-
to:
const wrapper = render(myComponent, choices);
-
from:
-
In checks change:
-
from:
const validator = wrapper.vm.$choices.props.no matter.validator;
-
to:
const validator = MyComponent.props.no matter.validator;
-
from:
-
Lastly, in
bundle.json
add on this npm script:"jest": "concurrently "jest-preview" "wait-on http://localhost:3336 && npm run unit"",
- Change the
npm run unit
half to no matter script you employ to run jest
-
Do
npm run jest