programing

Vuex + Mocha: 테스트에서 돌연변이를 커밋하면 'vuex 스토어 상태 변환 안 함' 경고가 발생합니다.

firstcheck 2022. 7. 23. 11:23
반응형

Vuex + Mocha: 테스트에서 돌연변이를 커밋하면 'vuex 스토어 상태 변환 안 함' 경고가 발생합니다.

봐주셔서 감사합니다.

Vuex 지원 애플리케이션에서 자동 테스트를 실행하려고 하는데, Mocha 테스트 파일에서 변환을 커밋하면 변환 내에서 상태를 직접 수정한다는 Vuex의 경고가 표시되는 이유를 진단하는 데 어려움을 겪고 있습니다.Vuex를 사용하여 글로벌 상태를 추적하고 글로벌 상태에 따라 특정 요소를 렌더링합니다(예: show button A:state.status === 'INITIAL', 단추 B를 표시합니다.state.status === 'LOADING').

예를 들어 다음과 같은 중앙 상점이 있습니다.state = { status: 'INITIAL' };

그리고 그에 상응하는 돌연변이가 생기죠

'LOADING': (state) => {
    state.status = 'LOADING';
},

컴포넌트 또는 스토어 액션을 통해 정상적으로 변경을 커밋하면 정상적으로 동작합니다.this.$store.commit('INITIAL');

단, 동일한 Vuex 스토어를 확립하고 Mocha 테스트파일에서 동일한 변경을 커밋하려고 하면 다음 오류가 발생합니다.

'[Vue warn]: Error in callback for watcher "function () { return this._data.$$state; }": "Error: [vuex] Do not mutate vuex store state outside mutation handlers."

변이가 올바르게 발생하고 테스트는 원활하게 통과하지만 변이가 설정된 시점에서 다음과 같은 경고가 나타납니다.state.status = 'LOADING';

커밋 요청을 액션 내에서 전송하려고 했지만 문제가 해결되지 않았습니다.스토어/뷰가 선언된 위치를 변경해 봤지만 문제가 해결되지 않았습니다.설정해 보았습니다.strict: false하지만 그것은 문제를 해결하지도 숨기지도 않았다.

커밋을 테스트하고 싶은 비정상적인 행동을 하고 있다고는 생각하지 않지만, 완전히 빗나갔을지도 모릅니다.더 많은 정보, 오류 덤프 또는 샘플 리포가 필요하면 알려주세요.

고마워! 키스

코드 어딘가에 글로벌 Vuex 스토어를 만들고 있었습니다.나중에 테스트 코드에서 다른 스토어를 인스턴스화하고 있었습니다.테스트 코드는 동작하지만 Vuex 스토어의 "공식" 인스턴스화는 오브젝트가 제어권 밖에서 변경되고 있음을 감지합니다(다른 Vuex 스토어가 오브젝트를 수정하고 있기 때문입니다).

좀 더 자세히 설명하자면 모듈이 있고counter.js:

const store = {
  count: 0
}
const mutations = {
  increment(state) {
    state.count++;
  }
}
export default {
  store,
  mutations
}

인마이store.js가지고 있는 파일

import counter from './store/modules/counter'
...
const store = new Vuex({
  modules: {
    counter
  }
})

그리고 내 안에test.spec.js가지고 있는 파일

import counter from './store/modules/counter'
...
describe('something', () => {
  it('does something', () => {
    let store = new Vuex({
      modules: {
        counter
      }
    })
    store.commit('increment')
  })
})

Vuex가 스토어를 만들 때 Vuex는 이 스토어의 복사본을 만들지 않습니다.store그리고.mutations오브젝트에는 전달된 참조만 포함되며 적절한 체크 및 기타 후크가 설정됩니다.테스트 실행 시 이 문제가 2회 이상 발생하여 에러가 발생하지만 다른 범위 내에 있기 때문에 Mocha는 테스트 불합격으로 마크하지 않습니다.

언급URL : https://stackoverflow.com/questions/47913607/vuex-mocha-committing-mutations-in-tests-throws-warning-do-not-mutate-vuex-s

반응형