반응형
각 테스트 파일에 컴포넌트가 필요한 모든 것을 Import하지 않도록 하려면 어떻게 해야 합니까?
재치 테스트에서는 테스트된 컴포넌트가 동작하는 데 필요한 모든 것을 Import해야 합니다(애플리케이션에서 하고 있습니다).main.js
테스트 파일이 여러 개 있기 때문에 각 파일에 다시 Import해야 합니다.모든 파일을 하나의 파일로 Import한 후 이 파일만 Import할 수 있는 방법이 있습니까?
import Component from '@/views/input-something'
import {mount, shallowMount} from '@vue/test-utils'
import {FontAwesomeIcon} from '@fortawesome/vue-fontawesome'
import {library} from '@fortawesome/fontawesome-svg-core'
import {fas} from '@fortawesome/free-solid-svg-icons'
import 'bootstrap-vue/dist/bootstrap-vue.css'
import 'bootstrap/dist/css/bootstrap.css'
import BootstrapVue from 'bootstrap-vue'
import 'vue-select/dist/vue-select.css'
import Vuelidate from 'vuelidate'
import Vue from 'vue'
import './helpers/multi-ref-test-runner'
Vue.component('font-awesome-icon', FontAwesomeIcon)
Vue.use(BootstrapVue)
Vue.use(Vuelidate)
library.add(fas)
// I wish to write everything above in a single file
window.confirm = function() { return false; }
describe('input-something', () => {
let wrapper;
beforeEach(() => {
wrapper = mount(Component, {...});
});
it('it renders', () => {});
});
필요한 모든 것을 파일에 Import 할 수 있습니다.helper.js
그리고 시험 파일에서는 그냥 이렇게 했어요.
import 'test-helpers/helper';
describe('input-something', () => {...})
편집 1
잠시 후, 나는 필요한 모든 것을 이 방법으로 수입할 수 있었다.
/* imports.js */
import Component from '@/components/something'
import { mount } from '@vue/test-utils'
export { Component, mount }
/* my-test.js */
import { Component, mount } from './imports.js'
그리고 이 행을 내 .babelrc에 추가합니다(재밌게 작업할 수 있도록).
"plugins": ["@babel/plugin-syntax-dynamic-import"]
그러면 가져온 모든 자산을 사용할 수 있습니다.
이렇게 동작하지만 각각의 속성을 암묵적으로 Import할 필요 없이 이러한 속성(컴포넌트, 마운트...)을 사용하고 싶었습니다.
방법이 있을까요?
- 별도의 js 파일 생성
- 컴포넌트, 플러그인 또는 원하는 것을 Import합니다.
- 해당 파일을 main.disc 파일에 Import합니다.
예: 이것은 별도의 재사용 가능한 Componets.js입니다.
// I include components and plugins here
...
import Component from '@/views/input-something'
import {mount, shallowMount} from '@vue/test-utils'
import {FontAwesomeIcon} from '@fortawesome/vue-fontawesome'
...
현재 app.js에 있습니다.
import('path to reuseableComponets.js')
바로 그겁니다.
에서 사용jest.config.js
테스트를 설정하는 스크립트를 가리킵니다.이 파일은 테스트 전에 자동으로 호출되므로 가져올 필요가 없습니다.
예를 들어, 당신이 언급한 셋업 코드를my-setup.js
다음으로 Jest를 다음과 같이 설정합니다.
// jest.config.js
module.exports = {
setupFilesAfterEnv: ['./my-setup.js'],
}
언급URL : https://stackoverflow.com/questions/58663933/how-to-avoid-import-everything-that-the-component-needs-in-each-test-file
반응형
'programing' 카테고리의 다른 글
Windows를 대체할 만한 Valgrind가 있습니까? (0) | 2022.05.29 |
---|---|
vuej에서 쿠키를 설정하는 방법 (0) | 2022.05.29 |
Vue: 컴포넌트와 함께 스토어를 사용하는 방법 (0) | 2022.05.29 |
Vuejs : 오브젝트를 프로펠러로 전달하여 컴포넌트가 서브 오브젝트를 갱신하도록 하는 방법 (0) | 2022.05.29 |
**는 C언어로 무엇을 합니까? (0) | 2022.05.29 |