Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Searching inside a JSON object in Google Chrome DevTools

Tags:

I love Google Chrome's DevTools. But, when debugging I sometimes need to search for a particular property or value in a JSON request/response object (within a request/response in the "Network" tab). This can be tedious if the JSON object is large. Do the DevTools support such a search?

In the example below, I was hoping that searching for "new_user" would highlight the property in the JSON object shown.


UPDATE: Since this question was asked, this functionality has been added to Chrome!

like image 489
Lee Avatar asked Jul 07 '15 10:07

Lee


People also ask

How do I view JSON data in my browser?

Right click on JSON file, select open, navigate to program you want open with(notepad). Consecutive opens automatically use notepad.

How do I inspect element in DevTools?

Method 1: Inspect Element Using Chrome Developer ToolsAt the top right corner, click on three vertical dots. From the drop-down menu, click on More tools -> Developer Tools. macOS users can use the shortcut – command + option + C and Windows users can use Control + Shift + C.


2 Answers

No existing functionality to search the json tree view. You can file a new issue in the issue tracker to see if it could get added.

like image 55
Garbee Avatar answered Sep 23 '22 05:09

Garbee


The feature seem to be now implemented:

  1. Click on the XHR request you want to see.
  2. Click on the "Preview" or "Response" tab and do CTRL + F
like image 28
Anton De Silva Avatar answered Sep 22 '22 05:09

Anton De Silva