New issue
Advanced search Search tips

Issue 680115 link

Starred by 2 users

Issue metadata

Status: Fixed
Owner:
Closed: Sep 20
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Windows
Pri: 2
Type: Feature



Sign in to add a comment

Pinned Properties / Live Console

Reported by moni...@gmail.com, Jan 11 2017

Issue description

UserAgent: 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.
 

Comment 1 by alph@chromium.org, Jan 11 2017

Labels: -Type-Bug Type-Feature
Owner: lushnikov@chromium.org
Status: Assigned (was: Unconfirmed)

Comment 2 by alph@chromium.org, Jan 11 2017

Cc: pfeldman@chromium.org
Doesn't the "Watch" pane solve your problems? 
Screen Shot 2017-01-23 at 5.53.26 PM.png
28.5 KB View Download

Comment 4 by moni...@gmail.com, 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
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.

Comment 6 by moni...@gmail.com, 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.

Owner: kozy@chromium.org
Over to @kozy who's our debugging innovations guru

Comment 8 by kozy@chromium.org, Dec 5 2017

Cc: kozy@chromium.org
 Issue 647256  has been merged into this issue.
Owner: l...@chromium.org
Status: Fixed (was: Assigned)
I believe pinned expressions are implemented and shipped in our console :)

Sign in to add a comment