vue-test-loader
Extract custom test blocks into .spec files
Usage
Install the loader:
npm install --save-dev vue-test-loader
Setup vue-loader to pass the test block to the loader:
module.exports = {
// The rest of the config
module: {
rules: [
{
test: /\.vue$/,
loader: 'vue-loader',
options: {
loaders: {
'test': 'vue-test-loader'
},
}
}
]
}
}
Write tests inside a custom block:
<template>
<div />
</template>
<script>
export default {
name: 'example-component'
}
</script>
<test>
import { shallow } from 'vue-test-utils'
import ExampleComponent from './ExampleComponent'
describe('ExampleComponent', () => {
test('is div', () => {
expect(shallow(ExampleComponent).is('div')).toBe(true)
})
})
</test>
vue-test-loader will create a .spec.js file in a __tests__ directory inside the component directory.
This works best with Jest.
Options, Name, Description, Default, -------------, -------------, -----, extension, string of file extension, '.spec.js', ```
{
test: /.vue$/,
loader: 'vue-loader',
options: {
loaders: {
'test': [{
loader: path.resolve(__dirname,'../index.js'),
options: {
extension: '.test.js'
}
}]
},
}
}
## Examples
You can see an example project using Jest [here](https://github.com/eddyerburgh/vue-test-loader-example)