alpine-collective/alpinejs-devtools

Feature Request: Allow option to detect components in iframes

james0r opened this issue · 4 comments

As far as I can tell this isn't possible currently.

While working with web-based code editors like JSitor, the devtools aren't seeing my components within the iframe preview pane.

I'm not sure whether it would be ideal to auto-detect them (or even possible) or to be able to have a dropdown and select shadow DOMs in the tree, but anyway that we could view the components in these sites would be great.

Thanks!

Last time something like this was mentioned, we held off doing it because bigger projects like React/Vue devtools don't support this kind of thing (see #143)

Although it looks like it might be possible by allowing the user to provide a frameURL when injecting the backend.js, see https://developer.chrome.com/docs/extensions/reference/devtools_inspectedWindow/#executing-code

Yeah I would think with the growing popularity of code sandboxes that this would be a more popular request. I do a ton of prototyping and things like JSitor and would love to be able to use the dev tools. I'll check out that link later today thank you.

Yeah I would think with the growing popularity of code sandboxes that this would be a more popular request. I do a ton of prototyping and things like JSitor and would love to be able to use the dev tools. I'll check out that link later today thank you.

Sure, but React and Vue devtools teams are much bigger/better resourced than this project is and they don't support it last I checked.

If you're able to get a Pull Request working, I'm happy to have a look and get it integrated

I'm going to close this for now.

Like I've mentioned, React/Vue devtools dont do this and they're first-class tools whereas this is community maintained.

If someone opens a PR, I'm happy to get it integrated and reopen this.