135

I am developing a web application with a heavy front-end approach. By using Dojo and the AMD-way, I currently have testing screens which may easily load over a hundred different javascript files.

When I want to debug for any specific problem, or verify if I am seeing an old version of a specific file, I find it really hard to find my files in the Sources tab in the Chrome Developer Tools.

Is there any shortcut or action I can make that will let me type the name of a file and will take me to the source of that file?

Braiam
  • 1
  • 11
  • 47
  • 78
Alpha
  • 7,586
  • 8
  • 59
  • 92
  • 2
    On the bottom right of the console, there is a gear icon. Click it. On the last tab in the settings window there is a shortcuts tab. You can see the key combos like the answer. – epascarello Jan 30 '13 at 15:57
  • Use 'Go to file' in Google Dev Tools (a flexible and useful tool with ability search on your function name, class name in CSS, ...)['Go to file' in Google Dev Tools](https://stackoverflow.com/a/47690078/7487135) – Iman Bahrampour Dec 07 '17 at 10:41

4 Answers4

184

While in the sources tab use CTRL+O (⌘+O for Mac) to search scripts, stylesheets and snippets by filename.

(use CTRL+SHIFT+O to filter/navigate to a JavaScript function/CSS rule when viewing a file)

[Chrome Devtools Cheatsheet]

JDB
  • 25,172
  • 5
  • 72
  • 123
CD..
  • 72,281
  • 25
  • 154
  • 163
  • This is good to know! You used to (before Chrome 35?) be able to start a filename search by just typing with the file navigator in the Sources tab focused; it's good to know that they've hidden this feature behind a shortcut rather than removing it completely. =) – rakslice Jun 17 '14 at 20:04
  • 2
    the caveat to the filter/search is that you can't seem to do exact searches or wildcards. searching for `.js` returns any file with a `j` or an `s` or a `.` in the filename :/ – worc Aug 23 '16 at 17:06
  • When I go to open a file, I see multiple version of same files. I have to go through each file to find the appropriate file. What do you recommend? – Santosh Kumar Jan 13 '22 at 11:10
28

CTRL + P brings up the search input in Windows.

enter image description here

⌘ + P — in Mac.

enter image description here

Aleksei Mialkin
  • 2,257
  • 1
  • 28
  • 26
6

In Windows:

Use CTRL+SHIFT+F to search for content in files.

Use CTRL+SHIFT+O to search for file names.

live-love
  • 48,840
  • 22
  • 240
  • 204
  • 1
    If using a build process, and the files are no longer recognizable in chrome, searching by content is a great solution. – Mote Zart Sep 01 '20 at 18:03
1

Mac: Command + O Windows: Ctrl + O

Jackie
  • 41
  • 4