New issue
Advanced search Search tips
Note: Color blocks (like █ or █) mean that a user may not be available. Tooltip shows the reason.

Issue 865674 link

Starred by 1 user
Status: Fixed
Owner:
l...@chromium.org
Closed: Dec 20
Cc:
hwi@chromium.org
█ julialiang@chromium.org
Components:
EstimatedDays: ----
NextAction: ----
OS: ----
Pri: 3
Type: Bug



Sign in to add a comment

DevTools: keyboard navigation in Console/ObjectPropertiesSections

Project Member Reported by l...@chromium.org, Jul 19 
There is currently no way to navigate through the Console log or ObjectPropertiesSections with the keyboard.
Project Member

Comment 1 by bugdroid1@chromium.org, Jul 30 

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

commit 8ee170a089cd03e7f0b7ab6982174d15d0180f8a
Author: Erik Luo <luoe@chromium.org>
Date: Mon Jul 30 21:23:31 2018

DevTools: [console-stability] more precise viewport

Simplify visible index calculation and tests by
- Remove padding on viewport container
- Remove negative margin (was on error/warning logs)

Improve visible index / scrollItemIntoView() precision by
- Rebuild cumulative heights even if each message is slightly off
- No need to scroll last item into view if it is fully visible
- Perform extra scroll on scroll into view in case items above
  were larger than expected
- Message height measurements now include wrapper's border

Bug:  865674 
Change-Id: Id4abad0e40a971dff9accbc7b904427ea02f728c
Reviewed-on: https://chromium-review.googlesource.com/1144254
Commit-Queue: Erik Luo <luoe@chromium.org>
Reviewed-by: Andrey Lushnikov <lushnikov@chromium.org>
Cr-Commit-Position: refs/heads/master@{#579175}
[modify] https://crrev.com/8ee170a089cd03e7f0b7ab6982174d15d0180f8a/third_party/WebKit/LayoutTests/http/tests/devtools/console/console-viewport-control-expected.txt
[modify] https://crrev.com/8ee170a089cd03e7f0b7ab6982174d15d0180f8a/third_party/WebKit/LayoutTests/http/tests/devtools/console/console-viewport-control.js
[modify] https://crrev.com/8ee170a089cd03e7f0b7ab6982174d15d0180f8a/third_party/WebKit/LayoutTests/http/tests/devtools/console/console-viewport-indices-expected.txt
[modify] https://crrev.com/8ee170a089cd03e7f0b7ab6982174d15d0180f8a/third_party/WebKit/LayoutTests/http/tests/devtools/console/console-viewport-indices.js
[modify] https://crrev.com/8ee170a089cd03e7f0b7ab6982174d15d0180f8a/third_party/WebKit/LayoutTests/http/tests/devtools/console/console-viewport-selection-expected.txt
[modify] https://crrev.com/8ee170a089cd03e7f0b7ab6982174d15d0180f8a/third_party/WebKit/LayoutTests/http/tests/devtools/console/console-viewport-selection.js
[modify] https://crrev.com/8ee170a089cd03e7f0b7ab6982174d15d0180f8a/third_party/blink/renderer/devtools/front_end/console/ConsoleView.js
[modify] https://crrev.com/8ee170a089cd03e7f0b7ab6982174d15d0180f8a/third_party/blink/renderer/devtools/front_end/console/ConsoleViewMessage.js
[modify] https://crrev.com/8ee170a089cd03e7f0b7ab6982174d15d0180f8a/third_party/blink/renderer/devtools/front_end/console/ConsoleViewport.js
[modify] https://crrev.com/8ee170a089cd03e7f0b7ab6982174d15d0180f8a/third_party/blink/renderer/devtools/front_end/console/consoleView.css
[modify] https://crrev.com/8ee170a089cd03e7f0b7ab6982174d15d0180f8a/third_party/blink/renderer/devtools/front_end/console_test_runner/ConsoleTestRunner.js
Project Member

Comment 2 by bugdroid1@chromium.org, Aug 25 

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

commit 3daece8a71251fd4cbc79121572f11cdc3739cad
Author: Erik Luo <luoe@chromium.org>
Date: Sat Aug 25 02:06:51 2018

DevTools: EventListenersView keyboard navigability

Introduces "setShowSelectionOnKeyboardFocus" to make a
tree's selection visible only when it has focus. Navigating a
tree via Arrow keys also happens to require items be:
focusable and selectable.

All ObjectPropertiesSections are now focusable when there is
a selected element. Later CLs will add default selections to
Sources' Watches, Scope, and Network's JSONView.

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

Bug:  865674 
Change-Id: Ie7239ddfe4ead101baa0e64dd4893b1587b95336
Reviewed-on: https://chromium-review.googlesource.com/1152463
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@{#586106}
[modify] https://crrev.com/3daece8a71251fd4cbc79121572f11cdc3739cad/third_party/WebKit/LayoutTests/http/tests/devtools/console/console-format-classes-expected.txt
[modify] https://crrev.com/3daece8a71251fd4cbc79121572f11cdc3739cad/third_party/blink/renderer/devtools/front_end/event_listeners/EventListenersView.js
[modify] https://crrev.com/3daece8a71251fd4cbc79121572f11cdc3739cad/third_party/blink/renderer/devtools/front_end/object_ui/ObjectPropertiesSection.js
[modify] https://crrev.com/3daece8a71251fd4cbc79121572f11cdc3739cad/third_party/blink/renderer/devtools/front_end/ui/treeoutline.css
[modify] https://crrev.com/3daece8a71251fd4cbc79121572f11cdc3739cad/third_party/blink/renderer/devtools/front_end/ui/treeoutline.js
Project Member

Comment 3 by bugdroid1@chromium.org, Sep 1 

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

commit 8fce8ab13eba5c18c14e308a9821d0675e0a4a1e
Author: Erik Luo <luoe@chromium.org>
Date: Sat Sep 01 01:08:07 2018

DevTools: allow Console message keyboard navigation

This makes Consoles messages focusable and navigable using:
ArrowUp/Down/Left/Right, Home, End

Screenshot: https://imgur.com/a/6JWY0iU

Bug:  865674 
Change-Id: I4166bf4d8d57856c6d1f7d51ef29e2dea0c088eb
Reviewed-on: https://chromium-review.googlesource.com/1144453
Commit-Queue: Erik Luo <luoe@chromium.org>
Reviewed-by: Joel Einbinder <einbinder@chromium.org>
Cr-Commit-Position: refs/heads/master@{#588237}
[add] https://crrev.com/8fce8ab13eba5c18c14e308a9821d0675e0a4a1e/third_party/WebKit/LayoutTests/http/tests/devtools/console/viewport-testing/console-key-navigation-expected.txt
[add] https://crrev.com/8fce8ab13eba5c18c14e308a9821d0675e0a4a1e/third_party/WebKit/LayoutTests/http/tests/devtools/console/viewport-testing/console-key-navigation.js
[modify] https://crrev.com/8fce8ab13eba5c18c14e308a9821d0675e0a4a1e/third_party/blink/renderer/devtools/front_end/console/ConsoleView.js
[modify] https://crrev.com/8fce8ab13eba5c18c14e308a9821d0675e0a4a1e/third_party/blink/renderer/devtools/front_end/console/ConsoleViewMessage.js
[modify] https://crrev.com/8fce8ab13eba5c18c14e308a9821d0675e0a4a1e/third_party/blink/renderer/devtools/front_end/console/ConsoleViewport.js
[modify] https://crrev.com/8fce8ab13eba5c18c14e308a9821d0675e0a4a1e/third_party/blink/renderer/devtools/front_end/console/consoleView.css
[modify] https://crrev.com/8fce8ab13eba5c18c14e308a9821d0675e0a4a1e/third_party/blink/renderer/devtools/front_end/elements/stylesSidebarPane.css
[modify] https://crrev.com/8fce8ab13eba5c18c14e308a9821d0675e0a4a1e/third_party/blink/renderer/devtools/front_end/main/Main.js
Project Member

Comment 4 by bugdroid1@chromium.org, Sep 19 

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

commit 0d807ded6e48abbaab18f73caf5b57739e9068d4
Author: Erik Luo <luoe@chromium.org>
Date: Wed Sep 19 22:37:13 2018

DevTools: clicking title should allow Object keyboard navigation

Before, TreeOutline's keydown handler had 'useCapture' and checked
whether the target was the selected tree item. This was how nested
TreeOutlines avoided conflict.

Now, TreeOutlines with selection respond to keyboard navigation from
any target. We now assume that nested TreeOutlines, inplace editors,
etc will consume the event before it gets to an outer TreeOutline.

Bug:  865674 
Change-Id: I36af018b6da5a836269a8356a9e97db6c83d1c40
Reviewed-on: https://chromium-review.googlesource.com/1223186
Reviewed-by: Joel Einbinder <einbinder@chromium.org>
Commit-Queue: Erik Luo <luoe@chromium.org>
Cr-Commit-Position: refs/heads/master@{#592582}
[modify] https://crrev.com/0d807ded6e48abbaab18f73caf5b57739e9068d4/third_party/WebKit/LayoutTests/http/tests/devtools/unit/treeoutline-keyboard-expected.txt
[modify] https://crrev.com/0d807ded6e48abbaab18f73caf5b57739e9068d4/third_party/WebKit/LayoutTests/http/tests/devtools/unit/treeoutline-keyboard.js
[modify] https://crrev.com/0d807ded6e48abbaab18f73caf5b57739e9068d4/third_party/blink/renderer/devtools/front_end/object_ui/ObjectPropertiesSection.js
[modify] https://crrev.com/0d807ded6e48abbaab18f73caf5b57739e9068d4/third_party/blink/renderer/devtools/front_end/ui/treeoutline.js
Project Member

Comment 5 by bugdroid1@chromium.org, Sep 20 

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

commit 1d9c78149597bc68797982d9ac6294f9595fcd9f
Author: Erik Luo <luoe@chromium.org>
Date: Thu Sep 20 02:52:39 2018

DevTools: do not focus prompt on Console message click

With keyboard navigation experiment enabled,

- Switch viewport's focus proxy from `element` > `_contentElement`
- Clicking a message will select it
- Click-selection applies "blue" highlight, except when a user
  expands objects, groups, or traces
- Move focus from log > prompt when user types on 'keydown'
- Better distinguish events below prompt (geometry works with
  MouseEvents, but not FocusEvents)
- Stick to bottom when prompt gains focus

Bug:  865674 
Change-Id: I473bcdf714408406b0ce7a49772589daf3cbe9cb
Reviewed-on: https://chromium-review.googlesource.com/1171814
Reviewed-by: Joel Einbinder <einbinder@chromium.org>
Commit-Queue: Erik Luo <luoe@chromium.org>
Cr-Commit-Position: refs/heads/master@{#592669}
[add] https://crrev.com/1d9c78149597bc68797982d9ac6294f9595fcd9f/third_party/WebKit/LayoutTests/http/tests/devtools/console/viewport-testing/console-clicking-messages-expected.txt
[add] https://crrev.com/1d9c78149597bc68797982d9ac6294f9595fcd9f/third_party/WebKit/LayoutTests/http/tests/devtools/console/viewport-testing/console-clicking-messages.js
[modify] https://crrev.com/1d9c78149597bc68797982d9ac6294f9595fcd9f/third_party/WebKit/LayoutTests/http/tests/devtools/console/viewport-testing/console-key-navigation-expected.txt
[modify] https://crrev.com/1d9c78149597bc68797982d9ac6294f9595fcd9f/third_party/WebKit/LayoutTests/http/tests/devtools/console/viewport-testing/console-key-navigation.js
[modify] https://crrev.com/1d9c78149597bc68797982d9ac6294f9595fcd9f/third_party/blink/renderer/devtools/front_end/console/ConsoleView.js
[modify] https://crrev.com/1d9c78149597bc68797982d9ac6294f9595fcd9f/third_party/blink/renderer/devtools/front_end/console/ConsoleViewMessage.js
[modify] https://crrev.com/1d9c78149597bc68797982d9ac6294f9595fcd9f/third_party/blink/renderer/devtools/front_end/console/ConsoleViewport.js
[modify] https://crrev.com/1d9c78149597bc68797982d9ac6294f9595fcd9f/third_party/blink/renderer/devtools/front_end/console/consoleView.css
Project Member

Comment 6 by bugdroid1@chromium.org, Sep 25 

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

commit cfbc356cf7edaca10b24b710ddc470d1f8a19f1a
Author: Erik Luo <luoe@chromium.org>
Date: Tue Sep 25 21:16:00 2018

DevTools: keyboard to expand traces in Console

- Use ArrowLeft/Right to expand/collapse console.group's and traces
  (console.trace, console.error, console.warn)
- Click listener for Groups now added to each message element.

Bug:  865674 
Change-Id: Ifa8156d8f0a01a541e40a5cf84aaa59a4a0329f9
Reviewed-on: https://chromium-review.googlesource.com/1237614
Reviewed-by: Joel Einbinder <einbinder@chromium.org>
Commit-Queue: Erik Luo <luoe@chromium.org>
Cr-Commit-Position: refs/heads/master@{#594102}
[add] https://crrev.com/cfbc356cf7edaca10b24b710ddc470d1f8a19f1a/third_party/WebKit/LayoutTests/http/tests/devtools/console/viewport-testing/console-key-expand-expected.txt
[add] https://crrev.com/cfbc356cf7edaca10b24b710ddc470d1f8a19f1a/third_party/WebKit/LayoutTests/http/tests/devtools/console/viewport-testing/console-key-expand.js
[modify] https://crrev.com/cfbc356cf7edaca10b24b710ddc470d1f8a19f1a/third_party/blink/renderer/devtools/front_end/console/ConsoleView.js
[modify] https://crrev.com/cfbc356cf7edaca10b24b710ddc470d1f8a19f1a/third_party/blink/renderer/devtools/front_end/console/ConsoleViewMessage.js
Project Member

Comment 7 by bugdroid1@chromium.org, Oct 8 

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

commit c4c8bf57e8cae49003ca59ed29901feb91b0dc45
Author: Erik Luo <luoe@chromium.org>
Date: Mon Oct 08 20:37:46 2018

DevTools: navigate, expand Console objects via keyboard

With experiment enabled:
- Use Arrow keys to expand ObjectPropertiesSections in Console

Bug:  865674 
Change-Id: Ia85969eb7b8f282e2403ab2a5d140821f2e977e6
Reviewed-on: https://chromium-review.googlesource.com/c/1239441
Commit-Queue: Erik Luo <luoe@chromium.org>
Reviewed-by: Joel Einbinder <einbinder@chromium.org>
Cr-Commit-Position: refs/heads/master@{#597671}
[modify] https://crrev.com/c4c8bf57e8cae49003ca59ed29901feb91b0dc45/third_party/WebKit/LayoutTests/http/tests/devtools/console/viewport-testing/console-key-expand-expected.txt
[modify] https://crrev.com/c4c8bf57e8cae49003ca59ed29901feb91b0dc45/third_party/WebKit/LayoutTests/http/tests/devtools/console/viewport-testing/console-key-expand.js
[modify] https://crrev.com/c4c8bf57e8cae49003ca59ed29901feb91b0dc45/third_party/blink/renderer/devtools/front_end/console/ConsoleViewMessage.js
[modify] https://crrev.com/c4c8bf57e8cae49003ca59ed29901feb91b0dc45/third_party/blink/renderer/devtools/front_end/console/ConsoleViewport.js
[modify] https://crrev.com/c4c8bf57e8cae49003ca59ed29901feb91b0dc45/third_party/blink/renderer/devtools/front_end/console_test_runner/ConsoleTestRunner.js
Project Member

Comment 8 by bugdroid1@chromium.org, Nov 1 

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

commit 3ea41c834168b61e1e2c1b32d23d1775f9ddbe71
Author: Erik Luo <luoe@chromium.org>
Date: Thu Nov 01 17:57:01 2018

[DevTools] turn Common.Renderer into UI.Renderer

Clients will need to render a generic object/DOMNode, and
be able to call `select()` to select the first child in the
resulting TreeOutline. This CL:
- Turns Common.Renderer > UI.Renderer
- Returns a tree, so interested clients can use it

Bug:  865674 
Change-Id: Id877537a3c8713b99d34e6a4558037e0c8b3a111
Reviewed-on: https://chromium-review.googlesource.com/c/1298023
Reviewed-by: Dmitry Gozman <dgozman@chromium.org>
Reviewed-by: Joel Einbinder <einbinder@chromium.org>
Commit-Queue: Erik Luo <luoe@chromium.org>
Cr-Commit-Position: refs/heads/master@{#604637}
[modify] https://crrev.com/3ea41c834168b61e1e2c1b32d23d1775f9ddbe71/third_party/blink/renderer/devtools/front_end/browser_console/BrowserConsole.js
[modify] https://crrev.com/3ea41c834168b61e1e2c1b32d23d1775f9ddbe71/third_party/blink/renderer/devtools/front_end/browser_console/module.json
[modify] https://crrev.com/3ea41c834168b61e1e2c1b32d23d1775f9ddbe71/third_party/blink/renderer/devtools/front_end/common/ModuleExtensionInterfaces.js
[modify] https://crrev.com/3ea41c834168b61e1e2c1b32d23d1775f9ddbe71/third_party/blink/renderer/devtools/front_end/console/ConsoleViewMessage.js
[modify] https://crrev.com/3ea41c834168b61e1e2c1b32d23d1775f9ddbe71/third_party/blink/renderer/devtools/front_end/elements/ElementsTreeOutline.js
[modify] https://crrev.com/3ea41c834168b61e1e2c1b32d23d1775f9ddbe71/third_party/blink/renderer/devtools/front_end/elements/module.json
[modify] https://crrev.com/3ea41c834168b61e1e2c1b32d23d1775f9ddbe71/third_party/blink/renderer/devtools/front_end/extensions/ExtensionPanel.js
[modify] https://crrev.com/3ea41c834168b61e1e2c1b32d23d1775f9ddbe71/third_party/blink/renderer/devtools/front_end/object_ui/ObjectPropertiesSection.js
[modify] https://crrev.com/3ea41c834168b61e1e2c1b32d23d1775f9ddbe71/third_party/blink/renderer/devtools/front_end/object_ui/module.json
[modify] https://crrev.com/3ea41c834168b61e1e2c1b32d23d1775f9ddbe71/third_party/blink/renderer/devtools/front_end/ui/UIUtils.js
Project Member

Comment 10 by bugdroid1@chromium.org, Nov 2 

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

commit de8a9c26f6a4e28bc14e613e0d97cae69aef749b
Author: Erik Luo <luoe@chromium.org>
Date: Fri Nov 02 06:48:52 2018

DevTools: navigable ElementsTreeOutline in Console

Introduces a common interface between ElementsTreeOutlines and
ObjectPropertiesSections. This allows both to be keyboard navigable
in Console.

Bug:  865674 
Change-Id: I405d161692147374827918cce2369d129620a9fd
Reviewed-on: https://chromium-review.googlesource.com/c/1275225
Commit-Queue: Erik Luo <luoe@chromium.org>
Reviewed-by: Joel Einbinder <einbinder@chromium.org>
Cr-Commit-Position: refs/heads/master@{#604855}
[modify] https://crrev.com/de8a9c26f6a4e28bc14e613e0d97cae69aef749b/third_party/WebKit/LayoutTests/http/tests/devtools/console/viewport-testing/console-key-expand-expected.txt
[modify] https://crrev.com/de8a9c26f6a4e28bc14e613e0d97cae69aef749b/third_party/WebKit/LayoutTests/http/tests/devtools/console/viewport-testing/console-key-expand.js
[modify] https://crrev.com/de8a9c26f6a4e28bc14e613e0d97cae69aef749b/third_party/blink/renderer/devtools/front_end/console/ConsoleViewMessage.js
[modify] https://crrev.com/de8a9c26f6a4e28bc14e613e0d97cae69aef749b/third_party/blink/renderer/devtools/front_end/console/ConsoleViewport.js
[modify] https://crrev.com/de8a9c26f6a4e28bc14e613e0d97cae69aef749b/third_party/blink/renderer/devtools/front_end/elements/ElementsTreeOutline.js
[modify] https://crrev.com/de8a9c26f6a4e28bc14e613e0d97cae69aef749b/third_party/blink/renderer/devtools/front_end/elements/elementsTreeOutline.css
[modify] https://crrev.com/de8a9c26f6a4e28bc14e613e0d97cae69aef749b/third_party/blink/renderer/devtools/front_end/ui/treeoutline.js
Project Member

Comment 11 by bugdroid1@chromium.org, Nov 3 

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

commit fd1d5501044ecd67a133c505ee98029c452d5b0a
Author: Erik Luo <luoe@chromium.org>
Date: Sat Nov 03 01:33:09 2018

DevTools: prevent tab focus for console objects

Focused Objects in Console will now have tabIndex -1 instead of 0.

Bug:  865674 
Change-Id: I382576e1b5ec5ca0bc1c62b8ff0d998c73b18474
Reviewed-on: https://chromium-review.googlesource.com/c/1275266
Commit-Queue: Erik Luo <luoe@chromium.org>
Reviewed-by: Joel Einbinder <einbinder@chromium.org>
Cr-Commit-Position: refs/heads/master@{#605123}
[modify] https://crrev.com/fd1d5501044ecd67a133c505ee98029c452d5b0a/third_party/blink/renderer/devtools/front_end/console/ConsoleViewMessage.js
[modify] https://crrev.com/fd1d5501044ecd67a133c505ee98029c452d5b0a/third_party/blink/renderer/devtools/front_end/elements/ElementsTreeOutline.js
[modify] https://crrev.com/fd1d5501044ecd67a133c505ee98029c452d5b0a/third_party/blink/renderer/devtools/front_end/ui/treeoutline.js
Project Member

Comment 12 by bugdroid1@chromium.org, Nov 7 

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

commit 475f54909aa11ee1d5cdcbf3f355499c694704ad
Author: Erik Luo <luoe@chromium.org>
Date: Wed Nov 07 23:16:37 2018

DevTools: keyboard navigable links in Console

(Behind experiment)
- Navigate to linkified substrings via keyboard
- Press Enter on a selected link to navigate to it

This CL does NOT cover anchors.
Links produced outside of Console will be addressed in a followup,
e.g. BrowserConsole's Network logs, JSPresentationUtils' stack trace

Bug:  865674 
Change-Id: Ib0e1c39823801a9403dcdcf8b68d884197ed9690
Reviewed-on: https://chromium-review.googlesource.com/c/1317925
Reviewed-by: Joel Einbinder <einbinder@chromium.org>
Commit-Queue: Erik Luo <luoe@chromium.org>
Cr-Commit-Position: refs/heads/master@{#606196}
[modify] https://crrev.com/475f54909aa11ee1d5cdcbf3f355499c694704ad/third_party/WebKit/LayoutTests/http/tests/devtools/console/console-log-linkify-links-expected.txt
[modify] https://crrev.com/475f54909aa11ee1d5cdcbf3f355499c694704ad/third_party/WebKit/LayoutTests/http/tests/devtools/console/console-log-linkify-links.js
[add] https://crrev.com/475f54909aa11ee1d5cdcbf3f355499c694704ad/third_party/WebKit/LayoutTests/http/tests/devtools/console/viewport-testing/console-key-links-expected.txt
[add] https://crrev.com/475f54909aa11ee1d5cdcbf3f355499c694704ad/third_party/WebKit/LayoutTests/http/tests/devtools/console/viewport-testing/console-key-links.js
[modify] https://crrev.com/475f54909aa11ee1d5cdcbf3f355499c694704ad/third_party/blink/renderer/devtools/front_end/components/Linkifier.js
[modify] https://crrev.com/475f54909aa11ee1d5cdcbf3f355499c694704ad/third_party/blink/renderer/devtools/front_end/console/ConsoleViewMessage.js
Project Member

Comment 13 by bugdroid1@chromium.org, Nov 21 

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

commit 6a233641478415452d93a94c4850d0fe42ded6a9
Author: Erik Luo <luoe@chromium.org>
Date: Wed Nov 21 19:54:58 2018

DevTools: move BrowserConsole back into Console

Motivated by the desire to make Console links keyboard navigable,
this CL removes the BrowserConsole module and moves logic back into
ConsoleViewMessage.

BrowserConsole did not explicitly depend on BrowserSDK.

Bug:  865674 
Change-Id: Ibb004c52699b1d504b32accdfa4ee19adc907633
Reviewed-on: https://chromium-review.googlesource.com/c/1338329
Reviewed-by: Joel Einbinder <einbinder@chromium.org>
Commit-Queue: Erik Luo <luoe@chromium.org>
Cr-Commit-Position: refs/heads/master@{#610186}
[modify] https://crrev.com/6a233641478415452d93a94c4850d0fe42ded6a9/third_party/WebKit/LayoutTests/http/tests/devtools/console-fetch-logging.js
[modify] https://crrev.com/6a233641478415452d93a94c4850d0fe42ded6a9/third_party/WebKit/LayoutTests/http/tests/devtools/console-resource-errors.js
[modify] https://crrev.com/6a233641478415452d93a94c4850d0fe42ded6a9/third_party/WebKit/LayoutTests/http/tests/devtools/console-xhr-logging-async.js
[modify] https://crrev.com/6a233641478415452d93a94c4850d0fe42ded6a9/third_party/blink/renderer/devtools/BUILD.gn
[delete] https://crrev.com/ec66ff00479e13dec67bb91db6c8fc0c0e2209fc/third_party/blink/renderer/devtools/front_end/browser_console/BrowserConsole.js
[delete] https://crrev.com/ec66ff00479e13dec67bb91db6c8fc0c0e2209fc/third_party/blink/renderer/devtools/front_end/browser_console/module.json
[modify] https://crrev.com/6a233641478415452d93a94c4850d0fe42ded6a9/third_party/blink/renderer/devtools/front_end/console/ConsoleView.js
[modify] https://crrev.com/6a233641478415452d93a94c4850d0fe42ded6a9/third_party/blink/renderer/devtools/front_end/console/ConsoleViewMessage.js
[modify] https://crrev.com/6a233641478415452d93a94c4850d0fe42ded6a9/third_party/blink/renderer/devtools/front_end/console_test_runner/ConsoleTestRunner.js
[modify] https://crrev.com/6a233641478415452d93a94c4850d0fe42ded6a9/third_party/blink/renderer/devtools/front_end/devtools_app.json
[modify] https://crrev.com/6a233641478415452d93a94c4850d0fe42ded6a9/third_party/blink/renderer/devtools/front_end/worker_app.json
Project Member

Comment 14 by bugdroid1@chromium.org, Nov 29 

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

commit 673693d7ce4a970912881b85f707115a66bec37c
Author: Erik Luo <luoe@chromium.org>
Date: Thu Nov 29 03:15:22 2018

DevTools: keyboard navigable Network logs, stacktrace in Console

(Behind experiment) This CL makes these links keyboard navigable:
- Links found in Console logs with source=Network
- Links found in Console stack traces

Bug:  865674 
Change-Id: Icc11d5441e5d7963ffa0b41b07cc8fcdf4575d39
Reviewed-on: https://chromium-review.googlesource.com/c/1318817
Commit-Queue: Erik Luo <luoe@chromium.org>
Reviewed-by: Joel Einbinder <einbinder@chromium.org>
Cr-Commit-Position: refs/heads/master@{#612013}
[modify] https://crrev.com/673693d7ce4a970912881b85f707115a66bec37c/third_party/blink/renderer/devtools/front_end/components/JSPresentationUtils.js
[modify] https://crrev.com/673693d7ce4a970912881b85f707115a66bec37c/third_party/blink/renderer/devtools/front_end/console/ConsoleViewMessage.js
[modify] https://crrev.com/673693d7ce4a970912881b85f707115a66bec37c/third_party/blink/renderer/devtools/front_end/network/NetworkLogViewColumns.js
[modify] https://crrev.com/673693d7ce4a970912881b85f707115a66bec37c/third_party/blink/renderer/devtools/front_end/timeline/TimelineUIUtils.js
[modify] https://crrev.com/673693d7ce4a970912881b85f707115a66bec37c/third_party/blink/web_tests/http/tests/devtools/console/viewport-testing/console-key-expand-expected.txt
[modify] https://crrev.com/673693d7ce4a970912881b85f707115a66bec37c/third_party/blink/web_tests/http/tests/devtools/console/viewport-testing/console-key-expand.js
[modify] https://crrev.com/673693d7ce4a970912881b85f707115a66bec37c/third_party/blink/web_tests/http/tests/devtools/console/viewport-testing/console-key-links-expected.txt
[modify] https://crrev.com/673693d7ce4a970912881b85f707115a66bec37c/third_party/blink/web_tests/http/tests/devtools/console/viewport-testing/console-key-links.js
Project Member

Comment 15 by bugdroid1@chromium.org, Dec 3 

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

commit cc2fb34c6c8a513781dc7d78e827f340605681e9
Author: Erik Luo <luoe@chromium.org>
Date: Mon Dec 03 20:54:27 2018

DevTools: fix stick-to-bottom for Console with keyboard navigation

Keyboard navigation in Console presents new interactions that our
stick-to-bottom (STB) logic should care about.

Prompt
- Before, STB only cared about TextChanged events, but now cares
  about focusin, since users can Tab from messages to prompt

Objects
- Expanding an object results in noticeable scroll-anchoring jumps,
  STB should turn off due to expanding. Expanding a small object
  that can fit in viewport should guarantee it is visible.

Bug:  865674 
Change-Id: I47872110d4bf2261b4940b565f8c926333b66836
Reviewed-on: https://chromium-review.googlesource.com/c/1330350
Commit-Queue: Erik Luo <luoe@chromium.org>
Reviewed-by: Joel Einbinder <einbinder@chromium.org>
Cr-Commit-Position: refs/heads/master@{#613239}
[modify] https://crrev.com/cc2fb34c6c8a513781dc7d78e827f340605681e9/third_party/blink/renderer/devtools/front_end/console/ConsoleView.js
[modify] https://crrev.com/cc2fb34c6c8a513781dc7d78e827f340605681e9/third_party/blink/renderer/devtools/front_end/console/ConsoleViewMessage.js
[modify] https://crrev.com/cc2fb34c6c8a513781dc7d78e827f340605681e9/third_party/blink/renderer/devtools/front_end/console/ConsoleViewport.js
[modify] https://crrev.com/cc2fb34c6c8a513781dc7d78e827f340605681e9/third_party/blink/renderer/devtools/front_end/console/consoleView.css
[modify] https://crrev.com/cc2fb34c6c8a513781dc7d78e827f340605681e9/third_party/blink/renderer/devtools/front_end/console_test_runner/ConsoleTestRunner.js
[modify] https://crrev.com/cc2fb34c6c8a513781dc7d78e827f340605681e9/third_party/blink/web_tests/http/tests/devtools/console/viewport-testing/console-key-expand-expected.txt
[modify] https://crrev.com/cc2fb34c6c8a513781dc7d78e827f340605681e9/third_party/blink/web_tests/http/tests/devtools/console/viewport-testing/console-key-expand.js
[modify] https://crrev.com/cc2fb34c6c8a513781dc7d78e827f340605681e9/third_party/blink/web_tests/http/tests/devtools/console/viewport-testing/console-key-navigation-expected.txt
[add] https://crrev.com/cc2fb34c6c8a513781dc7d78e827f340605681e9/third_party/blink/web_tests/http/tests/devtools/console/viewport-testing/console-stick-to-bottom-expand-object-expected.txt
[add] https://crrev.com/cc2fb34c6c8a513781dc7d78e827f340605681e9/third_party/blink/web_tests/http/tests/devtools/console/viewport-testing/console-stick-to-bottom-expand-object.js
[modify] https://crrev.com/cc2fb34c6c8a513781dc7d78e827f340605681e9/third_party/blink/web_tests/http/tests/devtools/elements/elements-save-to-temp-var.js
Project Member

Comment 16 by bugdroid1@chromium.org, Dec 6 

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

commit 0835ba4d696ebe20992dee8b5c2ccbe2a4e658c8
Author: Erik Luo <luoe@chromium.org>
Date: Thu Dec 06 03:28:42 2018

DevTools: fix Console scroll preservation with keyboard experiment

To ensure Console preserves scroll position when switching panels,
- ConsoleView's focus() now focuses the viewport instead of the
  prompt, when needed.
- ConsoleView manually restores scroll positions, since viewport's
  focus() may scroll items into view.

Bug:  865674 
Change-Id: I8f338a98557c94dddc7f0ba5177b635a72aee503
Reviewed-on: https://chromium-review.googlesource.com/c/1361793
Reviewed-by: Joel Einbinder <einbinder@chromium.org>
Commit-Queue: Erik Luo <luoe@chromium.org>
Cr-Commit-Position: refs/heads/master@{#614259}
[modify] https://crrev.com/0835ba4d696ebe20992dee8b5c2ccbe2a4e658c8/third_party/blink/renderer/devtools/front_end/console/ConsoleView.js
[modify] https://crrev.com/0835ba4d696ebe20992dee8b5c2ccbe2a4e658c8/third_party/blink/renderer/devtools/front_end/console/ConsoleViewport.js
[modify] https://crrev.com/0835ba4d696ebe20992dee8b5c2ccbe2a4e658c8/third_party/blink/web_tests/http/tests/devtools/console/console-focus-expected.txt
[modify] https://crrev.com/0835ba4d696ebe20992dee8b5c2ccbe2a4e658c8/third_party/blink/web_tests/http/tests/devtools/console/console-focus.js
Project Member

Comment 17 by bugdroid1@chromium.org, Dec 6 

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

commit 48789ec6e4da515fdeda4ec1c3d569a06466790c
Author: Erik Luo <luoe@chromium.org>
Date: Thu Dec 06 18:37:44 2018

DevTools: enable Console keyboard navigation by default

Bug:  865674 
Change-Id: I6f1bf84a2113f64cc0c00839067f4e41ca72f483
Reviewed-on: https://chromium-review.googlesource.com/c/1330295
Commit-Queue: Erik Luo <luoe@chromium.org>
Reviewed-by: Joel Einbinder <einbinder@chromium.org>
Cr-Commit-Position: refs/heads/master@{#614424}
[modify] https://crrev.com/48789ec6e4da515fdeda4ec1c3d569a06466790c/third_party/blink/renderer/devtools/front_end/main/Main.js

Comment 18 by l...@chromium.org, Dec 7

Cc: hwi@chromium.org julialiang@chromium.org
Style update proposal:
- Focused highlight width should be tighter around text content
- Instead of gray, focused background color should be 'blue', closer to focused message background color.

Proposal Screenshot: https://imgur.com/a/aLyGRqJ
In this proposal, color contrasts for default text: 9.6 (light theme), 5.8 (dark theme)

Comment 19 by julialiang@chromium.org, Dec 11 

Do you mean we are matching the focused background color with the message background color? If so, that looks good to us

Comment 20 by julialiang@chromium.org, Dec 11 

Also, we will check again once it's landed in Canary.

Thanks!

Comment 21 by l...@chromium.org, Dec 11 

c#19: yes, although not an exact match.  The proposed focused background color (hsl(214, 40%, 92%)) is in between the message background color (hsl(214, 48%, 95%)) and the message border color (hsl(214, 67%, 88%)).

If we used the exact same background color, it seems a light to me (see attached), easy to miss.  Since messages have a border color and focused properties do not, I thought it made sense to do something in between.
exactMatchBkgColor.png
29.0 KB View Download
Project Member

Comment 22 by bugdroid1@chromium.org, Dec 12 

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

commit 073bc1736e62d826520b6d1a746e72b95a797345
Author: Erik Luo <luoe@chromium.org>
Date: Wed Dec 12 02:31:56 2018

DevTools: iterate on keyboard focused styles

- Focus color is now 'blue', closer to the background color of a
  focused console message.
- In both Objects and Nodes, focus highlight's width fits tightly
  around the text content.

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

Bug:  865674 
Change-Id: Ie0fb14897dc855cd7713b2ce6ba0328ef205fc7a
Reviewed-on: https://chromium-review.googlesource.com/c/1368842
Reviewed-by: Joel Einbinder <einbinder@chromium.org>
Commit-Queue: Erik Luo <luoe@chromium.org>
Cr-Commit-Position: refs/heads/master@{#615792}
[modify] https://crrev.com/073bc1736e62d826520b6d1a746e72b95a797345/third_party/blink/renderer/devtools/front_end/elements/elementsTreeOutline.css
[modify] https://crrev.com/073bc1736e62d826520b6d1a746e72b95a797345/third_party/blink/renderer/devtools/front_end/object_ui/objectPropertiesSection.css
[modify] https://crrev.com/073bc1736e62d826520b6d1a746e72b95a797345/third_party/blink/renderer/devtools/front_end/ui/inspectorStyle.css
[modify] https://crrev.com/073bc1736e62d826520b6d1a746e72b95a797345/third_party/blink/renderer/devtools/front_end/ui/treeoutline.css

Comment 23 by julialiang@chromium.org, Dec 20 

Thanks luoe@, this looks good to us.

Comment 24 by l...@chromium.org, Dec 20

Status: Fixed (was: Assigned)
Thanks for reviewing the changes.  I'll close this, as no changes are planned for now.
►

Sign in to add a comment