debug.js is an embeddable JavaScript debugger for web development.
It allows you to debug easily without the F12 Tools.

The library has useful features such as Logger, DOM element inspector, Screen measure,
File Viewer, Command-line interpreter, Original script executor for automated testing, etc.

// Usage

Embed the debugger into your web page
Include the script file.
<script src="debug.js"></script>
That's it!

The debug window will be automatically generated and is draggable.

The debug window is hidden by default setting.
You can switch show/hide by F2 key. (assignable)

Logging
Put log messages anywhere you want.
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <script src="debug.js"></script>
  <script>
    function foo() {
      log('button was clicked');
    }
  </script>
</head>
<body>
  <button onclick="foo();">DEMO</button> 
</body>
</html>

Print an object
You can also print all the properties of an object.
var obj = {
  key1: 'abc',
  key2: 123,
  key3: true
};
log(obj); 

// Methods
Name Argument Description
Logging
log
( dbg.log )
message Output standard log
log('');
log.root() : Output log to root window.
log.d
( dbg.log.d )
message Output debug log
log.d('');
log.d.root() : Output log to root window.
log.i
( dbg.log.i )
message Output information log
log.i('');
log.i.root() : Output log to root window.
log.w
( dbg.log.w )
message Output warning log
log.w('');
log.w.root() : Output log to root window.
log.e
( dbg.log.e )
message Output error log
log.e('');
log.e.root() : Output log to root window.
log.f
( dbg.log.f )
message Output fatal log
log.f('');
log.f.root() : Output log to root window.
log.v
( dbg.log.v )
message Output verbose log
The messages will be filtered out by default. Press the filter button [V] to display.
log.v('');
log.v.root() : Output log to root window.
log.p
( dbg.log.p )
arg1: variable
arg2: recursion level limit(opt)
arg3: message string(opt)
Output object dump

var obj = {...};
log.p(obj); log.p(obj, 1); (lv1) log.p(obj, 2); (lv2) log.p(obj, 0, ''); (w/ message)
log.json
( dbg.log.json )
( dbg.log.j )
arg1: variable
arg2: recursion level limit(opt)
arg3: message string(opt)
Output object dump (JSON format)

var obj = {...};
log.json(obj); log.json(obj, 1); (lv1) log.json(obj, 2); (lv2) log.json(obj, 0, ''); (w/ message)
log.t
( dbg.log.t )
arg1: message
arg2: timer value(opt: in millis)
Output log w/ elapsed time

log.t('');
"%dt" will be replaced with delta time (lap time).

You can reset the timer by specifying 0 for the second argument.
log.t('', );
log.res
( dbg.log.res )
message Output result/response log
> message
log.res('');
log.res.err
( dbg.log.res.err )
message Output error result/response log
> message
log.res.err('');
log.mlt
( dbg.log.mlt )
message Output multi line log
var msg = 
log.mlt(msg);
log.clear
( dbg.log.clear )
Clear log message
log.clear();
log.suspend
( dbg.log.suspend )
Suspend log output
log.resume
( dbg.log.resume )
Resume log output
log.preserve
( dbg.log.preserve )
Set/get log preserve status

log.preserve()get status 
log.preserve(true)on 
log.preserve(false)off 
log.toBottom
( dbg.log.toBottom )
Scroll log area to bottom
dbg.stack arg1: startIndex(opt)
arg2: silent(opt)
Print stack trace

dbg.stack();

dbg.stack();

var stk = dbg.stack(, );
log('Some message\n' + stk);
dbg.line index(opt)
Returns current line number

dbg.line();
dbg.line();
dbg.funcname index(opt)
Returns current line number

dbg.funcname();
dbg.funcname();
dbg.filename arg1: index(opt)
arg2: absolute(opt)
Returns current line number

dbg.filename();
dbg.filename(, );
dbg.fileline arg1: index(opt)
arg2: absolute(opt)
Returns current line number

dbg.fileline();
dbg.fileline(, );
dbg.sendLog arg1: url
arg2: paramName
arg3: params
arg4: extInfo
arg5: flag
arg6: callback
Send log buffer to server.

url      : URL to send
paramName: request parameter name for log buffer(opt) "data" is used in default
params   : other parameters to send (Map object)(opt)
extInfo  : extra info text(opt)
flag     : head|log|b64buf(opt) target part to send. e.g., "head|log"
callback : callback function(opt) format: function(XMLHttpRequest){}

e.g.,
var cbFunc = function(xhr) {
  var st = xhr.status;
  if (st == 200) {
    log('Send Log OK');
  } else {
    log.e('Send Log ERR (' + st + ')');
  }
};

var url = 'https://[host]/savelog.cgi';

var params = {
  foo: 'aaa',
  bar: 'bbb'
};

var extInfo = {
  info0: 'additional info 0-1\nadditional info 0-2',
  info1: 'additional info 1-1\nadditional info 1-2',
  info2: 'additional info 2-1\nadditional info 2-2',
  info3: 'additional info 3-1\nadditional info 3-2'
};

dbg.sendLog(url, 'data', params, extInfo, flag, cbFunc);
------------------------------------------------------- DEMO var flag = ''; dbg.sendLog('https://debugjs.net/savelog.cgi'); dbg.sendLog(url, 'data', params, extInfo, sendFlag, cbFunc); //no-info dbg.sendLog(url, 'data', params, extInfo, sendFlag, cbFunc); //info0 dbg.sendLog(url, 'data', params, extInfo, sendFlag, cbFunc); //info1 dbg.sendLog(url, 'data', params, extInfo, sendFlag, cbFunc); //info2 dbg.sendLog(url, 'data', params, extInfo, sendFlag, cbFunc); //info3 dbg.sendLog(url, 'data', params, extInfo, sendFlag, cbFunc); //info0-3 -> log.txt x SENDING DATA FORMAT
info0
------------------------------------------------------------------------
Sending Time : 2018-10-17 07:58:44.200 -07:00 (America/Los_Angeles)
Timestamp    : 1539788324200
Browser      : Chrome 70.0.3538.67
User Agent   : Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.67 Safari/537.36
Screen Size  : w=1920 h=1200
Window Size  : w=1903 h=1089
Body Size    : w=1903 h=34341
Zoom Ratio   : 100%
Language     : en-US
------------------------------------------------------------------------
info1
------------------------------------------------------------------------

[LOG]
2018-10-17 07:58:35.689	LOG	Hello, World!
2018-10-17 07:58:36.192	DBG	Hello, World!
2018-10-17 07:58:36.960	INF	Hello, World!
2018-10-17 07:58:37.712	WRN	Hello, World!
2018-10-17 07:58:38.296	ERR	Hello, World!
2018-10-17 07:58:38.825	VRB	Hello, World!

info2

-- ORIGINAL LOG BUFFER -- b64buf
W3sidHlwZSI6MSwidGltZSI6MTUzOTc4ODMxNTY4OSwibXNnIjoiU0dWc2J...

info3
SERVER SIDE PROGRAM SAMPLE (savelog.cgi)

#!/usr/bin/python

import cgi

def save_log():
  form = cgi.FieldStorage()
  data = form.getvalue('data', '')
  f = open('log.txt', 'w')
  f.write(data)
  f.close()

def main():
  save_log()
  print('Content-Type: application/json')
  print()
  print('{"status":"OK"}')

main()
dbg.dumpLog arg1: format
arg2: base64 encode(opt)
arg3: format time(opt)
Export the log buffer in JSON format / plain text format

format: 'json' | 'text'

base64:
 true: The result will be encoded in Base64
 false: Plain text (default)

format time:
 true:  The time format will be human-readable foamrt.
        e.g., 2017-10-17 12:34:56.789

 false: The numeric value corresponding to the time for 
        the logged time according to universal time. (default)
        e.g., 1508211296789
dbg.loadLog json Load logs into the debug window
JSON Format
[{"type":1,"time":"12:34:56.789","msg":"SGVsbG8sIFdvcmxkIQ==(Base64)"},...]
dbg.getLogBufSize Returns log buffer size.
dbg.getLogBufSize(); 
dbg.setLogBufSize size Set log buffer size.
dbg.setLogBufSize(''); 
Time Test
dbg.time.start
( dbg.time.s )
arg1: timer name(opt)
arg2: message(opt)
Start a timer
dbg.time.start();
-> timer0: timer started
default timer name will be used in case no arguments are specified.

dbg.time.start('timer1');
-> timer1: timer started

dbg.time.start('timer1', 'Timer Start: %n');
-> Timer Start: timer1

dbg.time.start('timer1', null);
-> no output log (only start the timer)
dbg.time.split arg1: timer name(opt)
arg2: message(opt)
Print elapsed time of the timer
dbg.time.split();
-> timer0: T+00:01:02.345 (⊿00:01:02.345)
default timer name will be used in case no arguments are specified.

dbg.time.split('timer1');
-> timer1: T+00:01:02.345 (⊿00:01:02.345)

dbg.time.split('timer1', '[%n] epalsed time: %t (%dt)');
-> [timer1] elapsed time: T+00:01:03.345 (⊿00:00:01.000)

dbg.time.split('timer1', null);
-> no output log (only split the timer)
dbg.time.end
( dbg.time.e )
arg1: timer name(opt)
arg2: message(opt)
Print elapsed time of the timer and clear.
dbg.time.end();
-> timer1: T+00:01:02.345
default timer name will be used in case no arguments are specified.

dbg.time.end('timer1');
-> timer1: T+00:01:02.345

dbg.time.end('timer1', '[%n] epalsed time: %t (%dt)');
-> [timer1] elapsed time: T+00:01:03.345 (⊿00:00:01.000)

dbg.time.end('timer1', null);
-> no output log (only clear the timer)
dbg.time.check timer name Get elapsed time of the timer.
dbg.time.check();
-> A string like "T+00:01:23.456" will be returned.
default timer name will be used in case no arguments are specified.

dbg.time.check('timer1');
-> A string like "T+00:01:23.456" will be returned.
Command Execution
dbg.cmd arg1: command
arg2: echo(opt) arg3: saveHistory(opt)
Command execution
echo: true = print command line / false = silent(default)

dbg.cmd('rgb #fff'); 
dbg.cmd('rgb #fff', true); 
dbg.cmd('rgb #fff', true, true); 

>
dbg.cmd.set command Set a command line to command field.
dbg.cmd.set(''); 
dbg.cmd.exec Execute a command on the command line field.
dbg.cmd.exec(); 
dbg.cmd.focus Focus on command line field.
dbg.cmd.focus(); 
dbg.cmd.hasFocus Returns if the command line is active (has focus) or not.
dbg.cmd.hasFocus(); 
dbg.cmd.setMode mode (text|password) Set input mode of the command line.
dbg.cmd.setMode(''); 
dbg.cmd.saveHistory true|false Set a flag to save the command history.
dbg.cmd.saveHistory(true); 
dbg.cmd.saveHistory(false); 
dbg.cmd.getElement Returns an Element object of command line.
dbg.getCmdVal name Returns a command variable. (${name})
dbg.getCmdVal(''); 
dbg.setCmdVal arg1: name
arg2: value
Returns a command variable. (${name})
dbg.setCmdVal('', ''); 
BAT Execution
dbg.bat arg1: commands
arg2: arg(opt)
arg3: start line(opt)
arg4: end line(opt)
<div>#p1</div>
<div>#p2</div>

Multi command execution

var commands = '

';

dbg.bat(commands); 

var arg = '';

dbg.bat(commands, arg); 
dbg.bat(commands, arg, , ); 
dbg.bat(commands, arg, '', ''); 
<div>#p3</div>
<div>#p4</div>


You can also call like this.
var script = new dbg.TextBuffer();
script.add('echo off');
script.add('echo "foo"');
script.add('echo "bar"');
script.add('echo "baz"');
dbg.bat(script); 
dbg.bat.set commands
Set a batch script. (only set. not run.)

var commands = 'echo off\n';
commands += 'echo "foo"\n';
commands += 'echo "bar"\n';
commands += 'echo "baz"\n';

dbg.bat.set(commands); 
dbg.bat.run arg1: start line(opt)
arg2: end line(opt)
Execute a loaded batch script
dbg.bat.pause Pause the batch execution
dbg.bat.resume key(opt) Resume the batch execution
dbg.bat.stop Terminate the batch execution
dbg.bat.clear Clear loaded batch script from memory
dbg.bat.lock Increment the lock counter to make a lock status.
Batch execution will be blocked until the status to be changed to unlock.
dbg.bat.unlock Decrement the lock counter.
Batch execution will be resumed if the counter is 0.
dbg.bat.isRunning true = running / false = stopped
dbg.bat.isAvailable Returns if BAT script is available.
dbg.bat.isAvailable() 
dbg.bat.status Returns the following batch execution status.
"STOPPED"
"RUNNING"
"PAUSED"     Paused by "bat pause" command or [PAUSE] button.
"PAUSED_CMD" Paused by "pause" command.
dbg.bat.getPauseKey Returns current pausing key.
dbg.bat.setCond condition key Sets condition for resuming "condwait pause" command.
dbg.bat.setCond(''); 
dbg.bat.getCondKey Returns current condition key.
dbg.bat.getSymbols Returns labels array list.
dbg.bat.getSymbols('label') 
dbg.bat.getSymbols('function') 
dbg.bat.getSymbols('', '') 
dbg.bat.nestLv Returns current execution nest level.
dbg.bat.nestLv() 
dbg.bat.getPc Returns the current program counter (execution line).
dbg.bat.getList Get the program list of loaded batch script.
dbg.isBat text Returns whether the text is BAT script or not. (true / false)
var script = '

';
var ret = dbg.isBat(script); 
The function returns whether the string starts with "#!BAT!"
dbg.isB64Bat string Returns whether the given string is Base64 encoded BAT script or not.
var ret = dbg.isB64Bat(''); 
The function returns whether the string starts with "IyFCQVQh"
dbg.point.hint message Show/Update a message at the pointer position.
dbg.point.hint(''); 
dbg.point.hint.show Show a message at the pointer position.
dbg.point.hint.show(); 
dbg.point.hint.hide Hide the message at the pointer position.
dbg.point.hint.hide(); 
dbg.point.hint.clear Clear the message at the pointer position.
dbg.point.hint.clear(); 
Pseudo LED Controll
dbg.led value Set indicator bit pattern
bit position 7 6 5 4 3 2 1 0
dbg.led();
dbg.led.on bit position Turn on the indicator

dbg.led.on(n);
dbg.led.off bit position Turn off the indicator

dbg.led.off(n);
dbg.led.val Returns the current indicator value
dbg.led.val();
Message Area
dbg.msg message Set a string to the message display
dbg.msg('');
dbg.msg.clear Clear the message display
Stopwatch
dbg.stopwatch Launch stopwatch function (sw1)
dbg.stopwatch.start arg1: id (0|1)
arg2: message
Start stopwatch
id: 0=Small one in the upper right / 1=Big one in the TOOL panel

dbg.stopwatch.start();  (sw1)
dbg.stopwatch.start();  (w/o message)
dbg.stopwatch.start(, '');  (w/ message)
dbg.stopwatch.split arg1: id (0|1)
arg2: message
Split/LAP stopwatch

dbg.stopwatch.split();  (sw1)
dbg.stopwatch.split();  (w/o message)
dbg.stopwatch.split(, '');  (w/ message)
dbg.stopwatch.stop id (0|1) Stop stopwatch (pause)
dbg.stopwatch.stop();  (sw1)
dbg.stopwatch.stop(); 
dbg.stopwatch.end arg1: id (0|1)
arg2: message
Stop stopwatch (completely end measuring)

dbg.stopwatch.end();  (sw1)
dbg.stopwatch.end();  (w/o message)
dbg.stopwatch.end(, '');  (w/ message)
dbg.stopwatch.reset id (0|1) Reset stopwatch
dbg.stopwatch.reset();  (sw1)
dbg.stopwatch.reset(); 
dbg.stopwatch.val id (0|1) Returns current stopwatch value. (millis)
dbg.stopwatch.val();  (sw1)
dbg.stopwatch.val(); 
Watchdog
dbg.wd.start arg: timeout(opt) Start watchdog timer
dbg.wd.start();
dbg.wd.stop Stop watchdog timer
Debug Window Control
dbg.show Show debug window
dbg.hide Hide debug window
dbg.showHeaderInfo Show/Hide header info

dbg.showHeaderInfo(false);
dbg.showHeaderInfo(true);
dbg.setWindowSize arg1: width
arg2: height

or
arg1:
normal
expand
full
restore
reset
Set the debugger window size.
dbg.setWindowSize(, ); 
dbg.setWindowPos arg1: x
arg2: y
Set the debugger window position.
dbg.setWindowPos(, ); 
dbg.opacity 0.1-1 Set the level of transparency of the debug window.
dbg.opacity(); 
dbg.isVisible Returns if the debug window is visible.
dbg.isVisible(); 
-> 
dbg.pin true|false Fix the debug window in its position.
dbg.pin(); 
return: status(true|false)
dbg.zoom zoom ratio Zoom the debug window.
dbg.zoom(); 
return: the zoom ratio
dbg.getOptionValue key Returns debugger option value.
dbg.getOptionValue(''); 
dbg.getStatus Returns debugger inner status.
dbg.getStatus(); 
dbg.getUiStatus Returns debugger UI inner status.
dbg.getUiStatus(); 
dbg.getFeatureStack Returns feature stack. (copy of inner value)
dbg.getFeatureStack(); 
Testing
dbg.test.init Test Name Initialize the test with test name.
All inner status will be initialized and "running" status will be set to "true".
This is the same as $test init command.
dbg.test.init(''); 
dbg.test.end Finalize the test.
The running status will be set to false.
Test finished time will be set.
This is the same as $test end command.
dbg.test.end(); 
dbg.test.getResult to JSON flag Returns the test result object.

dbg.test.getResult();Object 
dbg.test.getResult(true);JSON 

JSON FORMAT EXAMPLE:
a = 1
b = 3
c = 'abc'

test init -name "TestName"
test set desc "Description1"
test set desc "Description2"

test set id "Test01"
test set comment "Comment1-1"
test set comment "Comment1-2"
test verify a == 1
test verify -label "label1" b == 2

test set id "Test02"
test set comment "Comment2"
test verify -label "label2" c == "abc"

test set id "Test03"
test set result ERR -label "label3" -info "Something went wrong"

test end
dbg.test.getResult(true);
{
 "name": "TestName",
 "desc": [
  "Description1",
  "Description2"
 ],
 "startTime": 1545229050321,
 "endTime": 1545229050434,
 "totalResult": "ERR",
 "count": {
  "ok": 2,
  "ng": 1,
  "err": 1,
  "nt": 0
 },
 "results": {
  "Test01": {
   "comment": [
    "Comment1-1",
    "Comment1-2"
   ],
   "results": [
    {
     "label": "",
     "status": "OK",
     "method": "==",
     "exp": 1,
     "got": 1,
     "info": ""
    },
    {
     "label": "label1",
     "status": "NG",
     "method": "==",
     "exp": 2,
     "got": 3,
     "info": ""
    }
   ]
  },
  "Test02": {
   "comment": [
    "Comment2"
   ],
   "results": [
    {
     "label": "label2",
     "status": "OK",
     "method": "==",
     "exp": "abc",
     "got": "abc",
     "info": ""
    }
   ]
  },
  "Test03": {
   "comment": [],
   "results": [
    {
     "label": "label3",
     "status": "ERR",
     "method": null,
     "exp": null,
     "got": null,
     "info": "Something went wrong"
    }
   ]
  }
 }
}
dbg.test.getLastResult Returns the last test result.
dbg.test.getLastResult(); 
dbg.test.getTotalResult Returns the total test result.
dbg.test.getTotalResult(); 
dbg.test.getStatus Returns the inner status.
dbg.test.getStatus(); 
dbg.test.isRunning Returns whether test is running.
dbg.test.isRunning(); 
dbg.test.nextSeq Returns sequential number for test ID.
dbg.test.nextSeq(); 

This value is also available for $test set id command.
e.g., $ test set id "TEST-%SEQ%"
       -> "TEST-1" is set for ID.

The value will be reset at the beginning of test. ($test init)
dbg.test.setSeq Sets the sequential number for test ID explicitly.
dbg.test.setSeq(); 
Util
dbg.getType object Returns object type.

"abc"        -> "string"
123          -> "number"
true         -> "boolean"
false        -> "boolean"
null         -> "null"
undefined    -> "undefined"
function()   -> "function"
[object Xxx] -> "Xxx"
other        -> "object"

dbg.getType(); 
dbg.getBrowserType Get browser type info

e.g.,
{
  name: 'Firefox',
  version: '50.0'
}
dbg.copy string Copy to clipboard.
dbg.copy(''); 
dbg.countElements element selector Count number of elements.
dbg.countElements('*');
dbg.countElements('*', true); 
-> Count all elements

dbg.countElements('#id');
-> Count the id's element
   dbg.countElements('#title');

dbg.countElements('.className');
-> Count elements which has the className.

dbg.countElements('tagName');
-> Count elements which correspond to the tagName.
   dbg.countElements('div');
dbg.getElement arg1: #id / .className / tagName
arg2: index(opt)
Get an DOM element object of the specified selector

e.g.,
dbg.getElement('#id');
dbg.getElement('.className', 0);
dbg.getElement('tagName', 1);

Returns an DOM element or null if an element with the specified selector is not in the document.
dbg.getElPosSize DOM element object / #id / .className / tagName Get the position and size of the specified DOM element

e.g.,
{
 x: 504,
 y: 77,
 w: 269,
 h: 94
}
dbg.getHTML base64 flag(opt) Dump the serialized HTML string of the whole document
base64 flag: false = plain text / true = Base64 encoded string
dbg.html2text html Convert HTML to plain text.
dbg.encodeBase64 string Encodes Base64 string.
var ret = dbg.encodeBase64(''); 
dbg.decodeBase64 string Decodes Base64 string.
var ret = dbg.decodeBase64(''); 
dbg.isBase64 string Returns whether the given string is Base64 or not.
var ret = dbg.isBase64(''); 
dbg.random arg1: min(opt)
arg2: max(opt)
Get random number
min: minimum number
max: maximum number
dbg.getRandomString arg1: min
arg2: max
arg3: table(opt)
Get random string
min  : minimum length
max  : maximum length
table: character table

dbg.getRandomString(8);
dbg.getRandomString(1, 8);
dbg.getRandomString(1, 8, 'ABCDEFGHIJKLMNOPQRSTUVWXYZ');
dbg.escHtml string Perform HTML sanitization.
< -> &lt;
> -> &gt;
& -> &amp;
" -> &quot;
' -> &#39;
dbg.escape string Escape the specified character(s).

dbg.escape('abc"123"xyz', '"');
-> 'abc\"123\"xyz'

dbg.escape('abc"123"xy\\z', ['\\\\', '"']);
-> 'abc\"123\"xy\\\z'
dbg.toHalfWidth string Convert full-width character(s) to half-width.
dbg.toHalfWidth(''); 
dbg.toFullWidth string Convert half-width character(s) to full-width.
dbg.toFullWidth(''); 
dbg.isAscii string Returns if the given string consists of valid 7–bit US-ASCII characters.
dbg.isAscii(''); 
dbg.hex2base64 HEX Convert HEX to Base64 encoded string.
dbg.hex2base64(''); 
dbg.base642hex string Convert Base64 encoded string to HEX.
dbg.base642hex(''); 
dbg.hex2str HEX Convert HEX to string. (UTF-8)
dbg.hex2str(''); 
dbg.str2hex string Convert string(UTF-8) to HEX
dbg.str2hex(''); 
dbg.getProtocol Returns the protocol scheme of the URL, including the final ':'.
dbg.getHost Returns the domain of the URL.
dbg.getPort Returns the port number of the URL.
dbg.getParentPath Returns parent path of the URL.
dbg.getQuery key(opt) Returns the query string of the URL.
?a=1&b=2 : dbg.getQuery() -> "a=1&b=2"
?a=1&b=2 : dbg.getQuery('a') -> "1"
?a=1&a=2&b=3 : dbg.getQuery('a') -> ["1", "2"]

var value = dbg.getQuery(); 
var value = dbg.getQuery('');
dbg.getUrlHash Returns the hash string of the URL.
dbg.loadobj key Returns an object that is saved into the localStorage, or null if the key does not exist in the Storage.
dbg.saveobj arg1: key
arg2: object
Save the given object into the localStorage.
dbg.clearobj key Clear an object that is corresponding to the given key from the localStorage.
dbg.fromJSON text
reviver(opt)
Parses a JSON string, constructing the JavaScript value or object described by the string
dbg.toJSON value
replacer(opt)
space(opt)
Converts a JavaScript value to a JSON string
dbg.obj2json object Returns JSON string of given object in a Friendly Readable Format.
var obj = ;
dbg.obj2json(obj); 
dbg.formatJSON string Returns JSON string of given 1-line JSON in a Friendly Readable Format.
var str = '';
dbg.formatJSON(str); 
dbg.getKeys object Returns property key name array of the object
var obj = {
  key1: 'A',
  key2: 'B',
  key3: 'C',
};

dbg.getKeys(obj);
-> ['key1', 'key2', 'key3']
dbg.xlsCol column name / column number Returns the Excel column number for a reference and vice versa.
dbg.xlsCol(''); 
dbg.xlsCol(); 
dbg.arr.count arg1: array
arg2: value
arg3: strict mode(opt)
Count the value of array.

var array = [];

dbg.arr.count(array, ); 
dbg.arr.count(array, , ); 
dbg.arr.pos arg1: array
arg2: value
arg3: strict mode(opt)
Returns the position of the specified element in the array.
The function returns -1 if the element was not found.

var array = [];

dbg.arr.pos(array, ); 
dbg.arr.pos(array, , ); 
dbg.arr.has arg1: array
arg2: value
arg3: strict mode(opt)
Returns if the specified value exists in the array.

var array = [];

dbg.arr.has(array, ); 
dbg.arr.has(array, , ); 
dbg.arr2set arg1: array
arg2: strict mode(opt)
Convert array to set.

var array = [];

dbg.arr2set(array); 
dbg.arr2set(array, ); 
dbg.http arg1: request
arg2: callback(opt)
Send an HTTP request.
var request = {
  url: '',
  method: '',
  data: '',
  async: ,
  cache: ,
  user: '',
  pass: '',
  contentType: '',
  withCredentials: ,
  headers: {
    key1: value1,
    key2: value2,
    ...
  },
  cb: callback
};

dbg.http(request); 

// xhr: XMLHttpRequest
// res: xhr.responseText
// req: request
function callback(xhr, res, req) {
  var statusMsg = xhr.status + ' ' + xhr.statusText;
  if (xhr.status == 0) {
    log.e('cannot load: ' + statusMsg);
  } else {
    log(statusMsg);
  }
  var head = xhr.getAllResponseHeaders();
  var body = res.replace(/</g, '&lt;');
  body = body.replace(/>/g, '&gt;');
  if (head || body) {
    log(head + '\n'+ body);
  }
}
dbg.sleep ms Causes the currently executing thread to sleep

log('sleep start');
sleep: ms; 
log('sleep end');
dbg.addCmdListener listener Adds a listener function for the command input.

function cmdListener(str) {
  if (some condition) {
    // The default action should not be taken as it normally would be.
    return false;
  }
}
dbg.addCmdListener(cmdListener);
dbg.addEvtListener arg1: type
arg2: listener
Adds the specified EventListener function to the list of event listeners for the specified event type.

type: batstart
Callback function which is called before starting batch execution.
Function format:
  function onBatStart() {}

type: batstop
Callback function which is called after stopped batch execution.
Function format:
  function onBatStop(exitstatus) {}

type: ctrlc
Callback function which is called when Ctrl+C is pressed on the command line.
Function format:
  function onCtrlC() {}

type: drop
Callback function which is called when a file or text is dropped on the log window.
Function format:
  function onDrop(event) {}

type: error
Callback function which is called when an error log is printed.
Function format:
  function onError() {}

type: fileloaded
Callback function which is called when file load has been completed.
Function format:
  function onFileLoaded(file, content, isB64) {}

  file   : meta info (MIME Type, Size, Modified date)
  content: File content
  isB64  : true = Base64 encoded / false = Binary ArrayBuffer

type: stopwatch
Callback function which is called when the stopwatch status is changed.
Function format:
  function onStopwatch(id, type, millis(for start, stop)) {}

  id  : 0 = mini stopwatch
        1 = stopwatch on the tool window
  type: start, stop, reset, timesup (id 1 dedicated)

type: unlock
Callback function which is called when the debug window is unlocked.
Function format:
  function onUnlock() {}

type: watchdog
Callback function which is called when the watchdog timer has been timed out.
Function format:
  function onWatchdogTimeout(elapsed) {}
dbg.addFileLoader arg1: target element
arg2: callback function
arg3: mode('b64' or 'bin')
arg4: decode
Add File Loader Handler

Handler format:
  function(file, content)

In case that mode is 'bin', arg4 decode is ignored.
dbg.addDropHandler arg1: target element
arg2: callback function
Add Drop Handler

Handler format:
  function(content)
dbg.createResBox message Returns a read-only textarea tag string with given message.
This is intended to display some result or response.
var html = dbg.createResBox('');  
dbg.createResBoxErr message Returns a read-only textarea tag string with given message. (error style)
var html = dbg.createResBoxErr('');  
dbg.adjustResBox px Adjust height of textarea which is created by createResBox().
dbg.adjustResBox(); 
Cookie
dbg.getCookie key(opt) Returns a value of the specified key.

var cookies = dbg.getCookie(); 
Returns a map object consists of key and value.

var val = dbg.getCookie(''); 
dbg.setCookie arg1: key
arg2: value
Set a value for the specified key.
dbg.setCookie('', ''); 
dbg.deleteCookie key Delete the specified key.
dbg.deleteCookie(''); 

Delete all cookies.
dbg.deleteCookie(); 
Command Line Argument Operation
dbg.splitArgs argument-string Splits a given argument string into an array of strings by separating the string into substrings, using whitespace character " ".
var args = dbg.splitArgs(''); 
dbg.splitCmdLine argument-string An extended version of splitArgs(). (grouped by "", '', ())
var ret = dbg.splitCmdLine(''); 
dbg.splitCmdLineInTwo argument-string Splits a command line in two.
var ret = dbg.splitCmdLineInTwo(''); 
dbg.countArgs argument-string Returns number of arguments.
dbg.countArgs(''); 
dbg.getArgVal argument-string
index
Returns a value of an option.
var val = dbg.getArgVal('', ); 
dbg.getOptVal argument-string
key
Returns a value of an option.
var val = dbg.getOptVal('', ''); 
dbg.getOptVals argument-string Returns values of options.
var vals = dbg.getOptVals(''); 
dbg.getNonOptVals argument-string Returns values of non options.
var vals = dbg.getNonOptVals(''); 
var vals = dbg.getNonOptVals('', true); 
dbg.get1stOpt argument-string Returns the 1st option name in the argument.
var opt = dbg.get1stOpt(''); 
dbg.hasOpt argument-string
key
Returns if the arguments has an option.
dbg.hasOpt('', ''); 
dbg.countOpts argument-string Returns the count of options.
dbg.countOpts(''); 
Initialization
dbg.init options Initialize debug.js
See also: // Options section.
dbg.isReady Returns if debug.js is initialized
"dbg" is an alias of "DebugJS". / "log" is an alias of "dbg.log".
debug.js will not use aliases in case of those that are already defined.

// Classes
RingBuffer
Name Arguments Description
Constructor buffer size
add string Add the string to the buffer
get index Returns the string in the specified index of the buffer
getAll Returns the all contents array in the buffer
set arg1: index
arg2: string
Set the string to the specified index in the buffer
clear Clear the buffer
count Returns the buffer count
size Returns the buffer size
var buf = new dbg.RingBuffer(3);
buf.add('a');
buf.add('b');
buf.add('c');
buf.add('d');
buf.add('e');
buf.getAll();
-> ['c', 'd', 'e']
TextBuffer
Constructor string Constructs a buffer with the given string.
In case of no argument, constructs with no characters in it.
add string Add a line to the buffer with LF
toString Returns the text buffer
var buf = new dbg.TextBuffer();
buf.add('a');
buf.add('b');
buf.add('c');
buf.toString();
->
aLF
bLF
cLF

// Commands
Name Arguments Description
alias name=command Define or display aliases.
$ alias [name=['command']]
arr2set array Convert Array to Set.

$ arr2set ['a', 'b', 'c', 'a', 'b']
-> ['a', 'b', 'c']

$ arr2set -j ['a', 'b', 'c', 'a', 'b']
-> Output in JSON format.
[
  "a",
  "b",
  "c"
]

$ arr2set -s ['a', 'b', '1', 1]
-> ['a', 'b', '1', 1] (Strict mode)

$ arr2set -sort ['z', 'a', 'b', 'a']
-> ['a', 'b', 'z']
ascii Print all ASCII characters
base64 arg1: operation
arg2: string
Encodes / Decodes Base64 string.
operation: -e encode(default option)
           -d decode

$ base64 -e abcdefg
-> YWJjZGVmZw==

$ base64 -d YWJjZGVmZw==
-> abcdefg
base64s arg1: operation
arg2: key
arg3: string
Base64 with XOR encryption by the specified key.
operation: -e encode(default option)
           -d decode

key      : -k KEY

$ base64s -e -k xyz abcdefg
-> GRsZHBwcHwA=

$ base64s -d -k xyz GRsZHBwcHwA=
-> abcdefg
bat arg1: run|pause|stop|list|status|pc|clear|exec|set
arg2: start line(opt)
arg3: end line(opt)
Operate BAT Script
$ bat run -s START-LINE(opt) -e END-LINE(opt) -arg ARGUMENT(opt) 
$ bat pause
$ bat stop
$ bat list start-line(opt) end-line(opt)
$ bat status key(opt)
$ bat clear
$ bat exec b64-encoded-bat

$ bat run 1
-> Execute only line 1

$ bat run -s 3 -e 5
-> Execute from line 3 through line 5

$ bat run -s 3
-> Execute from line 3 through the end

$ bat pc
-> Displays current program counter

$ bat labels [pattern(RegExp)]
-> Displays label list

$ bat set b 1
$ bat set break 1
-> Sets a break point to the specified line.

$ bat set delay 1000
$ bat set delay 1d2h3m4s500
-> Sets execution delay.

$ bat set pc 1
-> Sets the program counter to the specified line.
bit bit position or num of bits Displays the value of the given bit position.

$ bit 8
HEX 0x80
DEC 128
OCT 0200
BIN 0000 0000 0000 0000 0000 0000 1000 0000 (8 bits)

$ bit -a 8
HEX 0xFF
DEC 255
OCT 0377
BIN 0000 0000 0000 0000 0000 0000 1111 1111 (8 bits)
bsb64 Encodes / Decodes BSB64(Bit Shifted Base64) reversible encryption string.

operation: -e encode(default option)
           -d decode

-i Iput string
-n Number of bit rotation
    1-7 : n bit rotate left (default=1)
      0 : bit inversion

$ bsb64 -e -i "abc" -n 1
-> wsTG

$ bsb64 -d -i "wsTG" -n 1
-> abc

Simple usage:
$ bsb64 abc
$ bsb64 -e abc
$ bsb64 -d wsTG
$ bsb64 -d wsTG$N (equal to bsb64 -d -i "wsTG" -n N)
bswap hex Swaps the byte ordering.

$ bswap 1234
> 0x3412
HEX 0x3412
DEC 13,330
OCT 032022
BIN 0000 0000 0000 0000 0011 0100 0001 0010 (14 bits)
byte B
KB
MB
GB
TB
PB
Convert KB/MB/GB/TB/PB <--> Bytes. (case-insensitive)
$ byte -k 1
$ 1KB
->
1 KB
1,024  B


$ byte -m 1
$ 1MB
->
1 MB
1,024 KB
1,048,576  B


$ byte -g 1
$ 1GB
->
1 GB
1,024 MB
1,048,576 KB
1,073,741,824  B


$ byte 1048576
$ 1048576 b
->
1 MB
1,024 KB
1,048,576  B
chars arg1: start character
arg2: end character
Print Unicode characters that consists of consecutive code points

$ chars A Z
$ chars 0x41 0x5A
$ chars U+0041 U+005A
-> ABCDEFGHIJKLMNOPQRSTUVWXYZ
close function
Close a function
function
  measure: Screen Measure
  sys    : System Info
  dom    : Element Info
  js     : JavaScript Editor
  tool   : Tools
  ext    : Extension Panel
clock Manipulate the clock.
$ clock 20210508T123456
$ clock -3600000
$ clock now
$ clock stop
$ clock start
$ clock on
$ clock off
$ clock -label "2021-05-08 SAT 12:34:56"
cls Clear log message.
chmod mode Convert the Linux file mode between numeric and symbolic notation.

$ chmod 755
-> rwxr-xr-x

$ chmod rwxr-xr-x
-> 755
code code statement Execute a code statement as pure JavaScript.
condwait arg1: operation
arg2: key
Sets condition key and pause BAT execution.
$ condwait set -key <key>
$ condwait pause [-timeout ms|1d2h3m4s500] [-q]
dbg.bat.setCond(<key>);

$ condwait init
-> Clear the waiting condition forcibly.
cookie arg1: operation
arg2: key
arg3: value
Manipulate cookie.
$ cookie keys
-> Get all keys in the cookie

$ cookie get "<key>"
-> Get a value

$ cookie get -a
-> Get all keys and values

$ cookie set "<key>" "<value>"
-> Set a value for the key

$ cookie delete "<key>"
-> Delete the key

$ cookie delete -a
-> Delete all keys from the cookie
copy string Copy to clipboard.
$ copy
-> Copy the logs

$ copy "abc"
-> Copy the string
dbgwin arg1: operation
arg2: parameter
arg3: parameter
Control the debug window

operation: show
 Show debug window

operation: hide
 Hide debug window

operation: pos
 Set the debugger window position.
 parameter1:
 n: center | top
 ne: right | top
 e: right | middle
 se: right | bottom
 s: center | bottom
 sw: left | bottom
 w: left | middle
 nw: left | top
 c: center | middle

 parameter1:
  pos-x

 parameter2:
  pos-y

operation: size
 Set the debug window size
 parameter1: width
 parameter2: height

operation: opacity
 Set the level of transparency of the debug window
 parameter1:
  0.1-1

operation: status
 Show the status of the debug window

operation: lock
 Hide and lock the debug window with lock code
 parameter1:
  lock code
 See also: Options -> lockCode
date millis / Date-Time Convert millis <--> Date-Time
-iso option: output in ISO 8601 format

$ date 1549683296789
-> 2019-02-09 12:34:56.789 +09:00 SAT

$ date 1549683296.789
-> 2019-02-09 12:34:56.789 +09:00 SAT

$ date 1549683296.
-> 2019-02-09 12:34:56.000 +09:00 SAT

$ date 2000/01/01 00:00:00
-> 2000-01-01 00:00:00.000 +09:00 SAT (946652400000)

$ date 20180620T123456.987
-> 2018-06-20 12:34:56.987 +09:00 WED (1529465696987)

$ date
-> 2019-08-30 23:50:58.209 +09:00 FRI (1567176658209) current time

$ date -iso
-> 20190830T235058.209+0900 (1567176658209) current time

$ date -iso 1500000000000
-> 20170714T114000.000+0900

w/ time zone offset
$ date -0700
-> 2019-08-30 07:53:21.312 -07:00 FRI (1567176801312)

$ date 1549683296789 -0700
-> 2019-02-08 20:34:56.789 -07:00 FRI

$ date 2000/01/01 00:00:00 -0700
-> 2000-01-01 00:00:00.000 -07:00 SAT (946710000000)
delay arg1: millis|target time
arg2: command
Delay command execution

$ delay 1000 echo "abc"
$ delay 20180520T170030 echo "abc"
$ delay T170030 echo "abc"
$ delay T0000|T1200 echo "abc"
$ delay T**30 echo "abc"
$ delay 1d2h3m4s500 echo "abc"
$ delay 1.5s echo "abc"

$ delay -c
Cancel the execution

$ delay -q
Check the execution queue
echo string or expression Display the ARGs on the log window
$ echo "abc"
-> echo "abc"
   abc

$ @echo "abc"
-> abc

$ echo 1 + 2
-> echo 1 + 2
   3

$ echo off
-> Command echo will be turned off

$ echo on
-> Command echo will be turned on
elements (opt) #id / .class / tagName Count elements by #id / .className / tagName.
$ elements #header
DIV   6
A     1
IMG   1
BR    1
Total 9

Filtering by attribute:

$ elements -innerText "Download"
A       1
BUTTON  1
Total   2

$ elements -value "hidden-value-1"
INPUT   1
Total   1
event arg1: operation
arg2: target
arg3: value
Manipulate an event.

Create New Event
$ event create mousedown

Set Properties
$ event set button 0
$ event set propertyName "value"quoted value is treated as a string

Dispatch to a target
$ event dispatch windowtarget
$ event dispatch documenttarget
$ event dispatch activetarget (document.activeElement)
$ event dispatch pointtarget (pointed element by point command)
$ event dispatch #idtarget
$ event dispatch .classNametarget 0index(opt)
$ event dispatch tagNametarget 0index(opt)

Clear the event object
$ event clear

e.g., Send a Key Down Event (A + Shift) to window
$ event create keydown
$ event set keyCode 65
$ event set shiftKey true
$ event set ctrlKey false
$ event set altKey false
$ event set metaKey false
$ event dispatch window
exit Close the debug window and clear all status.
float value
Displays IEEE 754 bit-level encodings.

$ float -118.625

binary32: -118.625
-1110110.101
 133(+6)
 8bits   23bits
seeeeeeeefffffffffffffffffffffff
11000010111011010100000000000000
C   2   E   D   4   0   0   0

binary64: -118.625
-1110110.101
 1029(+6)
 11bits     52bits
seeeeeeeeeeeffffffffffffffffffffffffffffffffffffffffffffffffffff
1100000001011101101010000000000000000000000000000000000000000000
C   0   5   D   A   8   0   0   0   0   0   0   0   0   0   0


$ float -b 11000010111011010100000000000000
$ float 0b11000010111011010100000000000000
$ float -b -1110110.101

binary32: -118.625
-1110110.101
 133(+6)
 8bits   23bits
seeeeeeeefffffffffffffffffffffff
11000010111011010100000000000000
C   2   E   D   4   0   0   0


$ float -h C2ED4000
$ float 0xC2ED4000

binary32: -118.625
-1110110.101
 133(+6)
 8bits   23bits
seeeeeeeefffffffffffffffffffffff
11000010111011010100000000000000
C   2   E   D   4   0   0   0
history option(opt) Displays command history.

Option:
-c
  Clear the history list.

-d offset
  Delete the history entry at position offset.
http arg1: method(opt)
arg2: url
arg3: data to send(opt)
Send an HTTP request by specified method.
This command perform the operation synchronously and XMLHttpRequest object will be returned.

method:
The HTTP method to use, such as GET, POST, HEAD, PUT, DELETE, OPTIONS, etc.
GET is set as the default value in case of that the method is not specified.

e.g.,

GET The results of the following commands will be the same.
 http get https://debugjs.net/test/?abc=123&xyz=987
 http https://debugjs.net/test/?abc=123&xyz=987
 https://debugjs.net/test/?abc=123&xyz=987

POST
 http post https://debugjs.net/test/ abc=123&xyz=987

HEAD
 http head https://debugjs.net/test/

w/ User Auth
 http [METHOD] -u USER:PASS URL DATA
inject arg1: function name
arg2: code
Inject a given code into a given function.
The given code will be inserted into the beginning of the function.

$ inject func1 "log('func1 was called');"
int value Convert DEC / HEX / BIN to other radix base number.
$ int 128
->
HEX 0x80
DEC 128
OCT 0200
BIN 0000 0000 0000 0000 0000 0000 1000 0000 (8 bits)

$ int 0x20
->
HEX 0x20
DEC 32
OCT 040
BIN 0000 0000 0000 0000 0000 0000 0010 0000 (6 bits)

$ int 0b1010
->
HEX A
DEC 10
OCT 012
BIN 0000 0000 0000 0000 0000 0000 0000 1010 (4 bits)
json one-line JSON Parse one-line JSON.
$ json {"name": "John Smith", "age": 25, "city": "New York"}
-> Convert JSON strings to a Friendly Readable Format like below.

{
 "name": "John Smith",
 "age": 25,
 "city": "New York"
}
Option:
-p
  Print the object in the same format as p command.

-l<n>
  Recursion level limit
keypress keycode Dispatch a keyevent to active element.

$ keypress 1 -shift -ctrl -alt -meta
keys Object(s) Displays all enumerable property keys of an object.
kiosk zoom ratio(opt) Make the debugger window go full screen.
laptime Lap time test togglable
Start the stopwatch and print the measurement time by clicking left mouse button.
The stopwatch will be reset with each clicking.
lc string To lower case
$ lc ABC
-> abc
led bit pattern(0-255) Set a bit pattern to the indicator.
e.g.,
$ led 1      
$ led 255    
$ led 0x20   
$ led 0b111  
len string Count the length of the given string.
$ len abc
-> 3

$ len abc★(length)
-> 4

$ len -b abc★(UTF-8 bytes)
-> 6
log arg1: operation
arg2: args
Manipulate log output

bufsize:
Set the log buffer size
$ log bufsize 1000
-> Set the size to 1000

$ log bufsize
-> Show the current size

copy:
Copy to clipboard
$ log copy

date:
Show date
$ log date on
-> 1: 2019-06-25 21:45:00.000 Hello, world!

$ log date off
-> 1: 21:45:00.000 Hello, world!

dump:
Export the log buffer in JSON format
$ log dump
-> export in JSON format

$ log dump -b64
-> export in base64 encoded JSON format

 See also:
  log load command
  dbg.loadLog()
  dbg.dumpLog()


filter:
Set log filter
$ log filter "Filter String"
-> case insensitive

$ log filter -case "Filter String"
-> case sensitive

load:
Load logs into the debug window

$ log load JSON
$ log load -b64 Base64-encoded-JSON

JSON Format
[{"type":1,"time":"12:34:56.789","msg":"SGVsbG8sIFdvcmxkIQ==(b64)"},...]

 See also:
  log dump command
  dbg.dumpLog()
  dbg.loadLog()


preserve:
Preserve log
$ log preserve on
$ log preserve off

suspend:
Suspend log output
$ log suspend on
$ log suspend off

lv:
Set log level filter
$ log lv LOG|VRB|DBG|INF|WRN|ERR|FTL
$ log lv ALL
$ log lv NONE
mod arg1: digit(opt)
arg2: code
Calculate check digit by modulus N.

$ mod 10|11|43 [-w WEIGHT] [DIGIT] CODE

e.g.,

# JAN-13
$ mod 10 456995111617
> 9

$ mod10 13 4569951116179
> OK

$ mod 10 13 4569951116178
> NG

# UPC-A
$ mod 10 01234567890
> 5

$ mod 10 12 012345678905
> OK

$ mod 10 12 012345678906
> NG

$ mod 10 -w 2 123456789012
> 0


$ mod 11 12345678901
> 8

$ mod 11 12 123456789018
> OK

$ mod 11 12 123456789019
> NG


$ mod 43 ABC123
> $

$ mod 43 6 ABC123$
> OK
msg message Set a string to the message display.
-c option: Clear the message.
nexttime time-string Returns next time from given args.

now = 2019-03-20 00:00:00.000
$ nexttime T0000|T0930|T1345
-> 2019-03-20 WED 00:00:00.000
   Returns "T0000"

$ nexttime T**30
-> 2019-03-20 WED 00:30:00.000
   Returns "T0030"

$ nexttime T******
-> 2019-03-20 WED 00:00:01.000
   Returns "T000001"

$ nexttime 1d2h3m4s
-> 2019-03-21 WED 02:03:04.000
   Returns "T020304"

$ nexttime 60000
-> 2019-03-20 WED 00:01:00.000
   Returns "T000100"

$ nexttime -q T0000|T0930|T1345
-> Quiet display option
now Returns the number of milliseconds elapsed since Jan 1, 1970 00:00:00 UTC.
open arg1: function
arg2: sub function
arg3: option
Launch a function
function
  measure: Screen Measure
  sys    : System Info
  dom    : Element Info
  js     : JavaScript Editor
  tool   : Tools
  ext    : Extension Panel

sub function (for tools)
  timer: Clock/Timer
  font : Font Checker
  file : File Loader
  html : HTML Editor
  bat  : Batch editor

sub function (for ext)
  panel index or panel name

option
  for timer: mode
    clock: Clock
    sw   : Stopwatch
  for tools.file: load format
    b64: Base64
    bin: Binary
num arg1: value1
arg2: value2
arg3: step(opt)
Displays the numbers in order.
$ num 1 10
1
2
3
4
5
6
7
8
9
10

$ num -z 1 10
01
02
03
04
05
06
07
08
09
10

$ num 0 10 2
0
2
4
6
8
10
p -l: recursion level limit
-j: in JSON format(opt)
expression
Print value of expression EXP.
$ p object
-> dump all properties w/ limit (1000)

$ p -l<n> object
-> dump properties w/ recursion level limit

$ p -json object
-> dump in JSON format

$ p -a object
-> dump all properties w/o limit (may be out of memory)
pause -key key(opt)
-timeout ms(opt)
Suspends processing of batch file.
Click, press any key, or execute "resume" command to resume.
-key option requires "resume -key key" command or dbg.bat.resume('key') to resume.
-timeout option(opt): Set time-out value in milliseconds.
-q option(opt): Silent mode

$ pause [-q]
click / key press

$ pause -key aaa [-timeout ms|1d2h3m4s500|T123456|T****00]
$ resume
$ resume -key aaa

$ pause -key aaa|bbb [-timeout ms|1d2h3m4s500|T123456|T****00]
$ resume
$ resume -key aaa
$ resume -key bbb

$pause -key [-timeout ms|1d2h3m4s500|T123456|T****00]
$ resume / $ resume -key
pin on|off Fix the window in its position

point coordinate / element / operation Manipulate the pseudo pointer.

$ point 100 200
-> Show the pointer at x=100px, y=200px

$ point +10 +20
$ point -10 -20
-> Move the pointer from current position

$ point CSS-Selector -alignX 0.50-1(opt) -alignY 0.50-1(opt)
$ point #id
$ point .className
$ point .className index
$ point tagName
$ point tagName index
$ point node+[N]
$ point node-[N]
$ point bytext "INNER_TEXT" index
$ point byattr ATTR_NAME "VALUE" index
-> Point the specified element

$ point center Center of the screen
$ point center 100
$ point left 100
$ point right 100
$ point 100 middle
$ point 100 bottom
$ point mouse Current mouse position
-> Point the specified position

$ point hide
-> Hide the pointer

$ point show
-> Show the pointer

$ point click -speed 500click speed in ms (opt:default=100)
-> Click the current position

$ point cclick -speed 500click speed in ms (opt:default=100)
-> Center click the current position

$ point rclick -speed 500click speed in ms (opt:default=100)
-> Right click the current position

$ point dblclick -speed 200click speed in ms (opt:default=100)
-> Double click the current position

$ point contextmenu
$ point focus
$ point blur
$ point change
-> Dispatch the specified event to the current position

$ point mousedown 0button(0-4)
-> Dispatch the mousedown event to the current position

$ point mouseup 0button(0-4)
-> Dispatch the mouseup event to the current position

$ point keydown -keyCode 65 -code KeyA -key a -sshiftKey(opt) -cctrlKey(opt) -aaltKey(opt) -mmetaKey(opt)
-> Dispatch the keydown event to the current position

$ point keypress -keyCode 65 -code KeyA -key a -sshiftKey(opt) -cctrlKey(opt) -aaltKey(opt) -mmetaKey(opt)
-> Dispatch the keydown event to the current position

$ point keyup -keyCode 65 -code -code KeyA -key a -sshiftKey(opt) -cctrlKey(opt) -aaltKey(opt) -mmetaKey(opt)
-> Dispatch the keydown event to the current position

$ point text "abc123" -speed 10(opt) -step 2(opt) -start 1(opt) -end 6(opt)
  speed: input speed in millis(default=30 / 50-500=50ms to 500ms in random)
  step : number of characters to input at a time (default=1)
  start: animation sequence end position
  end  : animation sequence end position
-> Input text into the current position (<input>, <textarea>)

$ point selectoption set text "option1"
$ point selectoption set value "1"
-> Select a <select> option value at the current position

$ point selectoption get text
-> "option1"
$ point selectoption get value
-> "1"

$ point selectoption get texts
-> ["Option1", "Option2", "Option3"]
$ point selectoption get values
-> ["1", "2", "3"]

$ point scroll x y
-> Scroll the current position
x: [+|-]val | left | center | right | current
y: [+|-]val | top | middle | bottom | current

$ point position -speed 10speed ms(opt) -step 10step px(opt) -alignX 0.50-1(opt) -alignY 0.50-1(opt)
$ point move x y
$ point move #id
$ point move .className 0index
$ point move CSS-Selector
$ point move tagName 0index
$ point move node+[N]
$ point move node-[N]
$ point move bytext "INNER_TEXT" 0index
$ point move byattr ATTR_NAME "VALUE" 0index
$ point move center Center of the screen
$ point move center 100
$ point move left 100
$ point move right 100
$ point move 100 middle
$ point move 100 bottom
$ point move mouse Current mouse position
-> Move the pointer from the current position to the specified position

$ point move +100 +200
$ point move -100 -200
-> Move the pointer to the specified position (relative)

$ point drag <The rest of the arguments are the same as point move command>
-> Drag the pointer to the specified position

$ point event eventType -prop1 val1 -prop2 val2
-> Send a event to the pointer position

$ point hint msg "hello!"
-> Show a message at the pointer position

$ point hint msgseq "hello!"
$ point hint msgseq "hello!" -speed 500(opt) -step 2(opt) -start 3(opt) -end 5(opt)
-> Show a message at the pointer position with sequence animation.

$ point hint hide
-> Hide a message

$ point hint show
-> Show a message again

$ point hint clear
-> Hide and clear a message

$ point cursor data:image/png;base64,<base64-encoded-image-data> 20width(opt) 10height(opt)
-> Change the cursor image

$ point cursor default
-> Change the cursor image to default cursor (normal pointer image)

$ point cursor pointer
-> Change the cursor image to pointer cursor (an image of a hand)

$ point cursor text
-> Change the cursor image to the shape of an I-beam.

$ point cursor none
-> No cursor is rendered

$ point getelement
-> Get an Element object at the current pointed position
  e.g.,
  $ ${el} = point getelement
  $ ${el}.innerHTML = "abc"
  $ ${el}.style.color = "#f00"

$ point getprop propertyName
-> Get property value of the element at the current pointed position

$ point setprop propertyName value
-> Set property value of the element at the current pointed position

$ point verify propertyName operand value
-> Verify a property value of the element at the current pointed position
  e.g.,
  $ point verify value == "123"
  [OK] Got="123" == Exp="123"
  [NG] Got="456" == Exp="123"

  $ point verify value == "123"
  $ point verify value != "123"
  $ point verify value < "123"
  $ point verify value <= "123"
  $ point verify value > "123"
  $ point verify value >= "123"
  $ point verify value regexp \d.*\sabc

$point ch 1
-> Switch the pointer channel. (Default ch is 0)

$ point init
-> Hide pointer, clear message, point x=0, y=0.

$ point init -a
-> Initialize all pointer channel.
prop property-name Displays a property value of the debugger.
props Displays debugger property list.
random arg1: type(opt)
arg2: min(opt)
arg3: max(opt)
Get random number / string.
type: -n number (default)
      -s string

min: minimum number / length
max: maximum number / length

$ random
-> 0-2147483647

$ random 4
-> 0-4

$ random 1 4
-> 1-4

$ random 4d
-> "0000"-"9999"

$ random -s
-> Random string with 1-10 characters

$ random -s 4
-> Random string with four characters

$ random -s 1 4
-> Random string with 1-4 characters

$ random -s 1 4 -tbl "ABCDEFG0123456789!@?"
-> Random string with 1-4 characters using the characters in the -tbl option
resume -key key(opt) Resume a batch process which suspended by "pause -c" command.
-key option resumes the batch process corresponding to the same key by "pause -key" command.
rgb RGB Color Value Convert RGB color values between HEX and DEC.
$ rgb #fff
-> 255 255 255

$ rgb 255 255 255
-> #fff
rot 5|13|18|47
N
string
Replaces a letter with ROT5, ROT13, ROT18(ROT13.5), ROT47.

-n Number of shift(opt)

$ rot 5 123
-> 678

$ rot 13 abc
-> nop

$ rot 18 123ABCabc
-> 678NOPnop

$ rot 47 !"#123@ABC_abc~
-> PQR`abopqr0234O

$ rot 13 -n 1 abc
-> bcd

$ rot 13 -n (-1) abc
-> zab
scrollto arg1: target
arg2: position x|selector
arg3: position y
arg4: options
Set scroll position

target = window:
-> scroll window
x: [+|-]px|<selector>|left|center|right|current
y: [+|-]px|top|middle|bottom|current

w/ "+" / "-" : the offset in pixels.
w/o "+" / "-" : absolute position in pixels.

$ scrollto window +0 bottom
$ scrollto 100 5000
-> Gradually adjust the position (use scrollstep/scrollspeed properties)

$ scrollto window 100 5000 -speed 20 -step 10
-> Gradually adjust the position (x=100, y=5000) by 10px every 20ms.

$ scrollto window 100 5000 -speed 0 -step 0
-> Scroll to the specified position directly

$ scrollto window #id -adjX 0(opt:px) -adjY (-100)(opt:px)
$ scrollto window .className 0(opt:index) -adjX 0(opt:px) -adjY (-100)(opt:px)
$ scrollto window tagName 0(opt:index) -adjX 0(opt:px) -adjY (-100)(opt:px)
-> Scroll to the specified selector

target = log:
-> scrollto log window
position: top|px|bottom
select arg1: selectors
arg2: "value"
Select an option of select element / get value or option label text

e.g.,
$ select #id set value "1"
$ select select:nth-child(1) set text "abc"

$ select #id get text
$ select #id get value

$ select #id get texts
$ select #id get values
set arg1: property-name
arg2: value
Set a property value of the debugger.
See also "props" command.
setattr arg1: selector
arg2: index(opt)
arg3: property-name
arg4: value
Sets the value of an attribute on the specified element.

e.g.,
$ setattr #id disabled true
$ setattr .className 1 disabled true
sha arg1: algorithm
arg2: input
Calculates and displays hash value.
* jsSHA is required.

e.g.,
$ sha 256 "abc"
> ba7816bf8f01cfea414140de5dae2223b00361a396177a9cb410ff61f20015ad
sleep millis Causes the currently executing thread to sleep
stack function name Inject print stack trace code (dbg.stack()) into a given function.
This command is not applicable for native function.

$ stack func1
stopwatch arg1: target(opt)
arg2: operation
Manipulate the stopwatch.

target:
  0: Mini stopwatch on the upper right of the debug window
  1: Timer on the TOOL window

operation:
  start
  stop
  reset
  split
  end
  t0
  time
  value

e.g.,
$ stopwatch start
$ stopwatch stop
$ stopwatch t0 20210613T1200
$ stopwatch value 5000

$ stopwatch 1 start
$ stopwatch 1 split
$ stopwatch 1 stop
$ stopwatch 1 t0 20210613T1200
$ stopwatch 1 value 5000

strp arg1: pattern table
arg2: index or string
String permutation

Get the string pattern from the index
$ strp "ABC" 2
-> B
$ strp "ABC" 4
-> AA

Get the index of the pattern
$ strp "ABC" "B"
-> 2
$ strp "ABC" "AA"
-> 4

Count total patterns
$ strp -total "ABC" 1
-> 3
$ strp -total "ABC" 2
-> 12


$ strp "ABC" 1 5
->
A
B
C
AA
AB
sw Launch the stopwatch in the full-screen mode.

$ quit
to close the stopwatch.
test arg1: operation type
arg2: verify target value
arg3: verify method
arg4: verify expected value
Manage unit test.

[operation type]
init: Reset the test results. ($ test init -name "TestName"(opt))
set: Set Test ID / Label / Description / Comment / Result ($ test set id|label|desc|comment|result "STRING")
verify: Evaluate a value
count: Displays the test count.
result: Displays the test result.
last: Last result of test/point verify command. (OK / NG / ERR / NT)
status: Displays the total test result. (OK / NG / ERR / NT)
end: Finalize the test execution. (The running status will be set to false and finished time will be set)

$ test init -name "TestName"

$ test set desc "Description"

$ test set id "Test01"
$ test set id "Test-%SEQ%""%SEQ%" will be replaced by auto sequential number. ("Test-%SEQ%" -> "Test-1")

$ test set comment "Comment"

$ test verify a == 1

$ test verify -label "text" b == 2

$ test set result OK -label "result1" -info "ok test"
$ test set result NG -label "result2" -info "ng test"
$ test set result ERR -label "result3" -info "err test"
$ test set result NT -label "result4" -info "nt test"

$ test set seq 10 Explicitly set number for "%SEQ%".

$ test end
$ test result

[Result Output Example]
Test Result:
[TEST NAME]
TestName

[DESCRIPTION]
Description

[RESULTS]
---------
[ERR] Test01
 # Comment
         [NG] Got=[object Object] == Exp=1
 text    [NG] Got=1,2,3 == Exp=2
 result1 [OK] ok test
 result2 [NG] ng test
 result3 [ERR] err test
 result4 [NT] nt test

[SUMMARY]
OK:0/1 NG:0 ERR:1 NT:0 (OK:1/6 NG:3 ERR:1 NT:1)
-----
[ERR]
text arg1: text
arg2: selector
arg3: "data"
arg4: options
Set text value into an element.
$ text #text1 "abc 123" -speed 100(opt)
$ text #text1 "abc 123" -speed 100-200(opt)
$ text #text1 "abc 123" -speed 100(opt) -start 1(opt) -end 3(opt)
$ text #text1 "abc 123" -speed 100(opt) -start 2(opt) -end 3(opt)
$ text #text1 "abc 123" -step 2(opt)
  speed: input speed in millis(default=30 / 50-500=50ms to 500ms in random)
  step : number of characters to set at a time (default=1)
  start: animation sequence start position
  end  : animation sequence end position
textedit arg1: oeration
arg2: value
Manipulate text editor
$ textedit get
-> Get text

$ textedit set "Text"
-> Set text

$ textedit clear
-> Clear text

$ textedit mode 1
-> Switch edit mode

$ textedit setoptval 0 "abc"
-> Set option value (Set "abc" to the first option)

$ textedit exec
-> Execute edit
time ms|time-string String <--> millis

$ time 1d2h3m4s567
-> 1d 2h 3m 4s 567 (93784567 ms)

$ time 1d 2h 3m 4s 567
-> 1d 2h 3m 4s 567 (93784567 ms)

$ time 26:03:04.567
-> 1d 2h 3m 4s 567 (93784567 ms)

$ time 93784567
-> 1d 2h 3m 4s 567 (93784567 ms)

$ time 93784.567
-> 1d 2h 3m 4s 567 (93784567 ms)
timediff ms|time-string Time duration calculator.

$ timediff 1 3
-> 00:00:00.002

$ timediff 1000 3000
-> 00:00:02.000

$ timediff 1.0 3.0
-> 00:00:02.000

$ timediff 09:00:00 10:05:30
-> 01:05:30.000

$ timediff "2019-02-09 12:00:00.000" "2019-02-10 13:02:03.456"
-> 1d 01:02:03.456

$ timediff "20190209T120000.000" "20190210T130203.456"
-> 1d 01:02:03.456

$ timediff "2020-01-01 00:00:00.000" now
$ timediff now "2100-01-01 00:00:00.000"
-> Xd HH:MI:SS.sss
uc string To upper case
$ uc abc
-> ABC
unalias name(s) Remove each NAME from the list of defined aliases
$ unalias name [name ...]
unicode arg1: operation
arg2: string
Displays Unicode escape sequences from text string / Decodes Unicode string from code point(s).
operation: -e encode(default option)
           -d decode

$ unicode -e "ABC"
-> \u0041\u0042\u0043

$ unicode -d 41 42 43
-> ABC
uri arg1: operation
arg2: string
Encodes / decodes a URI component.
operation: -e encode(default option)
           -d decode

$ uri -e abc:def
-> abc%3Adef

$ uri -d abc%3Adef
-> abc:def
utf8 string Dump UTF-8 byte sequence.
v Displays version info.
vals Displays variable list.
option:
 -c: Clear user variables
watchdog arg1: start / stop
arg2: timeout (ms)(opt)
Start/Stop Watchdog timer
The default timeout value is 500ms.
win size Set the debugger window size/pos.

size:
  normal: default size
  center: 960 x 640 px
  full: full screen
  expand: depends on the current size
  restore: restore the original size
  reset: reset to initial size and position
xlscol ref Excel column number <--> reference

$ xlscol A
-> 1

$ xlscol 1
-> A

$ xlscol A + 1
-> B

$ xlscol B - 1
-> A

$ xlscol A B
-> 2 (cells)

$ xlscol A:C
->
A
B
C
xlsdate days|YYYY/MM/DD Serial number <--> Date text

$ xlsdate 1
-> 1900/01/01

$ xlsdate 1900/01/01
-> 1

$ xlsdate 44633
-> 2022/03/13

$ xlsdate 2022/03/13
-> 44633
xlstime time|hh:mm:ss.000 Serial number <--> Time text

$ xlstime 0.5
-> 12:00:00.000

$ xlstime 12:00
-> 0.5

$ xlstime 0.05816756944444444
-> 01:23:45.678

$ xlstime 01:23:45.678
-> 0.05816756944444444
zoom ratio Zoom the debugger window.

$ zoom 1.4
$ zoom 1

// Calculation / Conversion
The debugger can perform the following calculation/conversion on the command-line.
Calculation Input Description
Radix conversion decimal number
hexadecimal number
binary number
Convert DEC / HEX / BIN to other radix base number.
$ 128
->
HEX 0x80
DEC 128
OCT 0200
BIN 0000 0000 0000 0000 0000 0000 1000 0000 (8 bits)

$ 0x20
->
HEX 0x20
DEC 32
OCT 040
BIN 0000 0000 0000 0000 0000 0000 0010 0000 (6 bits)

$ 0b1010
->
HEX A
DEC 10
OCT 012
BIN 0000 0000 0000 0000 0000 0000 0000 1010 (4 bits)
This is an alias of int command.
bit bit position (LSB=1) Displays the value of the given number of bit.

$ 8bit
->
HEX 0x80
DEC 128
OCT 0200
BIN 0000 0000 0000 0000 0000 0000 1000 0000 (8 bits)
bits number of bits Displays the maximum value of the given number of bits.

$ 8bits
->
HEX 0xFF
DEC 255
OCT 0377
BIN 0000 0000 0000 0000 0000 0000 1111 1111 (8 bits)
Number format decimal number
$ 123456789012345678901234 4
-> 1234垓5678京9012兆3456億7890万1234

$ 1京1234兆5678億9012万3456
-> 11234567890123456

$ 12345678 3
-> 12,345,678

$ 12,345,678 0
-> 12345678

$ 123456789 m
$ 123456789 milli
-> 1.234

$ 1234 u
$ 1234 micro
-> 0.001 234

$ 1234 n
$ 1234 nano
-> 0.000 001 234

The following metric prefixes are also available.

p
pico

f
femto

a
atto

z
zepto

y
yocto

$ 0.123456789012345678901234567890 3
->
0.123 456 789 012 345 678 901 234 567 890
  m   u   n   p   f   a   z   y
Time calculation HH:MI:SS.sss + HH:MI:SS.sss [+]

HH:MI:SS.sss - HH:MI:SS.sss [-]
Perform a time calculation.
$ 00:05:30.700 + 00:01:20.123
-> 00:06:50.823

$ 00:05:30.700 - 00:05:20.400
-> 00:00:10.300

$ 10:00 + 16:00
-> 26:00:00.000

$ 10:00 + 16:00 d
-> 02:00:00.000 (+1 Day)

$ 10:00 - 16:00
-> -06:00:00.000

$ 10:00 - 16:00 d
-> 18:00:00.000 (-1 Day)

$ 01:30 * 2
-> 03:00:00.000

$ 03:00 / 2
-> 01:30:00.000
Date calculation YYYY/MM/DD +|- days Perform a date calculation.

$ 2018/01/01 + 2
$ 2018-01-01 + 2
$ 20180101 + 2
-> 2018/01/03

$ 2018/01/01 - 2
$ 2018-01-01 - 2
$ 20180101 - 2
-> 2017/12/30

$ today + 2
$ today - 2
Date diff YYYY/MM/DD YYYY/MM/DD
$ 2018/01/01 2018/01/03
$ 2018-01-01 2018-01-03
$ 20180101 20180103
-> 2

$ 2018/01/01 2017/12/30
-> -2

$ today 2018/04/10
Date-Time date-time
$ 2018/06/20 12:34:56.123
$ 2018-06-20 12:34:56.123
$ 20180620T123456.123
-> 2018-06-20 12:34:56.123 +09:00 WED (1529465696123)

$ 2018/06/20 12:34:56.123 -0700
$ 2018-06-20 12:34:56.123 -0700
$ 20180620T123456.123 -0700
-> 2018-06-20 12:34:56.123 -07:00 WED (1529523296123)

This is an alias of date command.
Date-Time
(UTC based)
utc[+|-][offset]
$ utc
-> 2020-08-17 00:15:00.123 +00:00 MON

$ utc-8
-> 2020-08-16 16:15:00.123 -08:00 SUN

$ utc+0530
-> 2020-08-17 05:45:30.123 +05:30 MON

$ utc+9
-> 2020-08-17 09:15:00.123 +09:00 MON
To milli seconds time
$ 12:00:01
-> 12h 0m 1s (43201000 ms)

$ 01:00
-> 1h 0m 0s (3600000 ms)

$ 00:00:01.234
-> 1s 234 (1234 ms)

This is an alias of time command.
Unicode U+nnnn ... Displays the character(s) of the code point which specified by the argument.
$ U+0041
-> A

$ U+6F22 U+5B57
-> 漢字
This is an alias of unicode command.
Ratio formula
$ x:1080=16:9
-> x=1920

$ 1920:x=16:9
-> x=1080

$ 1920:1080=x:9
-> x=16

$ 1920:1080=16:x
-> x=9

$ 1920:1080=
-> 16:9
Permutation nPr
$ 6p3
-> 120
Combination nCr
$ 4c2
-> 6
Multi Choose nHr
$ 12h4
-> 1365

// BAT Script Execution
BAT script is an original script language in debug.js.
It consists of a series of commands to be executed by the command-line interpreter.
You can write any commands of the library and JavaScript statements.

How to execute
From the menu on the upper of the debugger window,
TOOL => <BAT> => Write a BAT script => [ RUN ]
Sample Script (for Auto-testing of this page)
You can load a script by drag a script file (plain text file) and drop to log window.

Batch File Format
#!BAT! File Header

#comment

//comment

/*
multi-line-comment
*/

!__TEXT__!
plain text
plain text
plain text
!__TEXT__!
This is also comment section.
The difference from other comment section is the content will be set to the variable ${%TEXT%}.

${val} = command Command result will be set to the variable ${val}.

%{val} inline expansion of the value

IF (${val} == 1) (
  command
) ELSE IF (${val} == 2) (
  command
) ELSE (
  command
)

${i} = 0
LOOP (${i} < 3) (
  command
  ${i}++
)

LOOP (
  command
  IF (xxx) (
    BREAK
  )
  IF (xxx) (
    CONTINUE
  )
)

!__JS__! Inline JavaScript Section
JavaScript Code;
JavaScript Code;
JavaScript Code;
!__JS__! This section will be executed at once.

!__JS__! pure JavaScript section w/o variable substitution (${val})
JavaScript Code;
JavaScript Code;
JavaScript Code;
!__JS__!

:label
goto label

call func1 ${val}(argument is optional)
${val} = ${%RET%}

FUNCTION func1
  ${val} = ${%ARG%}
  command
  ${ret} = command
  return ${ret}(return value is optional)


Batch dedicated commands
Name Arguments Description
call arg1: funcname
arg2: argument(opt)
Call a function.

call funcname
call funcname argument
exit exit status Terminate the execution of the batch script
When a program exits, it can return to the parent program a small amount of information about the cause of termination, using the exit status.
Normally the exit status 0 indicates successful program completion.
Other value indicates unsuccessful program completion.
You can access the exit status via special variable ${?}

bat exec IyFCQVQhDQpleGl0IDENCg==(*1)
echo "Exit Status = " + ${?}
IF (${?} == 0)) (
  echo "OK!"
) ELSE (
  echo "ERROR!"
)

(*1)
#!BAT!
exit 1
goto label Jump to the label

:label1
goto label1
jump arg1: label
arg2: argument(opt)
Jump to the label with link.
Copy the address of the next instruction into link variable in the BAT control data.

jump label
jump label argument
nop No operation (The same behavior as press enter key without command input)
return return value(opt) Return to the link which is saved by call/jump instruction.

return
return value
wait millis
or target time
Wait the specified milli seconds.

wait
wait 1000
wait 20180614T123045
wait T1230
wait T0000|T1200
wait T**30
wait 1d2h3m4s500
wait 1.5s

Command Environment Variables
Variable Description
${?} Exit status of BAT execution
${%%ARG%%} BAT execution argument string
${%ARG%} Argument string of call/jump instruction
${%RET%} Return value which is set by return instruction
${%LABEL%} Current executing label name
${%FUNCNAME%} Current executing function name
${%RESUMED_KEY%} Last key value of resume command
${%TEST_TOTAL_RESULT%} Total test result
${%TEST_LAST_RESULT%} Last result of test/point verify command
${%TEXT%} Text content written in !__TEXT__! section

BAT related system properties
Property Description
batcont Continue flag.
The batch script will be continued after page unload/load.
$ set batcont on
$ set batcont off
batstop Error stop trigger.
The batch script will be stopped when an error occurred (when log.e() was called) or test verify command result was failed.
$ set batstop none
$ set batstop error
$ set batstop test
$ set batstop error|test

// Features
Button Description
Screen Measure
SYS Show system info
DOM DOM Element Inspector
JS JavaScript Editor/Executor
TOOL Tools
- Timer
- Text Font Checker
- HTML Previewer
- File Viewer
- BAT Editor/Controller
0 Reset stopwatch
>> Start stopwatch
|| Stop stopwatch
* Preserve log
/ Suspend log output
P Fix the window in its position
C Copy log text
= Show/Hide header info
Restore initial window size and position
Expand the window and adjust to center position
× Close the window

// Options
If you want to change the debugger settings, explicitly call for initialization function in advance.
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <script src="debug.js"></script>
  <script>
    var options = {
      visible: true,
      zoom: 1.4,
      position: 'ne'
    };
    dbg.init(options);  

    function foo() {
      log('button was clicked');
    }
    ...
Name Description Default
visible Default visible status false
keyAssign Key code for the debug window show/hide control
show: {
  key: KeyCode,
  shift: undefined(not care) / true / false
  ctrl: undefined(not care) / true / false,
  alt: undefined(not care) / true / false,
  meta: undefined(not care) / true / false
}
{
  key: 113,(F2)
  shift: undefined
  ctrl: undefined,
  alt: undefined,
  meta: undefined
}
focusOnShow If true, the command-line will be given focus when the debug window is shown. true
autoPopup Popup the debug window when the following error occurs

scriptError: a JavaScript runtime error
loadError: .css / .js file load error
error: log.e() has been called
fatal: log.f() has been called

{
  scriptError: true,
  loadError: true,
  error: true
  fatal: true
}
lines Number of lines to display 20
bufsize Log buffer size (lines) 300
width Debug window size (px) 602
zoom Zoom ratio 1
position Default window position
'n' = top | center
'ne' = top | right
'e' = middle | right
'se' = bottom | right
's' = bottom | center
'sw' = bottom | left
'w' = middle | left
'nw' = top | center
'c' = middle | center
'se'
adjX Debug window position x-adjustment (px) 20
adjY Debug window position y-adjustment (px) 20
fontSize Log message font size (px) 12
fontFamily Font family 'Consolas, Monaco, Menlo, monospace, sans-serif'
fontColor General font color '#fff'
logColorV Verbose log color '#99bcc8'
logColorD Debug log color '#ccc'
logColorI Information log color '#9de'
logColorW Warning log color '#ee4'
logColorE Error log color '#d9a'
logColorF Fatal log color '#ea4'
logColorS System log color '#fff'
clockColor Clock color '#8f0'
timerColor Timer color '#9ef'
sysInfoColor System info color (window / mouse / key status, etc.) '#ddd'
btnColor Button color ([CLR], >>, etc.) '#6cf'
btnHoverColor Button color for onMouseOver '#8ef'
promptColor Color code for command prompt "$" and ">" at the head of result log '#0cf'
promptColorE Color code for ">" at the head of error result log '#f45'
background Background style 'linear-gradient(150deg, rgba(0,0,0,0.8),rgba(0,0,0,0.5))'
border Debug window border style 'solid 1px #888'
borderRadius Rounded style for corners of the debug window '0'
opacity Transparency of the debug window '1'
showLineNums Show log line numbers true
showTimestamp Show log timestamp
0: None
1: Time only
2: Date and Time
1
resizable Debug window resizable true
togglableShowHide Togglable Show / Hide (Show × button) true
useClock Show clock true
useClearButton Show [CLR] button true
useSuspendLogButton Show / button true
usePinButton Show P button true
useWinCtrlButton Show - □ button true
useStopwatch Enable stopwatch function true
useDeviceInfo Show window size / mouse status / key status true
useLed Show 8bit indicator ( ) true
useMsgDisplay Enable Fixed Position Message Display true
msgDisplayBackground Background style of the fixed position message 'rgba(0,0,0,0.2)'
useScreenMeasure Enable Screen Measure true
useSystemInfo Enable System Info indication true
useElementInfo Enable DOM Element inspection true
useJsEditor Enable JavaScript Editor true
useTools Enable tools true
useLogFilter Enable Log Filter true
useCommandLine Enable command-line true
saveCmdHistory Save command-line history to Window.localStorage true
cmdHistoryMax Max num of command-line history 100
timerLineColor Line color of the timer / clock feature '#0cf'
disableAllCommands Disable all internal function commands false
disableAllFeatures Disable all features except log featureoverridable false
mode "kiosk" : Make the debugger window go full screen
"noui" : No debugger window, log buffering only
other : Normal debug window
''
lockCode Lock code string.
Run into protected mode and unlock with this code.
The debug window will not appear until unlocked.
Unlock: [ESC] -> [Ctrl] -> lockCode -> [Ctrl]
null
elmId Debug window element id
(The window is automatically generated in case of null)
null

// Extension
You can define your own commands and panels like below.

Extension Command
// Command definition
example.cmdHello = function(arg, tbl) {
  log('Hello, world!!');
};

// Command table definition
example.CMD_TBL = [
  {cmd: 'hello', fn: example.cmdHello, desc: 'extension command example'}
];

// Register the command table
dbg.x.addCmdTbl(example.CMD_TBL);
$ hello
-> Hello, world!

Extension Panel
// Called when the panel is first created.
// This is where you should do all of your normal static set up:
// create views, initialize data, etc.
// The argument panel is the base DOM element of the extension panel.
example.onCreate = function(panel) {
  
};

// Called when the panel is displayed.
example.onActive = function(panel) {
  
};

// Called when the panel is hidden.
example.onInActive = function(panel) {
  
};

// Called when a file/text is fropped.
example.onDrop = function(text) {
  
};

var panel1 = {
  name: '',
  onCreate: example.onCreate,
  onActive: example.onActive,
  onInActive: example.onInActive,
  onDrop: example.onDrop, // optional. See dbg.addDropHandler()
  fileloader: { // optional
    cb: example.onFileLoaded,
    mode: 'b64',
    decode: true
  }
};
var index = dbg.x.pnl.add(panel1);
Switch panels
dbg.x.pnl.switchPanel('');(by name)
Show / Hide
dbg.x.pnl.setHidden('', );
Remove a panel
dbg.x.pnl.remove('');(by name)
Get a panel
dbg.x.pnl.getPanel('');(by name)

dbg.x.pnl.getActivePanel();

Panel object structure:
{
  name: Panel Name String,
  onCreate: function(),
  onActive: function(),
  onInActive: function(),
  onDrop: function(),
  fileloader: Loader Definition,
  panel: Base DIV element
}
is Active
dbg.x.pnl.isActive('');
Exists
dbg.x.pnl.exists('');
Get the panel length
dbg.x.pnl.len();(visible only)
dbg.x.pnl.len(true);(all)
Append UI parts
dbg.ui.addElement(parentElement, 'TagName', style);
dbg.ui.addBtn(parentElement, 'LabelText', onclickfunction);
dbg.ui.addLabel(parentElement, 'LabelText', style);
dbg.ui.addTextInput(parentElement, width'50px', txtAlign'right'|'center'|'left', color'#fff', valdefault value, oninputfunction);

style:
e.g.,
style = {
  'width': '50px',
  'margin-top': '8px',
  'color': '#fff'
};
Change the button label
dbg.x.pnl.setBtnLabel('');
Please refer to extension-sample/debug-x-cmd.js and extension-sample/debug-x-panel.js for details.

// Lazy Load
Execute the following code from F12 console.
Note that it depends on Content-Security-Policy header.

for iframe
from Base64 encoded script

for iframe
// Browser Support
Browser Version
Chrome Current
Edge Current
Firefox Current
Internet Explorer 11 (partially 9+)
Opera Current
// DEMO
log
log() log.d() log.i() ...
log with random message
dbg.led

console
You can switch the console.log() output between native function and debug.js's log() function as follows.
$ set consolelog native(default)
$ set consolelog me
console.time('timer3');
console.timeEnd('timer3');

Problematic Behavior
fakeError;

One-line JSON Sample for "json" command
Execute a command from the command line like below.
$ json {"foo": "abc", "bar": 1}
{"name": "John Smith", "age": 25, "city": "New York"}
{"firstName":"John","lastName":"Smith","isAlive":true,"age":25,"address":{"streetAddress":"21 2nd Street","city": "New York","state":"NY","postalCode":"10021-3100"},"phoneNumbers":[{"type":"home","number":"212 555-1234"},{"type":"office","number":"646 555-4567"},{"type":"mobile","number":"123 456-7890"}],"children":[],"spouse":null}

// AUTOMATED TESTING DEMO
With a pseudo mouse pointer, the library can perform automated web page manipulation!
<Sample Script>

From the menu on the upper of the debugger window,
TOOL => <BAT> => Copy & Paste the above script => [ RUN ]
See also: // BAT Execution section.
text1
text2
pass


tabindex=1
tabindex=2
tabindex=3
sp chr
sp chr
sp chr
email
number
search
tel
url
checkbox1
checkbox2
radio1 r1 r2 r3 (w/o label)
radio2 (w/ label)
file
data-attribute
DIV
123
456
789
#div1

#table1
th1th2th3
td1(span1)(span2)td2td3
td4td5td6
td7td8td9
td10td11td12
.class1 .class1 .class2 .class1
#event1 (event test)
#box1
#box2
Link1  Link2 Link3 
a-div
File Loader b64
File Loader b64 decoded
File Loader Bin
Drop Area