Question: Is that possible or good idea to have this thing as a developer tool panel

[timnew]

Well, I found it is really annoying to distinguish whether to inject this devtool by checking current ENV.
And the code between whether or not inject this tool are also quite different.
So it is kind of pain.

And I do hate to inject some extra component to the code just for debugging.

So will it be a good idea that to wrap this thing into a panel to Chrome Developer Console(I assume Firefox have similar feature and is possible to make the code compatible with both). So we can use it without changing our code.
The UI component can be injected by chrome extension, which is totally separated from the codebase.

To monitor the store data, I assume a little store spy need to be injected as middleware, but it can disable itself when ENV isn't development.

If the store spy is active, it can activate the extension to inject the UI component via sending specific message(aka. chrome.runtime.sendMessage).

With this approach, it could be much easier to use this tool, without changing tons of code to support it.

Any idea?

[gaearon]

We want to explore this direction in the future, but right now there are many other priorities, so it is really up to whether you want to work on this. (There have been attempts before, they are outdated now: #11.)

[gaearon]

To be honest I don't think having two versions of two files is problematic.
It also makes it convenient to have other env differences, e.g. analytics middleware in prod.

https://github.com/gaearon/redux-devtools/blob/next/examples/counter/src/containers/Root.dev.js
https://github.com/gaearon/redux-devtools/blob/next/examples/counter/src/containers/Root.prod.js

https://github.com/gaearon/redux-devtools/blob/next/examples/counter/src/store/configureStore.dev.js
https://github.com/gaearon/redux-devtools/blob/next/examples/counter/src/store/configureStore.prod.js

[timnew]

Yep, I go through the the example codes in next branch yesterday, since I found devTools is undefined 😁 And I agree that having 2 different files avoided some painful situations.

For the chrome extension, I have slightly idea then what described in #11 .

For currently design, DevTool is heavily depends on the patched store, so it is quite difficult to separate everything into a extension.

So I think it might be a little bit easier if we only separated the UI part into extension. For the store part,
we can try to set up a tunnel, like VPN, to forward the actions from front-end code to extension.

We have a shadow store as current devToolsStore, which doesn't change itself, but forwarding the actions via sendMessage or persisted channel.

And we have a real store in the extension, which accepts these action and changing its state.

I'll check out @taylorhakes 's work, and see what we can get.

[zalmoxisus]

Hey, @timnew, I've done it (not only the dev panel):

BTW, @gaearon, if you don't mind, I added you as a coauthor as most of work, actually, was made by you.

[timnew]

@zalmoxisus great work! Then I found the excuse to be lazy again then 😁
Actually, I'm trying to bring OO design back to redux recently. Haven't start any work yet.
I'll try your extension today.

And have you ever considered to publish this tool to chrome web market?

[timnew]

@zalmoxisus I saw your roadmap about publishing the extension. I'll try it now

[zalmoxisus]

@timnew, surely, having it in chrome web market gives us the ability to update the extension automatically.