Front end debugging using remote web inspector - how?

Just started playing around with some UI work for the first time since Homey 2.0. These days you need to use the native app. I can’t seem to connect to it from the web inspector though, the developer menu keeps saying “No inspectable applications”. Is there a developer mode hidden somewhere that I need to activate?

(For clarity, I am not asking about debugging the back-end Node application, this I can do just fine in Chrome. I am asking about debugging the front end parts using the web inspector in Safari).

The native app is based on React Native (as far as know), so it’s a compiled app, not a web app running inside a web view.

If you want to debug things like settings pages or custom pairing templates, I’ve written a few simple mocking tools so you can develop those in a regular browser instead of having to upload the app after every change.

Thanks! Sounds awesome, will have a look.

Ans yes, I meant debugging my app HTML (presumably running in a UIWebView), not the React native system UI.

For completeness, I checked the Apple docs and apparently only apps signed with developer provisioning profiles show up in the inspector. Ideally, Athom would provide this for the development community.

Yes, that would be a much better solution. The mocks work reasonably well, but you have to run your (desktop) browser in “device emulation mode” to get a sense of how it will look inside the app, and then there are still lots of annoying differences that make fine-tuning a PITA.

Incremental app uploads are also high on most developers’ wish list, but I’ve given up on that ever appearing; same for source maps for internal (minified) JS libraries.