vendredi 14 septembre 2018

TypeError: Cannot read property 'scrollIntoView' of null - react. jest enzyme

Using react 16.3.1, jest 16.3.1, enzyme 3.3.0.

Within my React Class component I have created a react ref which I use to ensure that when the component is mounted the browser is at the top of the page.

class PageView extends React.Component {

  constructor(props) {
    super(props);
    this.topOfPageRef = React.createRef();
  }

  componentDidMount() {
    ReactDOM.findDOMNode(this.topOfPageRef.current).scrollIntoView();
  }

  render(){
    const { x } = this.props;

    return (
      <React.Fragment>
        <div className="main-wrapper" ref={this.topOfPageRef}>
         Top
        </div>
        )}
      </React.Fragment>
    );
  }
}

This all works perfectly within the browser but fails in my enzyme test.

My test is simple, it just tries to render the component.

  it('should render component correctly', () => {
    const props = {
      ...defaultProps,
    };
    const wrapper = mount(<PageView {...props} />);
    expect(wrapper).toMatchSnapshot();
  });

TypeError: Cannot read property 'scrollIntoView' of null

I have tried both shallow and mount methods and whilst the element found is not null, it appears to be a react instance of HTMLDivElement which is missing the scrollIntoView method.

Aucun commentaire:

Enregistrer un commentaire