Algorithm IV's debugger is a console wrapper that fixes cross-browser console issues and provides a set of new console methods that make your console more powerful. It will allow you to reduce the amount of time and code it takes to find a bug, automatically insert breakpoints, profiles, and timers, and switch everything on or off with one command. With proper use you will know and control the actions of every JavaScript method in your code base!
-
The Original Motivation: The original reason I built aIV.debug was because I wanted to avoid wasting time inserting and removing console logs for every front-end JavaScript bug. The problem was leaving logs in the code base could create messy code and organizing the large volume of logs that are produced by any project containing more than a couple of methods and classes was difficult. Repetitive code had to be removed and a short simple API had to be created. Shortcuts like adding the flexibility to turn log groups on or off on a whim and automatically inserting breakpoints, timers, and profiles without hassle were a must. With a bit of work Algorithm IV's Debugger has now accomplished it all and more!
-
Algorithm IV Dev Tools: What is really exciting is where this project is going! This Debugger is scheduled to transform into Algorithm IV Developer Tools which adds a cross-browser compatible console, profiler, and testing framework that plans to make front-end JavaScript testing and debugging easier than ever! If you are a JavaScript developer your opinions are needed!! Please read the outline and share your thoughts.
- Download algorithmIV-debug.min.js
- Add algorithmIV-debug.min.js to your HTML head
<html> <head> ... <script src="algorithmIV-debug.min.js"></script> ... </head> <body>...</body> </html>
- Use aIV.debug.set
and aIV.debug.reset
to change the default settings
aIV.debug.set({ turnOffMethods: 'start', addBreakpoints: 'all' }); aIV.debug.reset('errorBreakpoints', 'openGroups'); aIV.debug.reset(); // Resets all options
- Use aIV.debug
to create as many debug object instances as you need
var debug = aIV.debug({ classTitle : 'Example', turnOffMethods: 'state', addBreakpoints: 'fail', turnOnTimers : true });
- Note that this debugger works best in Chrome especially with large volumes of logs
Each debug object has the following methods for logging to the console:
| example calls | |
|---|---|
| init | debugInstance.init(methodName, methodArg1, typeForMethodArg1, ...) |
| start | debugInstance.start(methodName, methodArg1, methodArg2, ...) |
| end | debugInstance.end(methodName, methodReturnValue) |
| args | debugInstance.args(methodName, methodArg1, typeForMethodArg1, ...) |
| fail | debugInstance.fail(methodName, truthyValue, errorMessage, optionalVar1, ...) |
| group | debugInstance.group(methodName, groupType, optionalMessage, optionalVar1, ...) |
| state | debugInstance.state(methodName, logMessage, var1, var2, ...) |
| misc | debugInstance.misc(methodName, logMessage, optionalVar1, ...) |
Plus the following methods for disabling logs and automatically adding debugger breakpoints, groups, profiles, and timers:
| example calls | |
|---|---|
| turnOnMethod | debugInstance.turnOnMethod(debugMethodName) |
| turnOffMethod | debugInstance.turnOffMethod(debugMethodName) |
| addBreakpoint | debugInstance.addBreakpoint(debugMethodName) |
| removeBreakpoint | debugInstance.removeBreakpoint(debugMethodName) |
| turnOnAuto | debugInstance.turnOnAuto(automationType) |
| turnOffAuto | debugInstance.turnOffAuto(automationType) |
See our guide to contributing.
To see the debugger in action view our unit tests.
- Open an issue on this GitHub repository
- Send an email to imagineadamsmith@gmail.com
-- Happy Developing