Reselect - how to figure out which argument changed?

Question

Selectors are efficient. A selector is not recomputed unless one of its arguments changes.

I'm trying to debug a selector that is being called more often than expected. Is there a way to log why a particular selector was recomputed (i. e. which argument changed)?

Example:

export const totalSelector = createSelector(
  [subtotalSelector, taxSelector]
  (subtotal, tax) => ({ total: someExpensiveCalculation(subtotal, tax) })
)

Now let's say that the return value of totalSelector is supplied to some component as a result prop via mapStateToProps. why-did-you-render reports unnecessary render due to changing reference (not value) of result. Therefore I know totalSelector must have been recomputed and we know from the docs that it only happens when of its inputs change (subtotal or tax in the example). How can I tell whether it was subtotal that triggered a change or tax or both?

For the purpose of this explanation let's assume both subtotal and tax are objects, so they are passed by reference.

Answer 1

One thing that helped me in my situation is to put a breakpoint at this line so that you can clearly see the argument that is causing the recomputation.