• 스토어 코드

store 테스트 세팅

movie라는 스토어는 export default를 통해 스토어의 객체 데이터를 한꺼번에 export하는 형태로 작성되어 있다. 따라서 해당 스토어 파일에서부터 스토어 객체를 Import하여 테스트 코드 내에서 스토어를 테스트할 수 있다. 이 때, 테스트를 진행하면서 원본 store 객체를 오염시키지 않기 위해 lodash에서 _cloneDeep 모듈을 불러와 깊은 복사를 하도록 한다.

import movieStore from '~/store/movie'
import _cloneDeep from '~lodash/cloneDeep'

describe('store/movie.js test', () => {
  let store

  beforeEach(() => {
    store = _cloneDeep(movieStore)
    ...
  })

	...
})

state

state는 함수이기 때문에, state 함수를 실행하여야 한다.

store.state = store.state()

commit과 dispatch

이 둘은 store 객체에 따로 정의되어 있는 함수가 아니기 때문에, 우리가 직접 정해 주어야 한다.

store.mutations.updateState(store.state, {})

그렇지 않으면 위와 같이 직접 mutations나 actions에 접근해서 사용하여야 하는데, 이는 꽤나 번거로운 작업이기 때문에 직접 정해 주는 것이 좋다.

store.commit = (name, payload) => {
  store.mutations[name](store.state, payload)
}

actions

actions는 비동기 함수이기 때문에 dispatch에서 actions를 리턴해야 한다.

store.dispatch = (name, payload) => {
  const context = {
    state: store.state,
    commit: store.commit,
    dispatch: store.dispatch
  }
  **return store.actions[name](context, payload) // actions가 비동기이기 때문**
}

스토어 세팅 코드