Click here to Skip to main content
Click here to Skip to main content

JavaScript Debugger and Tracer Tool

, 16 Mar 2007 LGPL3
Rate this:
Please Sign up or sign in to vote.
An application that traces JavaScript Applications.

Introduction

JavaScript Tracer Tool simply covers the the function of alert(); but I took it one step forward and added some other functions to make it more useful. This application gives you the opportunity of continuously debugging and seeing each and every steps of your application, without even adding any irrelevant code to your own application.

Using the code

Tracer is a very useful application. To make it work you only have to call the trace.js file. It will run by itself.

<script type="text/javascript" src="trace.js"></script>

Here is a list of functions Tracer has. Just give them the particular elements.

  • trace(): in your application you just use it as trace("hello world");, instead of alert("Hello World");. Tracer will print the result with numbering and coloring. trace() also has another format to use, trace("arg1","arg2","arg3"). In this option you just give the values as arguments and it will number them and print in order. This is useful for printing a function's arguments.
  • traceArr(): this function displays the each element of an array with their positions.
  • traceAssoc(): This function is for associative arrays. If you give this function an array it will show you the key and the value of each array element.
  • traceStr(): This function is almost the same as traceArr() but it works for strings, and shows you the each character of a string with numbers.
  • traceError()This function is for custom error messages. very suitable for Try, Catch blocks.
  • RunJS tab: is for Running the JavaScript codes realtime on the page.
  • Watch: When you write the ID of an Object in text box, watch follows that element's content and prompts on screen. It's quite useful for hidden elements and automatically changing values. Watch can catch more than one Element.
  • Tracer also catches the runtime errors and displays them with the file name and line numbers. This feature is really useful for IE users. Error handling is optional, you can stop handling in settings tab.
  • Also, the whole Tracer body is floating, that means you can move it where you want. Tracer can remember last position, last state, last tab and last setting by using cookies.

You can find more helpful information on the Online Demo page.

License

This article, along with any associated source code and files, is licensed under The GNU Lesser General Public License (LGPLv3)

Share

About the Author

serkanyersen
Web Developer
Turkey Turkey
Hi, My name is Serkan Yerşen, I'm 24 years old and I'm from TURKEY,
I recently graduated from The Computer Technologies and Programming department of Bilkent University, Bilkent is the one of the many biggest Universities in TURKEY.
I worked for my school for a year. After i quit job at my school. i started to work on web apllication developments.
Currently I'm Working for The Jotform Development Team in Interlogy LLC Company.
 

My proficiencies are VB6, PHP, MySQL, JavaScript and AJAX technics, CSS+HTML, and Linux Systems.
 
You can find more information about me by visiting my blogs.
My English Blog
My Turkish Blog

Comments and Discussions

 
GeneralNice one! PinmemberSandeep Mewara24-Mar-10 5:07 
QuestionWhy re-invent the wheel? Pinmembervolkan.ozcelik21-Mar-07 6:54 
AnswerRe: Why re-invent the wheel? Pinmemberserkanyersen21-Mar-07 10:57 
AnswerThanks Pinmembervolkan.ozcelik21-Mar-07 22:52 
News[Off-topic] ... A favor Pinmembervolkan.ozcelik21-Mar-07 22:57 
AnswerRe: [Off-topic] ... A favor Pinmemberserkanyersen25-Mar-07 4:32 
AnswerRe: Why re-invent the wheel? PinmemberRick Fencl7-Sep-07 9:43 
GeneralNew Version Pinmemberserkanyersen8-Nov-07 3:29 
GeneralPlease leave a suggestion Pinmemberserkanyersen24-Jan-07 22:02 
GeneralRe: Please leave a suggestion Pinmembertsdragon30-Jan-07 3:23 
GeneralRe: Please leave a suggestion [modified] Pinmemberserkanyersen30-Jan-07 6:43 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Mobile
Web04 | 2.8.141022.2 | Last Updated 16 Mar 2007
Article Copyright 2007 by serkanyersen
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid