VSCode: Toggle Between Editor & Terminal

VSCode: Toggle Between Editor & Terminal

Working in VSCode has been a great overall experience, but it’s not without its little challenges. One issue I’ve had for a while is something so small, but so annoying, I had to figure out a solution.

I finally got tired of clicking into the terminal to focus the cursor, only to then click into the editor, then back, and forth… you get it. Sometimes I think I need to reach a point of pain in my process that I am finally pushed to make a change.

After a quick search, I found the following result with the solution I was looking for:

https://superuser.com/questions/1270103/how-to-switch-the-cursor-between-terminal-and-code-in-vscode

See the answer there provided by user94184.

Expanding upon this, I’ve put together a quick guide for those who could use it. If you’ve stumbled upon this page while looking for the quick answer and you’re already in the know, see the TL;DR below.

TL;DR

Establish the following keybindings to enable toggling between the editor and terminal windows.

Terminal Settings

Command: Focus Terminal
When expression: !terminalFocus

Editor Settings

Command: Focus Active Editor Group
When expression: terminalFocus

Note: I chose to use ALT + T but you can use whatever you’d like.

Step by step

In VSCode, open your Keyboard Shortcuts settings by navigating to:

File > Preferences > Keyboard Shortcuts

vscode-kb-shortcuts-menu.jpg

The Keyboard Shortcuts settings opens and provides a search feature so you can locate the command you want to modify. Search for the following command:

Terminal: Focus Terminal

You’ll notice a few versions of options related to this command. Make sure you are modifying the correct one.

vscode-kb-shortcuts-focus-terminal.jpg

Click the pencil icon to the left of Terminal: Focus Terminal. You will be presented with a popup containing a single input. This is where you’ll set your preferred key combination. In my case, I chose ALT + T, but you can choose whatever you’d like.

vscode-kb-shortcuts-key-popup.jpg

Now you have to establish a When Expression. Right-click on the same command and select Change When Expression from the context menu:

vscode-kb-shortcuts-when-expression.jpg

Then When Expression input will be enabled for you to type whatever you’d like. We need to input the following:

!terminalFocus

Your record should now look like this (only with your key binding preference):

vscode-kb-shortcuts-when-expression1-scaled.jpg

Click to open larger view

The terminal is handled, so now let’s move on to the editor settings. Search for:

Focus Active Editor Group

As of this writing, this is the only result related to the search, so it should be easy to locate the command.

vscode-kb-shortcuts-Focus-Active-Editor-Group.jpg

Click on the pencil icon and edit the keybinding. Just make sure you use the same key combination you did for the terminal. In my case, they are both set to ALT + T. This will only work if the keybindings match.

vscode-kb-shortcuts-Focus-Active-Editor-Group2.jpg

vscode-kb-shortcuts-Focus-Active-Editor-Group3.jpg

Again, you’ll change the When Expression but for the editor:

vscode-kb-shortcuts-key-popup.jpg

Input the expression, but this time excluding the !:

terminalFocus

You’ve probably noticed the expressions are opposites.

Finally, here’s a simple way to check your work. Right-click on the command and select Show Same Keybindings:

vscode-kb-shortcuts-showsamekeybinding.jpg

The list is filtered to show only those commands using the keybinding you’ve chosen. Again, in my case, that’s ALT + T. If you see a third or more commands bound to this key combination, you may want to change your new keybindings to something not already in use.

Notice you can use a string value equivalent to search for any keybindings, as in my case the string value “ALT+T” is used to show our new mappings.

That’s it!

Give your new workflow a spin! Staying on your keyboard as much as possible when writing code increases productivity (in my opinion). Now you can save that JS file, immediately switch to the console and run it in Node, then switch back to the editor to continuing working without touching the mouse.

This was a simple but big deal for me. I hope you found this useful as well.