Skip to content
tinytip

Latest tips / 15

Find files by name on GitHub

June 17, 2021
#github

Open a repository on GitHub and press t to open the File Finder. This let's you find files by name (or name of the directory) in the current repo.

File Finder on GitHub

Emulate a focused page in DevTools to debug overlay elements

June 17, 2021
#devtools

Some overlay elements like dropdowns or flyout menus automatically hide/remove themselves when the focus is lost. Whenever you switch to the DevTools the page is not focused anymore and the element gets hidden.

The Chrome DevTools have a feature to emulate page focus. Open the DevTools, press Ctrl+Shift+P (or Cmd+Shift+P on macOS) and search for "Emulate a focused page".

Emulate a focused page in DevTools

Navigate easier in large files via symbols in VS Code

June 14, 2021
#vscode

When you open a file in VS Code and you look for a specific function, class, ... you can navigate by symbols. Press Ctrl+Shift+O (or Cmd+Shift+O on macOS) to see all symbols of the current file. You can filter the list and navigate through the results with arrow down / arrow up. VS Code will automatically scroll to the focused element. Press esc to close the list (and navigate back to the original scroll position) or enter to focus that symbol.

This works for many different languages like JavaScript, TypeScript and even headings in Markdown.

Symbol Search in VS Code

Restart TypeScript server in VS Code with a command

June 14, 2021
#vscode

Sometimes the TypeScript server in Visual Studio Code crashes which results in broken auto completion. You can restart the server with a single command.

Make sure that you have a TypeScript file open, press Ctrl+Shift+P (or Cmd+Shift+P on macOS) to open the Command Palette and type restart, then select the command "TypeScript: Restart TS server".

Restart TS server command in VS Code

The status bar at the bottom of the window will show the status of the server.