techlist.io
KREN
gitlab

Navigate repositories faster with the file tree browser (opens in new tab)

gitlabaccessibilitydevsecopskeyboard-navigationpaginationfile-tree-browserrepository-structurearia-treeview

GitLab 18.9 introduces a collapsible file tree browser that makes repository navigation more like using an IDE. The panel keeps files and directories visible while reading code, reducing back-and-forth navigation and preserving context. It is available on GitLab.com, Self-Managed, and Dedicated, with support for accessibility, responsive layouts, and large repositories.

Persistent Repository Context

  • A resizable, collapsible panel appears alongside file lists and code.
  • Users can expand or collapse directories and switch files without losing their place.
  • When opening a nested file directly, parent directories expand and the current file is highlighted.
  • The tree stays synchronized with the selected file or directory in the main content area.

Filename Search

  • Press F to open the global file search dialog.
  • Search results can match part of a filename or extension.
  • Each result includes its parent directories, making the destination clear before navigation.
  • Press Enter to open the selected file.

Keyboard and Accessibility Support

  • The browser follows the W3C ARIA treeview pattern.
  • Users can navigate with arrow keys, Enter, Space, Home, End, and character keys.
  • The design supports screen readers and keyboard-first workflows.

Responsive Design and Performance

  • On desktop, the tree appears beside the file list and code.
  • On smaller screens, it becomes a toggleable left-side drawer.
  • On mobile, it is hidden to maximize the code-view area.
  • Pagination prevents large repositories from overwhelming the page and keeps the interface responsive.

Availability and Usage

  • Open a repository at /<project>/-/tree/<branch>.
  • Select the file tree icon or press Shift+F to toggle the browser.
  • The feature is available on GitLab.com and was released in version 18.9 for GitLab Self-Managed and GitLab Dedicated.

The file tree browser is recommended for anyone navigating large repositories, especially users who want IDE-like structure, faster file discovery, and better keyboard accessibility.