@gregoriusrippenstein/node-red-contrib-introspection 0.8.1 → 0.8.3

package/README.md

@@ -78,6 +78,18 @@ Sidebar for visually obfuscating flows:
 
 The plugin replaces the name with the node Id, resets the nodes info content to empty and moves all nodes to the same location. The intention is to having a *working* flow but not an *understandable* flow. The generated flow is meant to be only usable and not modifiable nor maintainable.
 
+### Message tracing
+
+Sometimes it would be nice to observe the flow of messages through a flow. This is possible by using 'Trace Messages' found at the bottom of the 'Lint' tab:
+
+![img](https://cdn.openmindmap.org/content/1728588310213_msgtrace.gif)
+
+Message tracing can be toggled on & off *without* redeploying the flow. So this can be used as a quick check for observing tricky situation.
+
+The nodes status will be replaced by 'msg received', so if the status should be showing something else, that is lost.
+
+Also this is an experimental feature liable to be [improved](https://discourse.nodered.org/t/message-tracing-for-beginners/92287).
+
 ## Palette Nodes
 
 ### Sink & Seeker

package/nodes/60-client-code.html

@@ -1,5 +1,45 @@
 <script type="text/javascript">
 
+ RED.comms.subscribe('msgtracer:node-received', (event,data) => {
+   if ( data.nodeid) {
+     let node = RED.nodes.node(data.nodeid)
+     let olddata = $("#node-input-msgtracer-trace-treelist").treeList('data')
+     let foundItem = false;
+
+     olddata.forEach( itm => {
+       if ( itm.id == node.id ) {
+        foundItem = true
+        itm.sublabel = "" + (parseInt(itm.sublabel) + 1)
+       }
+     })
+
+     if ( !foundItem ) {
+        let nodeDef = RED.nodes.getType(node.type);
+        let label;
+
+        if (nodeDef) {
+            let l = nodeDef.label;
+            label = (typeof l === "function" ? l.call(node) : l) || node.type;
+        } else {
+          label = node.type
+        }
+
+       let newitem = {
+        id: node.id,
+        label: label,
+        sublabel: "1",
+        selected: false,
+        checkbox: false,
+        node: node
+      }
+
+      $("#node-input-msgtracer-trace-treelist").treeList('data',[newitem, ...olddata])
+     } else {
+       $("#node-input-msgtracer-trace-treelist").treeList('data',olddata)
+     }
+   }
+ })
+ 
  RED.comms.subscribe('introspect:client-code-perform', (event,data) => {
    if ( data.msg == "execfunc" ) {
 

package/nodes/60-client-code.js

@@ -10,6 +10,12 @@ module.exports = function(RED) {
       let nde = RED.nodes.getNode(evnt.destination.id)
       nde.status({ fill: "green", shape: "ring", text: "msg received" })
       setTimeout(() => { nde.status({}) }, 1000)
+
+      RED.comms.publish("msgtracer:node-received",
+        RED.util.encodeObject({
+          nodeid: evnt.destination.id
+        })
+      )
     } catch (ex) {
       console.error(ex)
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gregoriusrippenstein/node-red-contrib-introspection",
-  "version": "0.8.1",
+  "version": "0.8.3",
   "dependencies": {
     "got": "^13",
     "uglify-js": "^3.17.4",

package/plugins/sidebar.html

@@ -14,6 +14,8 @@
 
    function setupTreelistAllLinksForLinkIn(e){e=collectAllLinksNodes(e);if(0==e.length){RED.notify("No links found",{type:"error",timeout:2e3});try{$("#node-input-orphan-target-container-div").treeList("empty")}catch(e){}}else{try{$("#node-input-orphan-target-container-div").treeList("empty")}catch(e){$("#node-input-orphan-target-container-div").css({width:"100%",height:"calc(100%)"}).treeList({multi:!1}).on("treelistitemmouseover",function(e,t){}).on("treelistitemmouseout",function(e,t){}).on("treelistselect",function(e,t){t.node&&(RED.workspaces.show(t.node.z,!1,!1,!0),RED.view.reveal(t.node.id,!0),RED.view.redraw())}).on("treelistconfirm",function(e,t){var n;t.node&&(n=t.node.id,setTimeout(()=>{var e=RED.nodes.node(n);e&&(RED.view.reveal(e.id),RED.view.select(e.id),RED.editor.edit(e,"editor-tab-description")),n==RED.workspaces.active()&&RED.workspaces.edit()},50))}),$("#node-input-orphan-target-filter").show();var n=$("#node-input-orphan-target-filter").searchBox({style:"compact",delay:300,change:function(){var e,t=$(this).val().trim().toLowerCase();""===t?($("#node-input-orphan-target-container-div").treeList("filter",null),n.searchBox("count","")):(e=$("#node-input-orphan-target-container-div").treeList("filter",function(e){return-1<e.label.toLowerCase().indexOf(t)||-1<e.node.type.toLowerCase().indexOf(t)}),n.searchBox("count",e+" / "+$("#node-input-orphan-target-container-div").treeList("data").length))}})}$("#node-input-orphan-target-container-div").treeList("data",e.sort((e,t)=>e.node.z>t.node.z))}}function collectAllLinksNodes(t){let n=[];RED.nodes.eachNode(e=>{"link call"!=e.type&&"link out"!=e.type||-1<e.links.indexOf(t)&&n.push(e)});var i=[],r={};return n.forEach(function(e){var t=RED.nodes.getType(e.type);if(t){var n,o=t.label,o=("function"==typeof o?o.call(e):o)||"";if(0===(n=e.type).indexOf("subflow:"))return}t&&o||(o=e.type),r[e.id]={node:e,label:o,sublabel:n,selected:!1,checkbox:!1},i.push(r[e.id])}),i}function collectNodeStats(){let t={},n=[],o={workspaces:0,junctions:0,subflows:0,configs:0,groups:0,wires:0,nodes:0},i=(RED.nodes.eachConfig(e=>{o.configs+=1}),RED.nodes.eachLink(e=>{o.wires+=1}),RED.nodes.eachJunction(e=>{o.junctions+=1}),RED.nodes.eachGroup(e=>{o.groups+=1}),RED.nodes.eachWorkspace(e=>{o.workspaces+=1}),RED.nodes.eachSubflow(e=>{o.subflows+=1}),RED.nodes.eachNode(e=>{o.nodes+=1,t[e.type]=(t[e.type]||0)+1}),Object.keys(t).forEach(e=>{n.push({label:e,sublabel:t[e],selected:!1,checkbox:!1})}),[]),r=0;return Object.keys(o).forEach(e=>{r+=o[e],i.push({label:e,sublabel:o[e],selected:!1,checkbox:!1})}),[{label:"__ TOTALS",sublabel:r,selected:!1,checkbox:!1,children:i}].concat(n.sort((e,t)=>e.label>t.label))}function setupTreeListForNodeStats(){var e=collectNodeStats();try{$("#node-input-orphan-target-container-div").treeList("empty")}catch(e){$("#node-input-orphan-target-container-div").css({width:"100%",height:"calc(100%)"}).treeList({multi:!1}).on("treelistitemmouseover",function(e,t){}).on("treelistitemmouseout",function(e,t){}).on("treelistselect",function(e,t){}).on("treelistconfirm",function(e,t){}),$("#node-input-orphan-target-filter").show();var n=$("#node-input-orphan-target-filter").searchBox({style:"compact",delay:300,change:function(){var e,t=$(this).val().trim().toLowerCase();""===t?($("#node-input-orphan-target-container-div").treeList("filter",null),n.searchBox("count","")):(e=$("#node-input-orphan-target-container-div").treeList("filter",function(e){return-1<e.label.toLowerCase().indexOf(t)}),n.searchBox("count",e+" / "+$("#node-input-orphan-target-container-div").treeList("data").length))}})}$("#node-input-orphan-target-container-div").treeList("data",e)}
 
+   function setupTreeMsgTracerlist(){try{$("#node-input-msgtracer-trace-treelist").treeList("empty"),$("#node-input-msgtracer-trace-treelist").treeList("data",[])}catch(e){$("#node-input-msgtracer-trace-treelist").css({width:"100%",height:"calc(100%)"}).treeList({multi:!1}).on("treelistitemmouseover",function(e,t){}).on("treelistitemmouseout",function(e,t){}).on("treelistselect",function(e,t){t.node&&(RED.workspaces.show(t.node.z,!1,!1,!0),RED.view.reveal(t.node.id,!0),RED.view.redraw())}).on("treelistconfirm",function(e,t){var r;t.node&&(r=t.node.id,setTimeout(()=>{var e=RED.nodes.node(r);e&&(RED.view.reveal(e.id),RED.view.select(e.id),RED.editor.edit(e)),r==RED.workspaces.active()&&RED.workspaces.edit()},50))}),$("#node-input-msgtracer-trace-treelist-filter").show();var r=$("#node-input-msgtracer-trace-treelist-filter").searchBox({style:"compact",delay:300,change:function(){var e,t=$(this).val().trim().toLowerCase();""===t?($("#node-input-msgtracer-trace-treelist").treeList("filter",null),r.searchBox("count","")):(e=$("#node-input-msgtracer-trace-treelist").treeList("filter",function(e){return-1<e.label.toLowerCase().indexOf(t)||-1<e.node.type.toLowerCase().indexOf(t)}),r.searchBox("count",e+" / "+$("#node-input-msgtracer-trace-treelist").treeList("data").length))}})}}
+
    // Add your plugin as a new tabsheet in the right sidebar AFTER the flow editor is completely started
    var initialiseConfigNodeOnce = () => {
       RED.events.off('runtime-state', initialiseConfigNodeOnce);
@@ -238,26 +240,37 @@
          $('.red-ui-linkcall-link-indicator').remove()
       })
 
+      $('#node-input-msgtrace-clear-trace-btn').on('click', (e) => {
+         if ( e ) { e.preventDefault() }
+         setupTreeMsgTracerlist()
+         $("#node-input-msgtracer-trace-treelist").treeList('empty')
+         $("#node-input-msgtracer-trace-treelist").treeList('data', [])
+      })
+
       $('#node-input-msgtracer-toggle').on("change", function (e) {
-        $.ajax({
-            url:         "ClientCode/msgtracer/" + ($('#node-input-msgtracer-toggle').is(":checked") ? "on" : "off"),
-            type:        "POST",
-            contentType: "application/json; charset=utf-8",
-            data:        {},
-            success: function (resp) {
-               RED.notify("Message tracing succeed", {
-                  type: "success",
+         if ( $('#node-input-msgtracer-toggle').is(":checked") ) {
+            setupTreeMsgTracerlist()
+         }
+         
+         $.ajax({
+               url:         "ClientCode/msgtracer/" + ($('#node-input-msgtracer-toggle').is(":checked") ? "on" : "off"),
+               type:        "POST",
+               contentType: "application/json; charset=utf-8",
+               data:        {},
+               success: function (resp) {
+                  RED.notify("Message tracing succeed", {
+                     type: "success",
+                     timeout: 3000
+                  })
+               },
+
+               error: function (jqXHR, textStatus, errorThrown) {
+               RED.notify("Message tracing failed: " +textStatus, {
+                  type: "error",
                   timeout: 3000
-               })
-            },
-
-            error: function (jqXHR, textStatus, errorThrown) {
-              RED.notify("Message tracing failed: " +textStatus, {
-                type: "error",
-                timeout: 3000
-              });
-            }
-       });
+               });
+               }
+         });
       })
 
       RED.actions.add( "introspection:show-link-call-links", highlightAllLinkCalls)
@@ -388,6 +401,16 @@
          </label>
          <input type="checkbox" id="node-input-msgtracer-toggle"
                               style="display:inline-block; width:15px; vertical-align:baseline;">
+         <button id="node-input-msgtrace-clear-trace-btn"
+                       class="red-ui-button">Clear Trace</button>
+      </div>
+
+      <div class="form-row"
+         style="margin-left: 10px; position: relative; min-height: 200px; height: 450px; margin-right: 15px;">
+         <div style="margin-bottom: 5px; width: 35%; padding-left: 60%;">
+            <input type="text" id="node-input-msgtracer-trace-treelist-filter" style="display: none;">
+         </div>
+         <div id="node-input-msgtracer-trace-treelist"></div>
       </div>
    </div>