Pinned Properties / Live Console
Reported by
moni...@gmail.com,
Jan 11 2017
|
||||
Issue descriptionUserAgent: Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.87 Safari/537.36 Steps to reproduce the problem: Feature request Often times I find myself outputting massive console debug messages, only to dump certain DOM properties of certain elements. For instance, while developing certain UI behaviors related to scroll, I was interested in having instant feedback on properties such as `scrollTop`, `scrollHeight`, `getBoundingClientRect()` for specific elements. What is the expected behavior? I was wondering if we could have a feature to pin specific properties of specific elements, and then view all of the pinned properties in a continuously updated, dedicated pane (Pinned Properties or Live Console, you name it). I'm not sure how the things could go with above-mentioned `getBoundingClientRect()`, but for "static" properties I think the interface would be obvious. Then, when scrolling or otherwise interacting with the interface, I would see instant feedback of the properties - which would in turn allow me to debug methods or algorithms more easily. What went wrong? The major benefit would be avoidance of continuous console output flood and scrolling (if you don't debounce events, the amount of messages can become ridiculously unhelpful). Did this work before? N/A Chrome version: 55.0.2883.87 Channel: stable OS Version: 6.3 Flash Version: Shockwave Flash 24.0 r0 If this feature happens to go into dev scope, please make an effort to maintain pinned properties upon page reload - just as latest selection in Elements is retained whenever possible.
,
Jan 11 2017
,
Jan 23 2017
Doesn't the "Watch" pane solve your problems?
,
Jan 23 2017
I might be wrong, but from what I can see, the Watch and Event Listeners Breakpoints will interrupt my interaction with UI, which is not my point. I should be able to select, for example, scrollTop, scrollHeight from element A, scrollTop from element B, and be able to watch the values changes as I do the scrolling. I tried to look out for an example of this applications but none of them managed to show how to achieve that without breaking into a breakpoint and stopping the operation. I will try to assign the properties to variables, and see if that can be achieved. If you believe the Watch pane is all I need for that purpose, maybe it's just a matter of extending the docs... /Artur
,
Jan 24 2017
Ah, I see now, thank you. I think we can come up with something for here, like doing polling for the values and making sure this doesn't take too long to compute.
,
Jan 24 2017
Basically, I imagine the flow as collecting items to (kind of) a shopping cart: you pick the element properties from Properties pane and then have an eye on them in one place. Plus, DevTools does its best to make them persistent between page reloads.
,
Dec 5 2017
Over to @kozy who's our debugging innovations guru
,
Dec 5 2017
,
Sep 20
I believe pinned expressions are implemented and shipped in our console :) |
||||
►
Sign in to add a comment |
||||
Comment 1 by alph@chromium.org
, Jan 11 2017Owner: lushnikov@chromium.org
Status: Assigned (was: Unconfirmed)