New issue
Advanced search Search tips

Issue 849875 link

Starred by 3 users

Issue metadata

Status: Fixed
Owner:
Closed: Sep 17
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: ----
Pri: 3
Type: Bug



Sign in to add a comment

DevTools: expose some way to "watch" for state changes in Console

Project Member Reported by l...@chromium.org, Jun 5 2018

Issue description

DevTools currently has Watch expressions in the Sources sidebar.  We should explore ways to make it more convenient to observe state changes from Console.

Use cases:
- To check whether an element's scrollTop has changed / is at the bottom, one needs to evaluate the same expression in the Console over and over (UpArrow + Enter repeatedly), or do a setInterval.

Doc:
https://docs.google.com/document/d/1vlZXEA6NYCPNaIuNerA0W8K1HElynKTCO3H1CtlTO_o/edit?usp=sharing
 
Project Member

Comment 1 by bugdroid1@chromium.org, Jul 12

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/589cdcb33ef96770a2c3e4a9c76ee439d1e2e56e

commit 589cdcb33ef96770a2c3e4a9c76ee439d1e2e56e
Author: Erik Luo <luoe@chromium.org>
Date: Thu Jul 12 21:54:16 2018

DevTools: pinned expressions in console

Part 1: introduce pins behind an experiment.
- Prompt has 'pin' button to add current expression to pins
- Pin pane sticks to the top of the Console, with max height
- Pins have multiline editors and a value preview that shows
  "not available" when there is an error

Screenshot: https://imgur.com/a/Ahdtosa

Bug:  849875 
Change-Id: Ib0b8bafd97551f823ff8b64d13c5259f42328994
Reviewed-on: https://chromium-review.googlesource.com/1087509
Commit-Queue: Erik Luo <luoe@chromium.org>
Reviewed-by: Dmitry Gozman <dgozman@chromium.org>
Reviewed-by: Joel Einbinder <einbinder@chromium.org>
Cr-Commit-Position: refs/heads/master@{#574740}
[modify] https://crrev.com/589cdcb33ef96770a2c3e4a9c76ee439d1e2e56e/third_party/blink/renderer/devtools/BUILD.gn
[add] https://crrev.com/589cdcb33ef96770a2c3e4a9c76ee439d1e2e56e/third_party/blink/renderer/devtools/front_end/console/ConsolePinPane.js
[modify] https://crrev.com/589cdcb33ef96770a2c3e4a9c76ee439d1e2e56e/third_party/blink/renderer/devtools/front_end/console/ConsolePrompt.js
[modify] https://crrev.com/589cdcb33ef96770a2c3e4a9c76ee439d1e2e56e/third_party/blink/renderer/devtools/front_end/console/ConsoleView.js
[add] https://crrev.com/589cdcb33ef96770a2c3e4a9c76ee439d1e2e56e/third_party/blink/renderer/devtools/front_end/console/consolePinPane.css
[modify] https://crrev.com/589cdcb33ef96770a2c3e4a9c76ee439d1e2e56e/third_party/blink/renderer/devtools/front_end/console/consoleView.css
[modify] https://crrev.com/589cdcb33ef96770a2c3e4a9c76ee439d1e2e56e/third_party/blink/renderer/devtools/front_end/console/module.json
[modify] https://crrev.com/589cdcb33ef96770a2c3e4a9c76ee439d1e2e56e/third_party/blink/renderer/devtools/front_end/main/Main.js

Project Member

Comment 2 by bugdroid1@chromium.org, Jul 23

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/f8ffab5d79243cb7de978d17669e8decdb9141df

commit f8ffab5d79243cb7de978d17669e8decdb9141df
Author: Erik Luo <luoe@chromium.org>
Date: Mon Jul 23 23:48:44 2018

DevTools: generalize preview without side effect builder

Introduces JavaScriptREPL, a utility that includes
- Logic used by EagerEval for building side-effect-free previews
- Console prompt's preprocessing logic
  (object literal wrapping and top level await)

Bug:  849875 
Change-Id: Ie8146435fced9ebf440b43c225d25ef145416247
Reviewed-on: https://chromium-review.googlesource.com/1145911
Reviewed-by: Dmitry Gozman <dgozman@chromium.org>
Commit-Queue: Erik Luo <luoe@chromium.org>
Cr-Commit-Position: refs/heads/master@{#577341}
[modify] https://crrev.com/f8ffab5d79243cb7de978d17669e8decdb9141df/third_party/WebKit/LayoutTests/http/tests/devtools/console/console-xpath-expected.txt
[modify] https://crrev.com/f8ffab5d79243cb7de978d17669e8decdb9141df/third_party/WebKit/LayoutTests/http/tests/devtools/console/console-xpath.js
[modify] https://crrev.com/f8ffab5d79243cb7de978d17669e8decdb9141df/third_party/WebKit/LayoutTests/http/tests/devtools/console/viewport-testing/console-runtime-result-below-prompt.js
[modify] https://crrev.com/f8ffab5d79243cb7de978d17669e8decdb9141df/third_party/WebKit/LayoutTests/http/tests/devtools/sources/debugger-console/debug-console-command.js
[modify] https://crrev.com/f8ffab5d79243cb7de978d17669e8decdb9141df/third_party/blink/renderer/devtools/BUILD.gn
[modify] https://crrev.com/f8ffab5d79243cb7de978d17669e8decdb9141df/third_party/blink/renderer/devtools/front_end/console/ConsolePrompt.js
[add] https://crrev.com/f8ffab5d79243cb7de978d17669e8decdb9141df/third_party/blink/renderer/devtools/front_end/object_ui/JavaScriptREPL.js
[modify] https://crrev.com/f8ffab5d79243cb7de978d17669e8decdb9141df/third_party/blink/renderer/devtools/front_end/object_ui/ObjectPropertiesSection.js
[modify] https://crrev.com/f8ffab5d79243cb7de978d17669e8decdb9141df/third_party/blink/renderer/devtools/front_end/object_ui/RemoteObjectPreviewFormatter.js
[modify] https://crrev.com/f8ffab5d79243cb7de978d17669e8decdb9141df/third_party/blink/renderer/devtools/front_end/object_ui/module.json
[modify] https://crrev.com/f8ffab5d79243cb7de978d17669e8decdb9141df/third_party/blink/renderer/devtools/front_end/sdk/RuntimeModel.js
[modify] https://crrev.com/f8ffab5d79243cb7de978d17669e8decdb9141df/third_party/blink/renderer/devtools/front_end/sources/SourcesPanel.js

Project Member

Comment 3 by bugdroid1@chromium.org, Jul 24

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/b0290b0756fefbc1ae6dce3fa986f5de4fbdc021

commit b0290b0756fefbc1ae6dce3fa986f5de4fbdc021
Author: Erik Luo <luoe@chromium.org>
Date: Tue Jul 24 01:36:18 2018

DevTools: continuously update Console pins on interval

Part 2: live updating pins
- same JSAutocomplete, `await` processing, previews as
  ConsolePrompt
- 250ms interval to update pins
- prevent side-effects while editing text (editor has focus)

Screenshot: https://imgur.com/a/zaPlRTC

Bug:  849875 
Change-Id: I0cd18101e58a6ff4e71e674633409ca0e015e1e7
Reviewed-on: https://chromium-review.googlesource.com/1096417
Commit-Queue: Erik Luo <luoe@chromium.org>
Reviewed-by: Dmitry Gozman <dgozman@chromium.org>
Cr-Commit-Position: refs/heads/master@{#577397}
[add] https://crrev.com/b0290b0756fefbc1ae6dce3fa986f5de4fbdc021/third_party/WebKit/LayoutTests/http/tests/devtools/console/console-pins-expected.txt
[add] https://crrev.com/b0290b0756fefbc1ae6dce3fa986f5de4fbdc021/third_party/WebKit/LayoutTests/http/tests/devtools/console/console-pins.js
[modify] https://crrev.com/b0290b0756fefbc1ae6dce3fa986f5de4fbdc021/third_party/blink/renderer/devtools/front_end/console/ConsolePinPane.js
[modify] https://crrev.com/b0290b0756fefbc1ae6dce3fa986f5de4fbdc021/third_party/blink/renderer/devtools/front_end/console/ConsolePrompt.js
[modify] https://crrev.com/b0290b0756fefbc1ae6dce3fa986f5de4fbdc021/third_party/blink/renderer/devtools/front_end/main/Main.js
[modify] https://crrev.com/b0290b0756fefbc1ae6dce3fa986f5de4fbdc021/third_party/blink/renderer/devtools/front_end/sdk/RuntimeModel.js

Project Member

Comment 4 by bugdroid1@chromium.org, Aug 25

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/811a4303b8b973d61567d61372ec8e1d692037c0

commit 811a4303b8b973d61567d61372ec8e1d692037c0
Author: Erik Luo <luoe@chromium.org>
Date: Sat Aug 25 02:15:37 2018

DevTools: iterate on console pin interaction UX

- Console prompt is cleared when text is pinned
- Pins persist across refresh
- Newly created pin runs with side effects until text differs
  or new expression is committed (on blur)
- Ctrl-Enter moves focus from Pin to Console prompt
- Added command menu option to create new pin
- Pressing Tab indents, moves focus iff pin is empty
  (same logic as Console prompt)
- Pins producing errors show error message on red background
- Pin text is trimmed upon blur/commit

Bug:  849875 
Change-Id: I641abb6b5e19a84c17b1a6cd3e50ca7b459f2015
Reviewed-on: https://chromium-review.googlesource.com/1141096
Commit-Queue: Erik Luo <luoe@chromium.org>
Reviewed-by: Andrey Lushnikov <lushnikov@chromium.org>
Reviewed-by: Joel Einbinder <einbinder@chromium.org>
Cr-Commit-Position: refs/heads/master@{#586108}
[modify] https://crrev.com/811a4303b8b973d61567d61372ec8e1d692037c0/third_party/blink/renderer/devtools/front_end/console/ConsolePinPane.js
[modify] https://crrev.com/811a4303b8b973d61567d61372ec8e1d692037c0/third_party/blink/renderer/devtools/front_end/console/ConsolePrompt.js
[modify] https://crrev.com/811a4303b8b973d61567d61372ec8e1d692037c0/third_party/blink/renderer/devtools/front_end/console/ConsoleView.js
[modify] https://crrev.com/811a4303b8b973d61567d61372ec8e1d692037c0/third_party/blink/renderer/devtools/front_end/console/consolePinPane.css
[modify] https://crrev.com/811a4303b8b973d61567d61372ec8e1d692037c0/third_party/blink/renderer/devtools/front_end/console/module.json
[modify] https://crrev.com/811a4303b8b973d61567d61372ec8e1d692037c0/third_party/blink/renderer/devtools/front_end/object_ui/JavaScriptREPL.js
[modify] https://crrev.com/811a4303b8b973d61567d61372ec8e1d692037c0/third_party/blink/renderer/devtools/front_end/sdk/RuntimeModel.js

Cc: l...@chromium.org vamshi.kommuri@chromium.org
 Issue 863282  has been merged into this issue.
Status: Fixed (was: Assigned)
Work completed for now.  We will monitor feedback before deciding on further iteration.

Sign in to add a comment