Shortcut to focus code in overlay (peek) editor (VS Code)

Question

With VS Code, you can open an overlay editor to peek at the references (Shift+F12) or the definitions (Alt+F12): Peek References Example

With that overlay open, I can navigate on the right side, which shows the list of the found references/definitions.

But how can I focus on the left side to scroll through the code with arrow keys? And focus back to the list?

Of course, you can click with the mouse in the window, but I try to work with the keyboard only.

I could not find a key binding in the keybindings.json

Answer 1

It took some hunting but I think I figured it out.

(1) Shift+Tab moves focus from the list of references on the right to the selected reference on the left.

The problem is then that Shift+Tab or Tab will not then move focus back to the right panel 0 because you are in an editor but the command

Toggle Tab Key Moves Focus 

[bound to Ctrl+M by default]

will activate the Tab/Shift+Tab through UI elements functionality. So

(2) Ctrl+M followed by Tab will move focus from the code in the left panel to the right panel.

The Toggle Tab Key Moves Focus will remain on until you toggle it off with Ctrl+M again - there is a Status Bar button Tab Moves Focus that appears when it is active.

---

And then I found an "easier" way. The command

togglePeekWidgetFocus

appears to toggle between the left and right peek reference view panel!

It is bound to the rather unwieldy Ctrl+K Fn2 keybinding though so you may want to rebind to something else like (in your keybindings.json):

{
  "key": "alt+r",       // whatever you want here
  "command": "togglePeekWidgetFocus",
  "when": "inReferenceSearchEditor || referenceSearchVisible"
},
{
  "key": "ctrl+k f2",
  "command": "-togglePeekWidgetFocus",
  "when": "inReferenceSearchEditor || referenceSearchVisible"
}