React - Jest - Enzyme: How to mock ref properties

I’m writing test for a component with ref. I’d like to mock the ref element and change some properties but have no idea how to. Any suggestions?

// MyComp.jsx
class MyComp extends React.Component {
  constructor(props) {
    super(props);
    this.getRef = this.getRef.bind(this);
  }
  componentDidMount() {
    this.setState({elmHeight: this.elm.offsetHeight});
  }
  getRef(elm) {
    this.elm = elm;
  }
  render() {
    return <div>
      <span ref={getRef}>
        Stuff inside 
      </span>
    </div>
  }
}

// MyComp.test.jsx
const comp = mount(<MyComp />);
// Since it is not in browser, offsetHeight is 0
// mock ref offsetHeight to be 100 here... How do I do it?
expect(comp.state('elmHeight')).toEqual(100);

[gabor-ottlik-epam]

This didn’t work for me when the variable of useRef is in useEffect

const test = useRef()

useEffect(() => {
  console.log(test.current)
})

This logs out the underlying dom element instead of the mock function since useEffect runs when the dom is rendered hence the dom element is attached to ref.

Any idea how to get around this?

[mrdulin]

How about this answer: https://stackoverflow.com/a/61789113/6463558