Is there a way to tell WHERE an action was called within a React/Redux file structure?

Question

Is there a way to tell WHERE an action was called within a React/Redux file structure? I'm hunting for an action that I can see being called. I just can't tell where in the file system the action was dispatched. Is there a way to determine that using Redux tools? I feel like I'm chasing a rabbit down its hole right now.

Help! Thanks!

That's not working very well. It gets called all over the app. I need to find an exact location where it was dispatched. I've been trying to sort through each example, but it's just not yielding results — J Seabolt, Jun 22 '18 at 19:46
https://stackoverflow.com/a/280396/438992 may or may not work. It might be easier to throw/catch/log an exception in the action. — Dave Newton, Jun 22 '18 at 19:52
Look for [`console.trace()` on this MDN page](https://developer.mozilla.org/en-US/docs/Web/API/console#Stack_traces) — radarbob, Jun 22 '18 at 20:04

score 7 · Answer 1 · answered Jun 22 '18 at 20:21

The basic approach is:

Search the codebase files for the action type string
See if it's being used in an action creator
Do a "Find Usages" or a text search to see where that action creator is being imported and used

Also, you could use a middleware that will log a stack trace whenever it sees a specific action. I don't think I've seen a middleware like this yet, but here's a quick (and briefly tested) implementation that should work and give you a stack trace back to the dispatch location:

const createLogActionStackTraceMiddleware = (actionTypes = []) => {
    const logActionStackTraceMiddleware = storeAPI => next => action => {
        if(action.type && actionTypes.includes(action.type)) {
            console.trace(`Action: ${action.type}`);
        }

        return next(action);
    }

    return logActionStackTraceMiddleware;
}


// in your store setup:
const stackTraceMiddleware = createLogActionStackTraceMiddleware(["ACTION_1", "ACTION_2"]);

const middlewareEnhancer = applyMiddleware(thunkMiddleware, stackTraceMiddleware);

Is there a way to tell *WHERE* an action was called within a React/Redux file structure?

1 Answers1

Is there a way to tell WHERE an action was called within a React/Redux file structure?