/Javascript/React/Mock createRef jest react functional component

Mock createRef jest react functional component

import React, { useRef } from 'react';
import { shallow } from 'enzyme';
import Child2 from './';

jest.mock('react', () => {
  const originReact = jest.requireActual('react');
  const mUseRef = jest.fn();
  return {
    ...originReact,
    useRef: mUseRef,
  };
});

describe('61782695', () => {
  it('should pass', () => {
    const mRef = { current: { offsetWidth: 100 } };
    useRef.mockReturnValueOnce(mRef);
    const wrapper = shallow(<Child2></Child2>);
    expect(wrapper.find('#myDiv').text()).toBe('123');
    expect(wrapper.find('p').text()).toBe('Div width is: 100');
  });

  it('should pass - 2', () => {
    const mRef = { current: { offsetWidth: 300 } };
    useRef.mockReturnValueOnce(mRef);
    const wrapper = shallow(<Child2></Child2>);
    expect(wrapper.find('#myDiv').text()).toBe('ABC');
    expect(wrapper.find('p').text()).toBe('Div width is: 300');
  });

  it('should pass - 3', () => {
    const mRef = {};
    useRef.mockReturnValueOnce(mRef);
    const wrapper = shallow(<Child2></Child2>);
    expect(wrapper.find('#myDiv').text()).toBe('123');
    expect(wrapper.find('p').text()).toBe('Div width is: ');
  });
});

Source: stackoverflow.com

Similar codes

0 vote317 views1 answer
React native update app from play store ios app store
Javascript React
0 vote337 views1 answer
How to trigger on Blur only when clicked outside parent component and not child component in react js
Javascript React
68 votes353 views4 answers
Inline styling react
Javascript React
1 vote336 views3 answers
[PrivateRoute] is not a <Route> component. All component children of <Routes> must be a <Route> or <React.Fragment>
Javascript React
1 vote309 views1 answer
For loop value index react
Javascript React
3 votes320 views1 answer
React native nox emulator
Javascript React
1 vote317 views1 answer
Detect touch react
Javascript React
0 vote323 views1 answer
Reactstrap form post
Javascript React
-1 vote286 views1 answer
Vimeo player react native
Javascript React
0 vote343 views1 answer
Htaccess to deploy react app to cpanel
Javascript React