areMergedPropsEqual doesn't seem to run

I have a connected component near the root of my app that looks like this

//render method for component
render(){
  return this.props.children;
}

function mapStateToProps(state){
  return {
    state //used in some context methods that the component has which don't care about rendering
  };
}

function areMergedPropsEqual(next, prev){
  console.log('hi');
  return next.children === prev.children;
}

export default connect(mapStateToProps, undefined, undefined, {areMergedPropsEqual})(Component);

i added the areMergedPropsEqual option because i was worried every redux change would trigger a rerender of the entire app unnecessarily.

The problem is that areMergedPropsEqual seems to be ignored. I put a breakpoint in there and it never gets hit. and there’s no console logs.

Is it possible that the option is being ignored?

[jimbolla]

areMergedPropsEqual is never called if you use the default for mergeProps because the answer will always be false in that case. Since mergeProps is only called if stateProps, dispatchProps, or ownProps has changes, the default mergeProps will always produce an object that has different values. Avoiding that extra shallow compare is a significant perf boost.

Should probably update the API docs to clarify this.

[TomMahle]

I’m seeing a case where ownProps are certainly changing, stateProps are not referenceEqual, but areMergedPropsEqual still does not run.

It seems from some quick testing that passing null or undefined as mergeProps causes areMergedPropsEqual not to run. Replacing the falsy mergeProps value with the default implementation

function defaultMergeProps(stateProps, dispatchProps, ownProps) { return { …ownProps, …stateProps, …dispatchProps } }

seems to cause areMergedPropsEqual to run as expected and described in @jimbolla 's comment.