How to run debugger on mobile view?

tjc4 · 2021-01-28T22:28:44.281Z

I have an app with top nav on large screens and bottom nav on small screens. Top nav is working. Bottom nav isn’t.

I’d like to debug bottom nav but when I go into chrome dev tools and select a mobile device screen the debugger doesn’t fit on screen. Looks like this:

image425×725 65 KB

How do I figure out what’s going wrong with my mobile-only elements and their associated workflows?

tjc4 · 2021-01-29T00:44:56.812Z

I still haven’t figured out if you can run debugger on a mobile size screen but I was able to figure out a workaround: just make your mobile element temporarily visible on larger screens.

Normal - Mobile Only:

Temporary - Debugging:

dee · 2023-01-24T07:17:15.596Z

For anyone looking for this, here’s a workaround I found.
With Debug mode on
In Chrome > View > Developer > Developer Tools
In Elements tab > scroll down until you find section

Then edit the Styles
Deselect display: flex on the top bar

Screenshot 2023-01-24 at 07.52.31811×426 109 KB

Deselect overflow on the workflow-vert-flex

Screenshot 2023-01-24 at 07.53.46811×495 126 KB

… or any other section you need changing.

bill10 · 2023-06-04T06:18:45.039Z

Interesting solution, the debugger-canvas doesn’t exist for a mobile-mode of a browser, only the desktop-mode. Any suggestions?