Layout debugging

[wcarmon]

Checklist

• I have searched the issue tracker for open issues that relate to the same feature, before opening a new one.
• This issue only relates to a single feature. I will open new issues for any other features.

Is your feature request related to a problem?

Please advise on how to debug layout issues.

For example, in chrome, the developer tools show a widget tree, allow you to click a widget to find it in the tree, allow you to see a box model for margin & padding.

Is it possible to construct a solution with the existing API?

I'm open to ideas and happy to implement

Describe the solution you'd like to see.

Perhaps there is some way to do something basic with borders and click events?

[andydotxyz]

Great idea, let's figure out how we can get this in on v2.4.0.
Perhaps boxes around everything in some debug mode? Hover or ctrl-hover to show a widget?
Or maybe something more low-level like logging the widget tree, or opening an inspector window?

[Bluebugs]

Inspector are great tool. It seems common in the go ecosystem to have a "service" exporting a remote API under certain circumstances that a tool can connect to and explore. What do you think of exporting the widget tree live over http to an inspector tool? With maybe the ability to highlight a specific widget from the inspector tool. This would enable debugging layout also on device and not just on the same machine.

[andydotxyz]

That is one approach, and what it enables would be very useful.
Debugging layout is a big feature - though I wonder if we can make use of the ability to JSON convert the tree that is already in. Whichever route we take it should be consistent so only one approach to tree debug is maintained.

[andydotxyz]

First pass for visual inspection now landed - on develop do "go run -tags debug ." to see.
Follow on work could expand on this - let's track in new tickets though.