joke를 사용하여 window.navigator.language를 조롱하는 방법

joke를 사용하여 window.navigator.language를 조롱하는 방법

나는 지금 조롱하려고 하고 있다window.navigator.language내 페이지의 콘텐츠가 올바른 언어를 사용하고 있는지 테스트할 수 있도록 내 농담 단위 테스트에서 브라우저 속성을 지정합니다.

온라인에서 다음을 사용하는 사용자를 찾았습니다.

Object.defineProperty(window.navigator, 'language', {value: 'es', configurable: true});

테스트 파일 맨 위에 설정해 두었더니 동작하고 있습니다.

그러나 개별 테스트에서 다시 정의(및 구성 가능 여부를 확인하도록 설정된 사용자)하면 다시 정의되지 않고 이전 값만 사용합니다. 확실하게 변경할 수 있는 방법을 아는 사람이 있습니까?

beforeEach(() => {
    jest.clearAllMocks()
    Object.defineProperty(global.navigator, 'language', {value: 'es', configurable: true});
    wrapper = shallow(<Component {...props} />)
})

  it('should do thing 1', () => {
      Object.defineProperty(window.navigator, 'language', {value: 'de', configurable: true});
      expect(wrapper.state('currentLanguage')).toEqual('de')
    })

it('should do thing 2', () => {
  Object.defineProperty(window.navigator, 'language', {value: 'pt', configurable: true});
  expect(wrapper.state('currentLanguage')).toEqual('pt')
})

이 테스트에서는 언어를 내가 설정한 새로운 언어로 변경하지 않고 항상 맨 위에 있는 언어를 사용합니다.

window.navigator 그 속성은 읽기 전용이기 때문에Object.defineProperty를 설정하는 데 필요합니다.window.navigator.language부동산 가치를 여러 번 바꾸는 데 효과가 있습니다.

문제는 컴포넌트가 이미 다음 시간에 인스턴스화되어 있다는 것입니다.beforeEach,window.navigator.language변화는 영향을 미치지 않습니다.

사용.Object.defineProperty속성을 수동으로 조롱하려면 원래 설명자를 저장하고 수동으로 복원해야 합니다.이 작업은 다음과 같이 수행할 수 있습니다.jest.spyOn.jest.clearAllMocks()수동 스파이/모크에는 도움이 되지 않습니다.제스트 스파이에게는 불필요할지도 모릅니다.

다음과 같은 경우가 있습니다.

let languageGetter;

beforeEach(() => {
  languageGetter = jest.spyOn(window.navigator, 'language', 'get')
})

it('should do thing 1', () => {
  languageGetter.mockReturnValue('de')
  wrapper = shallow(<Component {...props} />)
  expect(wrapper.state('currentLanguage')).toEqual('de')
})
...

Estus Flask의 답변에 조금 더하면 셋업 파일을 감시할 수도 있습니다.

jest config 파일에서 setupFiles 기능을 활성화합니다.

setupFiles: ['./test/mock-data/globals.js']

그런 다음 globals.js 내부에서 userAgent 또는 기타 속성을 감시합니다.

global.userAgent = jest.spyOn(navigator, 'userAgent', 'get');

마지막으로 테스트에서 반환값을 시뮬레이션합니다.

describe('abc', () => {
  global.userAgent.mockReturnValue(
    'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4)\
           AppleWebKit/600.1.2 (KHTML, like Gecko)\
           Version/13.0.0 Safari/600.1.2'
  );
  test('123', async () => {
    const result = await fnThatCallsOrUseTheUserAgent();
    expect(result).toEqual('Something');
  });
});

또는

jest 설정 파일

setupFiles: ['./test/mock-data/globals.js']

글로벌.글로벌

const navigator = { language: 'Chalcatongo Mixtec', ...anyOtherPropertiesYouNeed };

Object.defineProperty(window, 'navigator', {
   value: navigator,
   writable: true
});

그러면 개별 테스트 설정에서 자유롭게 변이할 수 있습니다.

언급URL : https://stackoverflow.com/questions/52868727/how-to-mock-window-navigator-language-using-jest