mirror of
https://github.com/node-red/node-red.git
synced 2023-10-10 13:36:53 +02:00
Make inbuilt debug messages navigable
This commit is contained in:
parent
c9f4813ce1
commit
7607c4c882
@ -2405,7 +2405,6 @@ RED.view = (function() {
|
|||||||
node.highlighted = true;
|
node.highlighted = true;
|
||||||
node.dirty = true;
|
node.dirty = true;
|
||||||
RED.workspaces.show(node.z);
|
RED.workspaces.show(node.z);
|
||||||
RED.view.redraw();
|
|
||||||
|
|
||||||
var screenSize = [$("#chart").width(),$("#chart").height()];
|
var screenSize = [$("#chart").width(),$("#chart").height()];
|
||||||
var scrollPos = [$("#chart").scrollLeft(),$("#chart").scrollTop()];
|
var scrollPos = [$("#chart").scrollLeft(),$("#chart").scrollTop()];
|
||||||
@ -2419,17 +2418,22 @@ RED.view = (function() {
|
|||||||
},200);
|
},200);
|
||||||
}
|
}
|
||||||
|
|
||||||
var flash = 22;
|
if (!node._flashing) {
|
||||||
var flashFunc = function() {
|
node._flashing = true;
|
||||||
flash--;
|
var flash = 22;
|
||||||
node.highlighted = !node.highlighted;
|
var flashFunc = function() {
|
||||||
node.dirty = true;
|
flash--;
|
||||||
RED.view.redraw();
|
node.highlighted = !node.highlighted;
|
||||||
if (flash >= 0) {
|
node.dirty = true;
|
||||||
setTimeout(flashFunc,100);
|
RED.view.redraw();
|
||||||
|
if (flash >= 0) {
|
||||||
|
setTimeout(flashFunc,100);
|
||||||
|
} else {
|
||||||
|
delete node._flashing;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
flashFunc();
|
||||||
}
|
}
|
||||||
flashFunc();
|
|
||||||
} else if (node._def.category === 'config') {
|
} else if (node._def.category === 'config') {
|
||||||
RED.sidebar.config.show(id);
|
RED.sidebar.config.show(id);
|
||||||
}
|
}
|
||||||
|
@ -44,7 +44,6 @@
|
|||||||
<p>Optionally can show the complete <code>msg</code> object, and send messages to the console log.</p>
|
<p>Optionally can show the complete <code>msg</code> object, and send messages to the console log.</p>
|
||||||
<p>In addition any calls to node.warn or node.error will appear here.</p>
|
<p>In addition any calls to node.warn or node.error will appear here.</p>
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
(function() {
|
(function() {
|
||||||
var subWindow = null;
|
var subWindow = null;
|
||||||
@ -175,14 +174,12 @@
|
|||||||
}
|
}
|
||||||
RED.view.redraw();
|
RED.view.redraw();
|
||||||
};
|
};
|
||||||
msg.onclick = function() {
|
$(msg).click(function() {
|
||||||
var node = RED.nodes.node(o.id) || RED.nodes.node(o.z);
|
var node = RED.nodes.node(o.id) || RED.nodes.node(o.z);
|
||||||
if (node) {
|
if (node) {
|
||||||
RED.view.reveal(node.id);
|
RED.view.reveal(node.id);
|
||||||
}
|
}
|
||||||
|
});
|
||||||
};
|
|
||||||
//console.log(o);
|
|
||||||
var name = sanitize(((o.name?o.name:o.id)||"").toString());
|
var name = sanitize(((o.name?o.name:o.id)||"").toString());
|
||||||
var topic = sanitize((o.topic||"").toString());
|
var topic = sanitize((o.topic||"").toString());
|
||||||
var property = sanitize(o.property?o.property:'');
|
var property = sanitize(o.property?o.property:'');
|
||||||
@ -212,7 +209,21 @@
|
|||||||
|
|
||||||
'</span>';
|
'</span>';
|
||||||
}
|
}
|
||||||
msg.innerHTML += '<span class="debug-message-payload">'+ payload+ '</span>';
|
if (format === 'Object' || /^array/.test(format) || format === 'boolean' || format === 'number' ) {
|
||||||
|
payload = JSON.parse(payload);
|
||||||
|
} else if (format === 'null') {
|
||||||
|
payload = null;
|
||||||
|
} else if (format === 'undefined') {
|
||||||
|
payload = undefined;
|
||||||
|
} else if (/^buffer/.test(format)) {
|
||||||
|
var buffer = payload;
|
||||||
|
payload = [];
|
||||||
|
for (var c = 0; c < buffer.length; c += 2) {
|
||||||
|
payload.push(parseInt(buffer.substr(c, 2), 16));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
var el = $('<span class="debug-message-payload"></span>').appendTo(msg);
|
||||||
|
RED.debug.buildMessageElement(payload,true).appendTo(el);
|
||||||
var atBottom = (sbc.scrollHeight-messages.height()-sbc.scrollTop) < 5;
|
var atBottom = (sbc.scrollHeight-messages.height()-sbc.scrollTop) < 5;
|
||||||
messageCount++;
|
messageCount++;
|
||||||
messages.append(msg);
|
messages.append(msg);
|
||||||
@ -297,5 +308,5 @@
|
|||||||
});
|
});
|
||||||
})();
|
})();
|
||||||
</script>
|
</script>
|
||||||
|
<script src="debug/view/debug-utils.js"></script>
|
||||||
<link rel="stylesheet" href="debug/view/style.css">
|
<link rel="stylesheet" href="debug/view/style.css">
|
||||||
|
@ -82,6 +82,9 @@ module.exports = function(RED) {
|
|||||||
} else if (msg.msg instanceof Buffer) {
|
} else if (msg.msg instanceof Buffer) {
|
||||||
msg.format = "buffer ["+msg.msg.length+"]";
|
msg.format = "buffer ["+msg.msg.length+"]";
|
||||||
msg.msg = msg.msg.toString('hex');
|
msg.msg = msg.msg.toString('hex');
|
||||||
|
if (msg.msg.length > debuglength) {
|
||||||
|
msg.msg = msg.msg.substring(0,debuglength);
|
||||||
|
}
|
||||||
} else if (msg.msg && typeof msg.msg === 'object') {
|
} else if (msg.msg && typeof msg.msg === 'object') {
|
||||||
var seen = [];
|
var seen = [];
|
||||||
try {
|
try {
|
||||||
@ -95,6 +98,12 @@ module.exports = function(RED) {
|
|||||||
}
|
}
|
||||||
if (isArray || (msg.format === "Object")) {
|
if (isArray || (msg.format === "Object")) {
|
||||||
msg.msg = JSON.stringify(msg.msg, function(key, value) {
|
msg.msg = JSON.stringify(msg.msg, function(key, value) {
|
||||||
|
if (key[0] === '_' && key !== "_msgid") {
|
||||||
|
return undefined;
|
||||||
|
}
|
||||||
|
if (key === '_req' || key === '_res') {
|
||||||
|
return "[internal]"
|
||||||
|
}
|
||||||
if (typeof value === 'object' && value !== null) {
|
if (typeof value === 'object' && value !== null) {
|
||||||
if (seen.indexOf(value) !== -1) { return "[circular]"; }
|
if (seen.indexOf(value) !== -1) { return "[circular]"; }
|
||||||
seen.push(value);
|
seen.push(value);
|
||||||
@ -123,9 +132,9 @@ module.exports = function(RED) {
|
|||||||
msg.msg = msg.msg;
|
msg.msg = msg.msg;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (msg.msg.length > debuglength) {
|
// if (msg.msg.length > debuglength) {
|
||||||
msg.msg = msg.msg.substr(0,debuglength) +" ....";
|
// msg.msg = msg.msg.substr(0,debuglength) +" ....";
|
||||||
}
|
// }
|
||||||
RED.comms.publish("debug",msg);
|
RED.comms.publish("debug",msg);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
157
nodes/core/core/lib/debug/debug-utils.js
Normal file
157
nodes/core/core/lib/debug/debug-utils.js
Normal file
@ -0,0 +1,157 @@
|
|||||||
|
|
||||||
|
RED.debug = (function() {
|
||||||
|
function buildMessageElement(obj,topLevel) {
|
||||||
|
var i;
|
||||||
|
var e;
|
||||||
|
var entryObj;
|
||||||
|
var header;
|
||||||
|
var headerHead;
|
||||||
|
var value;
|
||||||
|
var element = $('<span class="debug-message-element"></span>').toggleClass('collapsed',topLevel);
|
||||||
|
if (Array.isArray(obj)) {
|
||||||
|
var length = Math.min(obj.length,10);
|
||||||
|
if (!topLevel) {
|
||||||
|
header = $('<span class="debug-message-type-meta"></span>').html('array['+obj.length+']').appendTo(element);
|
||||||
|
} else {
|
||||||
|
header = $('<span>').appendTo(element);
|
||||||
|
if (length > 0) {
|
||||||
|
$('<i class="fa fa-caret-right debug-message-object-handle"></i> ').prependTo(header);
|
||||||
|
header.addClass("debug-message-expandable");
|
||||||
|
header.click(function(e) {
|
||||||
|
$(this).parent().toggleClass('collapsed');
|
||||||
|
e.preventDefault();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
$('<span class="debug-message-type-meta debug-message-object-type-header"></span>').html('array['+obj.length+']').appendTo(header);
|
||||||
|
headerHead = $('<span class="debug-message-object-header"></span>').appendTo(header);
|
||||||
|
$('<span>[ </span>').appendTo(headerHead);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
for (i=0;i<length;i++) {
|
||||||
|
if (topLevel) {
|
||||||
|
value = obj[i];
|
||||||
|
if (Array.isArray(value)) {
|
||||||
|
$('<span class="debug-message-object-value debug-message-type-meta"></span>').html('array['+value.length+']').appendTo(headerHead);
|
||||||
|
} else if (value === null) {
|
||||||
|
$('<span class="debug-message-object-value debug-message-type-null">null</span>').appendTo(headerHead);
|
||||||
|
} else if (typeof value === 'object') {
|
||||||
|
$('<span class="debug-message-object-value debug-message-type-meta">object</span>').appendTo(headerHead);
|
||||||
|
} else if (typeof value === 'string') {
|
||||||
|
$('<span class="debug-message-object-value debug-message-type-string"></span>').text('"'+value+'"').appendTo(headerHead);
|
||||||
|
} else {
|
||||||
|
$('<span class="debug-message-object-value debug-message-type-other"></span>').text(""+value).appendTo(headerHead);
|
||||||
|
}
|
||||||
|
if (i < length -1) {
|
||||||
|
$('<span>, </span>').appendTo(headerHead);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
entryObj = $('<div class="debug-message-object-entry collapsed"></div>').appendTo(element);
|
||||||
|
header = $('<span></span>').appendTo(entryObj);
|
||||||
|
if (typeof obj[i] === 'object' && obj[i] !== null) {
|
||||||
|
$('<i class="fa fa-caret-right debug-message-object-handle"></i> ').appendTo(header);
|
||||||
|
header.addClass("debug-message-expandable");
|
||||||
|
header.click(function(e) {
|
||||||
|
$(this).parent().toggleClass('collapsed');
|
||||||
|
e.preventDefault();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
$('<span class="debug-message-object-key"></span>').text(i).appendTo(header);
|
||||||
|
$('<span>: </span>').appendTo(entryObj);
|
||||||
|
e = $('<span class="debug-message-object-value"></span>').appendTo(entryObj);
|
||||||
|
buildMessageElement(obj[i],false).appendTo(e);
|
||||||
|
}
|
||||||
|
if (length < obj.length) {
|
||||||
|
if (topLevel) {
|
||||||
|
$('<span> ...</span>').appendTo(headerHead);
|
||||||
|
}
|
||||||
|
$('<div class="debug-message-object-entry"><span class="debug-message-object-key">...</span></div>').appendTo(element);
|
||||||
|
}
|
||||||
|
if (topLevel) {
|
||||||
|
if (length === 0) {
|
||||||
|
$('<span class="debug-message-type-meta">empty</span>').appendTo(headerHead);
|
||||||
|
}
|
||||||
|
$('<span> ]</span>').appendTo(headerHead);
|
||||||
|
}
|
||||||
|
} else if (obj === null || obj === undefined) {
|
||||||
|
$('<span class="debug-message-object-value debug-message-type-null">'+obj+'</span>').appendTo(element);
|
||||||
|
} else if (typeof obj === 'object') {
|
||||||
|
var keys = Object.keys(obj);
|
||||||
|
if (topLevel) {
|
||||||
|
header = $('<span>').appendTo(element);
|
||||||
|
if (keys.length > 0) {
|
||||||
|
$('<i class="fa fa-caret-right debug-message-object-handle"></i> ').prependTo(header);
|
||||||
|
header.addClass("debug-message-expandable");
|
||||||
|
header.click(function(e) {
|
||||||
|
$(this).parent().toggleClass('collapsed');
|
||||||
|
e.preventDefault();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
header = $('<span class="debug-message-type-meta"></span>').html('object').appendTo(element);
|
||||||
|
}
|
||||||
|
if (topLevel) {
|
||||||
|
$('<span class="debug-message-type-meta debug-message-object-type-header"></span>').html('object').appendTo(header);
|
||||||
|
headerHead = $('<span class="debug-message-object-header"></span>').appendTo(header);
|
||||||
|
$('<span>{ </span>').appendTo(headerHead);
|
||||||
|
}
|
||||||
|
for (i=0;i<keys.length;i++) {
|
||||||
|
if (topLevel) {
|
||||||
|
if (i < 5) {
|
||||||
|
$('<span class="debug-message-object-key"></span>').text(keys[i]).appendTo(headerHead);
|
||||||
|
$('<span>: </span>').appendTo(headerHead);
|
||||||
|
value = obj[keys[i]];
|
||||||
|
if (Array.isArray(value)) {
|
||||||
|
$('<span class="debug-message-object-value debug-message-type-meta"></span>').html('array['+value.length+']').appendTo(headerHead);
|
||||||
|
} else if (value === null) {
|
||||||
|
$('<span class="debug-message-object-value debug-message-type-null">null</span>').appendTo(headerHead);
|
||||||
|
} else if (typeof value === 'object') {
|
||||||
|
$('<span class="debug-message-object-value debug-message-type-meta">object</span>').appendTo(headerHead);
|
||||||
|
} else if (typeof value === 'string') {
|
||||||
|
$('<span class="debug-message-object-value debug-message-type-string"></span>').text('"'+value+'"').appendTo(headerHead);
|
||||||
|
} else {
|
||||||
|
$('<span class="debug-message-object-value debug-message-type-other"></span>').text(""+value).appendTo(headerHead);
|
||||||
|
}
|
||||||
|
if (i < keys.length -1) {
|
||||||
|
$('<span>, </span>').appendTo(headerHead);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (i === 5) {
|
||||||
|
$('<span> ...</span>').appendTo(headerHead);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
entryObj = $('<div class="debug-message-object-entry collapsed"></div>').appendTo(element);
|
||||||
|
var entryHeader = $('<span></span>').appendTo(entryObj);
|
||||||
|
if (typeof obj[keys[i]] === 'object' && obj[keys[i]] !== null) {
|
||||||
|
$('<i class="fa fa-caret-right debug-message-object-handle"></i> ').appendTo(entryHeader);
|
||||||
|
entryHeader.addClass("debug-message-expandable");
|
||||||
|
entryHeader.click(function(e) {
|
||||||
|
$(this).parent().toggleClass('collapsed');
|
||||||
|
e.preventDefault();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
$('<span class="debug-message-object-key"></span>').text(keys[i]).appendTo(entryHeader);
|
||||||
|
$('<span>: </span>').appendTo(entryHeader);
|
||||||
|
e = $('<span class="debug-message-object-value"></span>').appendTo(entryObj);
|
||||||
|
buildMessageElement(obj[keys[i]],false).appendTo(e);
|
||||||
|
}
|
||||||
|
if (keys.length === 0) {
|
||||||
|
$('<div class="debug-message-object-entry debug-message-type-meta collapsed"></div>').text("empty").appendTo(element);
|
||||||
|
}
|
||||||
|
if (topLevel) {
|
||||||
|
if (keys.length === 0) {
|
||||||
|
$('<span class="debug-message-type-meta">empty</span>').appendTo(headerHead);
|
||||||
|
}
|
||||||
|
$('<span> }</span>').appendTo(headerHead);
|
||||||
|
}
|
||||||
|
} else if (typeof obj === 'string') {
|
||||||
|
$('<span class="debug-message-object-value debug-message-type-string"></span>').text('"'+obj+'"').appendTo(element);
|
||||||
|
} else {
|
||||||
|
$('<span class="debug-message-object-value debug-message-type-other"></span>').text(""+obj).appendTo(element);
|
||||||
|
}
|
||||||
|
return element;
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
buildMessageElement: buildMessageElement
|
||||||
|
}
|
||||||
|
})();
|
@ -89,67 +89,4 @@ $(function() {
|
|||||||
$("#debug-content").append(msg);
|
$("#debug-content").append(msg);
|
||||||
$("#debug-content").scrollTop($("#debug-content")[0].scrollHeight);
|
$("#debug-content").scrollTop($("#debug-content")[0].scrollHeight);
|
||||||
},false);
|
},false);
|
||||||
|
|
||||||
function buildMessageElement(obj,topLevel) {
|
|
||||||
var i;
|
|
||||||
var e;
|
|
||||||
var entryObj;
|
|
||||||
var header;
|
|
||||||
var element = $('<span class="debug-message-element"></span>').toggleClass('collapsed',topLevel);
|
|
||||||
if (Array.isArray(obj)) {
|
|
||||||
$('<span>').html('Array['+obj.length+']').appendTo(element);
|
|
||||||
var length = Math.min(obj.length,10);
|
|
||||||
for (i=0;i<length;i++) {
|
|
||||||
entryObj = $('<div class="debug-message-object-entry collapsed"></div>').appendTo(element);
|
|
||||||
header = $('<span></span>').appendTo(entryObj);
|
|
||||||
if (typeof obj[i] === 'object' && obj[i] !== null) {
|
|
||||||
$('<i class="fa fa-caret-right debug-message-object-handle"></i> ').appendTo(header);
|
|
||||||
header.addClass("debug-message-expandable");
|
|
||||||
header.click(function(e) {
|
|
||||||
$(this).parent().toggleClass('collapsed');
|
|
||||||
});
|
|
||||||
}
|
|
||||||
$('<span class="debug-message-object-key"></span>').text(i).appendTo(header);
|
|
||||||
$('<span>: </span>').appendTo(entryObj);
|
|
||||||
e = $('<span class="debug-message-object-value"></span>').appendTo(entryObj);
|
|
||||||
buildMessageElement(obj[i],false).appendTo(e);
|
|
||||||
}
|
|
||||||
if (length < obj.length) {
|
|
||||||
$('<div class="debug-message-object-entry"><span class="debug-message-object-key">...</span></div>').appendTo(element);
|
|
||||||
}
|
|
||||||
} else if (obj === null) {
|
|
||||||
$('<span class="debug-message-object-value debug-message-type-null">null</span>').appendTo(element);
|
|
||||||
} else if (typeof obj === 'object') {
|
|
||||||
|
|
||||||
header = $('<span>').html((topLevel?(JSON.stringify(obj,2).substring(0,200)):'Object')).appendTo(element);
|
|
||||||
if (topLevel) {
|
|
||||||
$('<i class="fa fa-caret-right debug-message-object-handle"></i> ').prependTo(header);
|
|
||||||
header.addClass("debug-message-expandable");
|
|
||||||
header.click(function(e) {
|
|
||||||
$(this).parent().toggleClass('collapsed');
|
|
||||||
});
|
|
||||||
}
|
|
||||||
var keys = Object.keys(obj);
|
|
||||||
for (i=0;i<keys.length;i++) {
|
|
||||||
entryObj = $('<div class="debug-message-object-entry collapsed"></div>').appendTo(element);
|
|
||||||
header = $('<span></span>').appendTo(entryObj);
|
|
||||||
if (typeof obj[keys[i]] === 'object' && obj[keys[i]] !== null) {
|
|
||||||
$('<i class="fa fa-caret-right debug-message-object-handle"></i> ').appendTo(header);
|
|
||||||
header.addClass("debug-message-expandable");
|
|
||||||
header.click(function(e) {
|
|
||||||
$(this).parent().toggleClass('collapsed');
|
|
||||||
});
|
|
||||||
}
|
|
||||||
$('<span class="debug-message-object-key"></span>').text(keys[i]).appendTo(header);
|
|
||||||
$('<span>: </span>').appendTo(header);
|
|
||||||
e = $('<span class="debug-message-object-value"></span>').appendTo(entryObj);
|
|
||||||
buildMessageElement(obj[keys[i]],false).appendTo(e);
|
|
||||||
}
|
|
||||||
} else if (typeof obj === 'string') {
|
|
||||||
$('<span class="debug-message-object-value debug-message-type-string"></span>').text('"'+obj+'"').appendTo(element);
|
|
||||||
} else {
|
|
||||||
$('<span class="debug-message-object-value debug-message-type-other"></span>').text(""+obj).appendTo(element);
|
|
||||||
}
|
|
||||||
return element;
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
|
@ -63,6 +63,9 @@
|
|||||||
}
|
}
|
||||||
.debug-message-element {
|
.debug-message-element {
|
||||||
color: #333;
|
color: #333;
|
||||||
|
font-family: Menlo, monospace;
|
||||||
|
font-size: 12px !important;
|
||||||
|
line-height: 1.3em;
|
||||||
}
|
}
|
||||||
.debug-message-object-key {
|
.debug-message-object-key {
|
||||||
color: #792e90;
|
color: #792e90;
|
||||||
@ -95,11 +98,26 @@
|
|||||||
.debug-message-element.collapsed .debug-message-object-entry {
|
.debug-message-element.collapsed .debug-message-object-entry {
|
||||||
display:none;
|
display:none;
|
||||||
}
|
}
|
||||||
|
.debug-message-element:not(.collapsed) .debug-message-object-header {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.debug-message-element.collapsed .debug-message-object-type-header {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
.debug-message-type-other { color: #2033d6; }
|
.debug-message-type-other { color: #2033d6; }
|
||||||
.debug-message-type-string { color: #b72828; }
|
.debug-message-type-string { color: #b72828; }
|
||||||
.debug-message-type-null { color: #666; font-style: italic;}
|
.debug-message-type-null { color: #666; font-style: italic;}
|
||||||
|
.debug-message-type-meta { color: #666; font-style: italic;}
|
||||||
|
|
||||||
.debug-message-expandable {
|
.debug-message-expandable {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
.debug-message-expandable:hover {
|
||||||
|
background: #fefefe;
|
||||||
|
}
|
||||||
|
.debug-message-expandable:hover .debug-message-object-handle {
|
||||||
|
color: #b72828 !important;
|
||||||
|
}
|
||||||
|
@ -15,5 +15,6 @@
|
|||||||
<div id="debug-content"></div>
|
<div id="debug-content"></div>
|
||||||
</body>
|
</body>
|
||||||
<script src="../../vendor/vendor-jquery.js"></script>
|
<script src="../../vendor/vendor-jquery.js"></script>
|
||||||
|
<script src="debug-utils.js"></script>
|
||||||
<script src="debug.js"></script>
|
<script src="debug.js"></script>
|
||||||
</html>
|
</html>
|
||||||
|
Loading…
Reference in New Issue
Block a user