feat(devtools middleware) add automatic action name finding #2987
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
|
This pull request is automatically built and testable in CodeSandbox. To see build info of the built libraries, click here or the icon next to each commit SHA. |
|
Open in Stackblitz • demo • starter commit: |
| ) | ||
| // eslint-disable-next-line @typescript-eslint/ban-ts-comment | ||
| // @ts-ignore | ||
| api.getState().setCount(10) |
There was a problem hiding this comment.
I don't know how to type this, I couldn't find a similar usage in this test
There was a problem hiding this comment.
It should be able to do with create<T>()(...).
|
This looks nice! I don't think we need |
alimertcakar
force-pushed
the
feat-automatic-action-names
branch
from
a857aa6 to
8f12e16
Compare
Seems to work reliably on the mock project I created with a simple store. Is there a guide on local development? I'd like to meddle with zustand in some real life projects if possible |
|
I'm not sure what's wrong, but you can use pkg-pr-new #2987 (comment) if you don't find a local solution. |
Summary
With devtools() middleware, we can use Redux devtools extension to debug fired actions. But actions are shown as either "anonymous" or by the custom name we provided in set() function like:
set(foo, undefined, "state/setCount").It is really tedious to provide a action name for every
setcall. Wouldn't it be nice to have the option to have it default to a more meaningful name?Now we can do that by passing
inferActionName: true,to devtools options. It finds the the function name which calledset()by reading the current stack.This works for firefox,chrome and edge. (There isn't a redux devtools extension on Safari anyways)
In node.js it's displayed as
Object.functionNameinstead offunctionName, I don't think it matters as it's tests only.Check List
pnpm run fix:formatfor formatting code and docs