Use the Quick source panel to view and edit source files while having access to other panels.
Overview
Usually, you would use the Sources panel to work with source files and you would need to switch from the Sources panel to access other panels. Since the Quick source panel opens in the Drawer at the bottom by default, you can use other panels at the same time.
Open the Quick source panel
To open the Quick source panel:
- Open DevTools.
- Open the Command menu by pressing:
- macOS: Command+Shift+P
- Windows, Linux, ChromeOS: Control+Shift+P
- Start typing
Quick source, select Show Quick source, and press Enter. DevTools displays the Quick source panel at the bottom of your DevTools window.
Alternatively, in the top right corner, select more_vert More options > More tools > Quick source.
Open files
The Quick source panel automatically opens the last file edited in the Sources panel. To open a source file manually, you can do any of following:
- Click Open file and select a source file from the drop-down.
- Or press:
- macOS: Command+P
- Windows, Linux, ChromeOS: Control+P
While the Quick source panel is open, using the Command+P shortcut will open a source file in the Quick source panel, rather than the Sources panel.