One of the best features about Firefox and Firebug is that you can see exactly what your AJAX calls responses are.
Safari and Chrome have Developer Tools, but the Console is lacking. It doesn't show anything except for warnings and errors.
Am I missing something? Without having to place a breakpoint is the script, is it possible to see the response within Safari or Chrome's Developer Tools?
To elaborate:
"Network" doesn't show you what the actual response is that I can see. It just shows all of the loaded resources.
If I make an AJAX call to a web service, I want to be able to see the JSON response.
You can use the Network tab.
Related
This is a question about debugging a project, not about writing the code.
I am on the final stages of developing an HTML5 web app. Fairly last minute, our client tells us it should run on IE8. Since I use the HTML5-canvas in the app, this required the addition of Google Chrome Frame. Once installed and testing, however, IE8's developer console no longer prints any data, and the HTML viewer never loads. Is this a bug? Is there a way to fix it? It will really suck if I need to debug with alerts...
From Google Chrome Frame documentation:
You can use the Web Inspector in GCF just as you would in the Google Chrome browser. To use it, right-click and choose "Inspect Element". Logging is available via the console.log method, and you can set breakpoints and inspect network activity.
I'm using the developer window in google chrome, and it gives a lot of useful information. However, I have several resources (3 or 4 images) which are receiving 404 errors. These resources are unnecessary, so I need to find out why the browser is requesting them (what css/javascript/inline html is directing the request, so that I can remove that line of code. Is there a good way to find out why it was requested?
Go to Tools -> Developer Tools -> Network Tab
I would recommend you use Firebug addon in Firefox. I haven't found any equivalent for Chrome extension. Firebug has "NET" tab you can see all the requests made to the server.
the firebug console show each ajax request, and its parameters and the response,
is it possible to get this in chrome ?
Ctrl-Shift-I will open Chrome development tools. I assume this is what you wanted.
To see Ajax requests, click on "Network" and you'll see all network requests being made. By default you see them all, although you can filter them and just see Ajax requests. Take a look at bottom part of Network tab; you'll see "Documents", "Stylesheets", etc. You want "XHR".
Yea u can have it. Enable it from the setting of chrome console.
Press ctrl + shift + I
click on setting (Gear) icon at the bottom right.
check "Log XMLHttpRequests" at the console section part.
Thats it.
Chrome developer tools will give you that and a lot more. Click on the wrench and select Tools->Developer Tools.
I believe they were open sourced by Apple - great stuff.
It's there by default click on the tool icon and under tools, can you find developingtool, which is a chrome version of firebug :)
If you want a Firebug experience within chrome for the console, use Firebug Lite extension for Chrome.
I want to get size of data that page request or get from server even if my request is in ajax.(in browser developer tools or asp.net via code)
Your browser can do this:
In chrome/safari use developer tools and click on Resources.
In Firefox install Firebug and click on Net.
In Firebug, you can
see JSON formatted as an expandable tree of items
and also explore them using Firebug's Dom tab.
The view is available within Net panel and visible as
soon as a JSON request is expanded.
As in this screenshot:
I'm trying to switch to Chrome but can't find this feature in Dev Tools.
Does Chrome's Dev Tools provide something similar (assuming you're not using any additional extensions like Firebug Lite)?
You can use:
inspect(myObject);
in the Chrome console to get an inline object inspector similar to what the DOM tab in Firebug gives you. In your case you can to do this on whatever object you assign your JSON results to.
As far as I know Chrome does not have this feature.
In case you didn't know, Firebug Lite for Chrome supports this feature (only for XHR requests), so you can use both Chrome Dev Tools and Firebug Lite to inspect JSON responses. See this blog post:
http://blog.getfirebug.com/2010/09/09/firebug-lite-1-3-1/
Disclaimer: I work with the Firebug Working Group
Chrome 12 (12.0.742.6) will have this feature!
You can already download the beta of 12 today.
https://bugs.webkit.org/show_bug.cgi?id=20628#c4