Solved

How to debug js... find the bug.

Posted on 2013-05-23
4
218 Views
Last Modified: 2013-06-28
I have two questions:

Q1: What is a proper way to debug js code? I have Fire Fox DOM inspector just in case.
Q2: Why alert("aaaa"); at line 46 is not firing?

Starting from the very top, I have moved alert("aaaa"); down to spot the portion of the code that is not working (does not fire alert("aaaa");).

Do you see what the problem is?

Thank you.
window.onload=initAll;
var xhr=false;
var xPos, yPos;

function initAll(){
	var allLinks = document.getElementsByTagName("a");
	
	for (var i=0; i<allLinks.length; i++){
		allLinks[i].onmouseover = showPreview;
	}
}

function showPreview(evt){
	if(evt) {
		var url=evt.target;
	}else{
		evt = window.event;
		var url=evt.srcElement;
	}
	xPos=evt.clientX;
	yPos=evt.clientY;
}

if (window.XMLHttpRequest) {
	xhr = new XMLHttpRequest();
}
else {
	if (window.ActiveXObject) {
		try {
			xhr = new ActiveXObject("Microsoft.XMLHTTP");
		}
		catch (e) { }
	}
}

if (xhr) {
	xhr.onreadystatechange = showContents;
	xhr.open("GET", url, true);
	xhr.send(null);
}
else {
	alert("Sorry, but I couldn't create an XMLHttpRequest");
}

function showContents(){
alert("aaaa");
/*	if (xhr.readyState == 4) {
		if (xhr.status == 200) {
			var outMsg = xhr.responseText;
		}
		else {
			var outMsg = "There was a problem with the request " + xhr.status;
		}

		// Do something here with outMsg
		var prevWin=document.getElementById("previewWin");
		prevWin.iinerHTML=outMsg;
		prevWin.stype.top=parseInt(yPos)+2 + "px";
		prevWin.stype.left=parseInt(xPos)+2 + "px";
		prevWin.stype.visibility="visible";
		
		prevWin.onmousout=function(){
			documnet.getElementByID("prevWin").style.visibility="hidden";
		}
	}
*/
}

Open in new window

0
Comment
Question by:Mike Eghtebas
  • 3
4 Comments
 
LVL 44

Expert Comment

by:Rainer Jeschor
ID: 39192794
Hi,
I assume the closing "}" of line 22 should be in line 44:
window.onload=initAll;
var xhr=false;
var xPos, yPos;

function initAll(){
	var allLinks = document.getElementsByTagName("a");
	
	for (var i=0; i<allLinks.length; i++){
		allLinks[i].onmouseover = showPreview;
	}
}

function showPreview(evt){
	if(evt) {
		var url=evt.target;
	}else{
		evt = window.event;
		var url=evt.srcElement;
	}
	xPos=evt.clientX;
	yPos=evt.clientY;

if (window.XMLHttpRequest) {
	xhr = new XMLHttpRequest();
}
else {
	if (window.ActiveXObject) {
		try {
			xhr = new ActiveXObject("Microsoft.XMLHTTP");
		}
		catch (e) { }
	}
}

if (xhr) {
	xhr.onreadystatechange = showContents;
	xhr.open("GET", url, true);
	xhr.send(null);
}
else {
	alert("Sorry, but I couldn't create an XMLHttpRequest");
}
}
function showContents(){
alert("aaaa");
/*	if (xhr.readyState == 4) {
		if (xhr.status == 200) {
			var outMsg = xhr.responseText;
		}
		else {
			var outMsg = "There was a problem with the request " + xhr.status;
		}

		// Do something here with outMsg
		var prevWin=document.getElementById("previewWin");
		prevWin.iinerHTML=outMsg;
		prevWin.stype.top=parseInt(yPos)+2 + "px";
		prevWin.stype.left=parseInt(xPos)+2 + "px";
		prevWin.stype.visibility="visible";
		
		prevWin.onmousout=function(){
			documnet.getElementByID("prevWin").style.visibility="hidden";
		}
	}
*/
}

Open in new window

Otherwise the variable "url" is undefined.

HTH
Rainer
0
 
LVL 44

Expert Comment

by:Rainer Jeschor
ID: 39192812
And for debugging:
either FireBug, IEDev Tools or Iron (Chrome based browser).
Depending on the content/references sometimes the site jsfiddle.net
0
 
LVL 33

Author Comment

by:Mike Eghtebas
ID: 39192981
How do you use FireBug to check js?

It is not working yet. There is a new question at:

http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_28137786.html

with the entire fiel uploaded to be tested.

Thanks,

Mike
0
 
LVL 44

Accepted Solution

by:
Rainer Jeschor earned 500 total points
ID: 39197472
Hi Mike,
the console window in Firebug normally shows syntactical errors (missing ";",...).
For logical / workflow related "bugs" you normally set a breakpoint to the entry point (e.g. your initall function) and then step through the code, setting watches where necessary.

HTH
Rainer
0

Featured Post

Optimizing Cloud Backup for Low Bandwidth

With cloud storage prices going down a growing number of SMBs start to use it for backup storage. Unfortunately, business data volume rarely fits the average Internet speed. This article provides an overview of main Internet speed challenges and reveals backup best practices.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

In Part 1 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7849-Hex-Maze.html) we covered the hexagonal maze basics -- how the cells are represented in a JavaScript array and how the maze is displayed.  In this part, we'…
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

832 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question