# Front end debugging using remote web inspector - how?

**URL:** <https://community.homey.app/t/front-end-debugging-using-remote-web-inspector-how/15792>\
**Category:** Developers\
**Created:** [July 19, 2019, 9:09pm UTC](https://community.homey.app/t/front-end-debugging-using-remote-web-inspector-how/15792 "2019-07-19T21:09:58Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Kyrcio](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/kyrcio/32/10170_2.png) [@Kyrcio](https://community.homey.app/u/Kyrcio)\
**Post date:** [July 19, 2019, 9:09pm UTC](https://community.homey.app/t/front-end-debugging-using-remote-web-inspector-how/15792/1 "2019-07-19T21:09:58Z")

</div>

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).

---

<div class="post-metadata">

**Author:** ![robertklep](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/robertklep/32/160628_2.png) [@robertklep](https://community.homey.app/u/robertklep)\
**Post date:** [July 20, 2019, 6:29am UTC](https://community.homey.app/t/front-end-debugging-using-remote-web-inspector-how/15792/2 "2019-07-20T06:29:52Z")

</div>

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](https://github.com/robertklep/homey-mocks) so you can develop those in a regular browser instead of having to upload the app after every change.

---

<div class="post-metadata">

**Author:** ![Kyrcio](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/kyrcio/32/10170_2.png) [@Kyrcio](https://community.homey.app/u/Kyrcio)\
**Post date:** [July 20, 2019, 9:09am UTC](https://community.homey.app/t/front-end-debugging-using-remote-web-inspector-how/15792/3 "2019-07-20T09:09:27Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![robertklep](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/robertklep/32/160628_2.png) [@robertklep](https://community.homey.app/u/robertklep)\
**Post date:** [July 20, 2019, 10:25am UTC](https://community.homey.app/t/front-end-debugging-using-remote-web-inspector-how/15792/4 "2019-07-20T10:25:27Z")

</div>

> [@Kyrcio](#):
>
> 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.