DevTools as browser extension

[kachkaev]

👋 folks! A Jotai newbie here 👻

I just installed DevTools into my first Jotai project and saw a somewhat noticeable diff in my yarn.lock. Overall, this is fine because project sub-dependencies are not going to affect the production bundle. However, I wonder if it is feasible to make DevTools available as a browser extension, similar to Apollo Client DevTools and Redux DevTools. I remember using those when they just got released and they were only available as project imports. The maintainers eventually released the extensions and thus helped lots of developers with keeping their node_modules small.

How feasible is a browser extension for Jotai DevTools?

Either way, thanks for working on this repo – the UX in the DevTools is quite smooth 💯

[arjunvegda]

Thank you! Glad to hear that you're enjoying the DevTools!

A browser extension is not on the roadmap currently, however, I'm excited about the possibility of exploring it in the future. Perhaps after we flush out a couple more features on the current dev-tools. 😄

What do you think? @dai-shi

[dai-shi]

Well, I personally don't have the bandwidth to follow those things, but why not.

FWIW, there was originally a project led by someone for extension. pmndrs/jotai#918

[arjunvegda]

Small update: I'm playing around with the https://developer.chrome.com/docs/web-platform/document-picture-in-picture/ API and it seems promising. It'd most likely require quite a bit of refactoring to get it working.

[tpavlu]

If I get some bandwidth I might take a stab at this.
I was thinking we could just take the same approach redux does and require defining a window.__JOTAI_STORE__ reference

And then just render these dev tools with the hide option removed in a dev tools panel for that store right?

[arjunvegda]

I'm not sure how redux uses a window property 🤔. I'd consider mounting an iFrame or a Shadow dom and communicate with it using postMessage