[REACTJS] 참고 문헌이와 농담 스냅 샷 테스트에서 null 인 반응 테스트 - 렌더러

참고 문헌이와 농담 스냅 샷 테스트에서 null 인 반응 테스트 - 렌더러

해결법

1. ---

   1.테스트 렌더링이 DOM을 반응 결합되지 않기 때문에, 그것은 심판이 같이 해야하는 일에 대해 아무것도 알지 못한다. 15.4.0 테스트 렌더러에 대한 모의 심판 할 수있는 기능을 추가 반응하지만 당신은 그 모의 객체를 직접 제공해야합니다. 15.4.0 릴리스 노트 그렇게의 예를 포함 반응한다.

   테스트 렌더링이 DOM을 반응 결합되지 않기 때문에, 그것은 심판이 같이 해야하는 일에 대해 아무것도 알지 못한다. 15.4.0 테스트 렌더러에 대한 모의 심판 할 수있는 기능을 추가 반응하지만 당신은 그 모의 객체를 직접 제공해야합니다. 15.4.0 릴리스 노트 그렇게의 예를 포함 반응한다.

   import React from 'react';
   import App from './App';
   import renderer from 'react-test-renderer';
   
   function createNodeMock(element) {
     if (element.type === 'p') {
       // This is your fake DOM node for <p>.
       // Feel free to add any stub methods, e.g. focus() or any
       // other methods necessary to prevent crashes in your components.
       return {};
     }
     // You can return any object from this method for any type of DOM component.
     // React will use it as a ref instead of a DOM node when snapshot testing.
     return null;
   }
   
   it('renders correctly', () => {
     const options = {createNodeMock};
     // Don't forget to pass the options object!
     const tree = renderer.create(<App />, options);
     expect(tree).toMatchSnapshot();
   });
   

   그것은 단지와 함께 작동 참고 15.4.0 이상 반응.

2. ---

   2.나는 그런이 문제를 해결하기 위해이의 repo에서 효소 기반의 테스트를 사용 :

   나는 그런이 문제를 해결하기 위해이의 repo에서 효소 기반의 테스트를 사용 :

   import { shallow } from 'enzyme'
   import toJson from 'enzyme-to-json'
   
   describe('< SomeComponent />', () => {
     it('renders', () => {
   
       const wrapper = shallow(<SomeComponent />);
   
       expect(toJson(wrapper)).toMatchSnapshot();
     });
   });
   

from https://stackoverflow.com/questions/40852131/refs-are-null-in-jest-snapshot-tests-with-react-test-renderer by cc-by-sa and MIT license