normalppl
normalppl

Reputation: 297

how to debug javascript on chrome

I have this weird issue that jquery.load sometimes fails on chrome. I'm not gonna bother you guys with the details, I'm just looking for a pointing hand on how can i debug such an issue?

I thought of maybe the firebug could help, but the issue happens only on chrome (even works on IE).

I do something like:

$("#contentid").html("Plz wait.");
$("#contentid").load(url);
$("#contentid").show();

I get only the "Plz wait" on #contentid, and i can see the url getting called, and check it manually and see it succeeds.

UPDATE2:

so i changed the load calls according to suggestions

$('#conentid').load(url, function(response, status, xhr){
  alert('Load was performed. url:' + url);
  if (status == "error") 
  {
    alert("text: " + xhr.statusText);
    alert("readyState: "+xhr.readyState+"\nstatus: " + xhr.status);
        alert("responseText: "+xhr.responseText);
  }
  else
  {
      $("#conentid").show(); 
  }
});

I get status=='error' when the errors occur.

xhr.statusText: 0

xhr.readyState: 4

xhr.statusText and xhr.responseText are empty

any idea why? what does this mean?

The url works manually. and this error happens only on chrome, and only sometimes

Upvotes: 2

Views: 1378

Answers (2)

normalppl
normalppl

Reputation: 297

Maybe someone else could have an explanation for this answer, but the problem was:

I had a base href TAG (<base href="http://domain.com/" />)

There are some references for problems with using jquery + base href out there. I have no idea why, but removing this line fixed everything. thanks for all your help, I learned some web debugging\ajax tips in the process.

Upvotes: 0

Charlie Martin
Charlie Martin

Reputation: 112346

Chrome actually has rather nice developer tools. Click the wrench icon, select developer tools from the menu.

On this particular issue, I'll bet the show is being called before the load completes -- load happens asynchronously. Set up an event handler for "on load" on #contentid and do the show in that.

Update

Actually, there's a better way to do it; put your show into a callback on the load function:

$('#conentid').load('ajax/test.html', function() {
  alert('Load was performed.');
  $('#contentid').show();
});

Another Update

Okay, the ready state of 4 indicates the XmlHTTPRequest completed normally. Now, there's one ambiguity here: is the xhr.statusText 0 or is it empty? What results do you see from this code (including the error code) on another browser?

If it's working on firefox, and only working sometimes on Chrome, you may have an actual Chrome bug.

Upvotes: 4

Related Questions