diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/tab-context.js b/packages/node_modules/@node-red/editor-client/src/js/ui/tab-context.js index 6cb034ccc..2c56786c8 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/tab-context.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/tab-context.js @@ -18,8 +18,6 @@ RED.sidebar.context = (function() { var content; var sections; - var localCache = {}; - var flowAutoRefresh; var nodeAutoRefresh; var nodeSection; @@ -27,6 +25,8 @@ RED.sidebar.context = (function() { var flowSection; var globalSection; + const expandedPaths = {} + var currentNode; var currentFlow; @@ -212,14 +212,41 @@ RED.sidebar.context = (function() { var l = keys.length; for (var i = 0; i < l; i++) { sortedData[keys[i]].forEach(function(v) { - var k = keys[i]; - var l2 = sortedData[k].length; - var propRow = $('').appendTo(container); - var obj = $(propRow.children()[0]); + const k = keys[i]; + let payload = v.msg; + let format = v.format; + const tools = $(''); + expandedPaths[id + "." + k] = expandedPaths[id + "." + k] || new Set() + const objectElementOptions = { + typeHint: format, + sourceId: id + "." + k, + tools, + path: k, + rootPath: k, + exposeApi: true, + ontoggle: function(path,state) { + path = path.substring(k.length+1) + if (state) { + expandedPaths[id+"."+k].add(path) + } else { + // if 'a' has been collapsed, we want to remove 'a.b' and 'a[0]...' from the set + // of collapsed paths + for (let expandedPath of expandedPaths[id+"."+k]) { + if (expandedPath.startsWith(path+".") || expandedPath.startsWith(path+"[")) { + expandedPaths[id+"."+k].delete(expandedPath) + } + } + expandedPaths[id+"."+k].delete(path) + } + }, + expandPaths: [ ...expandedPaths[id+"."+k] ].sort(), + expandLeafNodes: true + } + const propRow = $('').appendTo(container); + const obj = $(propRow.children()[0]); obj.text(k); - var tools = $(''); const urlSafeK = encodeURIComponent(k) - var refreshItem = $('').appendTo(tools).on("click", function(e) { + const refreshItem = $('').appendTo(tools).on("click", function(e) { e.preventDefault(); e.stopPropagation(); $.getJSON(baseUrl+"/"+urlSafeK+"?store="+v.store, function(data) { @@ -229,16 +256,14 @@ RED.sidebar.context = (function() { tools.detach(); $(propRow.children()[1]).empty(); RED.utils.createObjectElement(RED.utils.decodeObject(payload,format), { + ...objectElementOptions, typeHint: data.format, - sourceId: id+"."+k, - tools: tools, - path: k }).appendTo(propRow.children()[1]); } }) }); RED.popover.tooltip(refreshItem,RED._("sidebar.context.refrsh")); - var deleteItem = $('').appendTo(tools).on("click", function(e) { + const deleteItem = $('').appendTo(tools).on("click", function(e) { e.preventDefault(); e.stopPropagation(); var popover = RED.popover.create({ @@ -246,7 +271,7 @@ RED.sidebar.context = (function() { target: propRow, direction: "left", content: function() { - var content = $('
'); + const content = $('
'); $('

').appendTo(content); var row = $('

').appendTo(content); var bg = $('').appendTo(row); @@ -269,16 +294,15 @@ RED.sidebar.context = (function() { if (container.children().length === 0) { $('').appendTo(container).i18n(); } + delete expandedPaths[id + "." + k] } else { payload = data.msg; format = data.format; tools.detach(); $(propRow.children()[1]).empty(); RED.utils.createObjectElement(RED.utils.decodeObject(payload,format), { - typeHint: data.format, - sourceId: id+"."+k, - tools: tools, - path: k + ...objectElementOptions, + typeHint: data.format }).appendTo(propRow.children()[1]); } }); @@ -293,14 +317,7 @@ RED.sidebar.context = (function() { }); RED.popover.tooltip(deleteItem,RED._("sidebar.context.delete")); - var payload = v.msg; - var format = v.format; - RED.utils.createObjectElement(RED.utils.decodeObject(payload,format), { - typeHint: v.format, - sourceId: id+"."+k, - tools: tools, - path: k - }).appendTo(propRow.children()[1]); + RED.utils.createObjectElement(RED.utils.decodeObject(payload,format), objectElementOptions).appendTo(propRow.children()[1]); if (contextStores.length > 1) { $("",{class:"red-ui-sidebar-context-property-storename"}).text(v.store).appendTo($(propRow.children()[0])) } diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/utils.js b/packages/node_modules/@node-red/editor-client/src/js/ui/utils.js index cfc7f65de..49ad15d87 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/utils.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/utils.js @@ -230,7 +230,7 @@ RED.utils = (function() { var pinnedPaths = {}; var formattedPaths = {}; - function addMessageControls(obj,sourceId,key,msg,rootPath,strippedKey,extraTools) { + function addMessageControls(obj,sourceId,key,msg,rootPath,strippedKey,extraTools,enablePinning) { if (!pinnedPaths.hasOwnProperty(sourceId)) { pinnedPaths[sourceId] = {} } @@ -250,7 +250,7 @@ RED.utils = (function() { RED.clipboard.copyText(msg,copyPayload,"clipboard.copyMessageValue"); }) RED.popover.tooltip(copyPayload,RED._("node-red:debug.sidebar.copyPayload")); - if (strippedKey !== undefined && strippedKey !== '') { + if (enablePinning && strippedKey !== undefined && strippedKey !== '') { var isPinned = pinnedPaths[sourceId].hasOwnProperty(strippedKey); var pinPath = $('').appendTo(tools).on("click", function(e) { @@ -281,13 +281,16 @@ RED.utils = (function() { } } } - function checkExpanded(strippedKey,expandPaths,minRange,maxRange) { + function checkExpanded(strippedKey, expandPaths, { minRange, maxRange, expandLeafNodes }) { if (expandPaths && expandPaths.length > 0) { if (strippedKey === '' && minRange === undefined) { return true; } for (var i=0;i').appendTo(element); if (sourceId) { - addMessageControls(header,sourceId,path,obj,rootPath,strippedKey,tools); + addMessageControls(header,sourceId,path,obj,rootPath,strippedKey,tools, enablePinning); } if (!key) { element.addClass("red-ui-debug-msg-top-level"); - if (sourceId) { + if (sourceId && !expandPaths) { var pinned = pinnedPaths[sourceId]; expandPaths = []; if (pinned) { @@ -476,7 +481,7 @@ RED.utils = (function() { $('').text(typeHint||'string').appendTo(header); var row = $('

').appendTo(element); $('
').text(obj).appendTo(row);
-                },function(state) {if (ontoggle) { ontoggle(path,state);}}, checkExpanded(strippedKey,expandPaths));
+                },function(state) {if (ontoggle) { ontoggle(path,state);}}, checkExpanded(strippedKey, expandPaths, { expandLeafNodes }));
             }
             e = $('').html('"'+formatString(sanitize(obj))+'"').appendTo(entryObj);
             if (/^#[0-9a-f]{6}$/i.test(obj)) {
@@ -592,14 +597,16 @@ RED.utils = (function() {
                                     typeHint: type==='buffer'?'hex':false,
                                     hideKey: false,
                                     path: path+"["+i+"]",
-                                    sourceId: sourceId,
-                                    rootPath: rootPath,
-                                    expandPaths: expandPaths,
-                                    ontoggle: ontoggle,
-                                    exposeApi: exposeApi,
+                                    sourceId,
+                                    rootPath,
+                                    expandPaths,
+                                    expandLeafNodes,
+                                    ontoggle,
+                                    exposeApi,
                                     // tools: tools // Do not pass tools down as we
                                                     // keep them attached to the top-level header
                                     nodeSelector: options.nodeSelector,
+                                    enablePinning
                                 }
                             ).appendTo(row);
                         }
@@ -623,21 +630,23 @@ RED.utils = (function() {
                                                 typeHint: type==='buffer'?'hex':false,
                                                 hideKey: false,
                                                 path: path+"["+i+"]",
-                                                sourceId: sourceId,
-                                                rootPath: rootPath,
-                                                expandPaths: expandPaths,
-                                                ontoggle: ontoggle,
-                                                exposeApi: exposeApi,
+                                                sourceId,
+                                                rootPath,
+                                                expandPaths,
+                                                expandLeafNodes,
+                                                ontoggle,
+                                                exposeApi,
                                                 // tools: tools // Do not pass tools down as we
                                                                 // keep them attached to the top-level header
                                                 nodeSelector: options.nodeSelector,
+                                                enablePinning
                                             }
                                         ).appendTo(row);
                                     }
                                 }
                             })(),
                             (function() { var path = path+"["+i+"]"; return function(state) {if (ontoggle) { ontoggle(path,state);}}})(),
-                            checkExpanded(strippedKey,expandPaths,minRange,Math.min(fullLength-1,(minRange+9))));
+                            checkExpanded(strippedKey,expandPaths,{ minRange, maxRange: Math.min(fullLength-1,(minRange+9)), expandLeafNodes}));
                             $('').html("["+minRange+" … "+Math.min(fullLength-1,(minRange+9))+"]").appendTo(header);
                         }
                         if (fullLength < originalLength) {
@@ -646,7 +655,7 @@ RED.utils = (function() {
                     }
                 },
                 function(state) {if (ontoggle) { ontoggle(path,state);}},
-                checkExpanded(strippedKey,expandPaths));
+                checkExpanded(strippedKey, expandPaths, { expandLeafNodes }));
             }
         } else if (typeof obj === 'object') {
             element.addClass('collapsed');
@@ -680,14 +689,16 @@ RED.utils = (function() {
                                 typeHint: false,
                                 hideKey: false,
                                 path: newPath,
-                                sourceId: sourceId,
-                                rootPath: rootPath,
-                                expandPaths: expandPaths,
-                                ontoggle: ontoggle,
-                                exposeApi: exposeApi,
+                                sourceId,
+                                rootPath,
+                                expandPaths,
+                                expandLeafNodes,
+                                ontoggle,
+                                exposeApi,
                                 // tools: tools // Do not pass tools down as we
                                                 // keep them attached to the top-level header
                                 nodeSelector: options.nodeSelector,
+                                enablePinning
                             }
                         ).appendTo(row);
                     }
@@ -696,7 +707,7 @@ RED.utils = (function() {
                     }
                 },
                 function(state) {if (ontoggle) { ontoggle(path,state);}},
-                checkExpanded(strippedKey,expandPaths));
+                checkExpanded(strippedKey, expandPaths, { expandLeafNodes }));
             }
             if (key) {
                 $('').text(type).appendTo(entryObj);
diff --git a/packages/node_modules/@node-red/nodes/core/common/lib/debug/debug-utils.js b/packages/node_modules/@node-red/nodes/core/common/lib/debug/debug-utils.js
index b244273dc..0a84b24c7 100644
--- a/packages/node_modules/@node-red/nodes/core/common/lib/debug/debug-utils.js
+++ b/packages/node_modules/@node-red/nodes/core/common/lib/debug/debug-utils.js
@@ -511,9 +511,10 @@ RED.debug = (function() {
             typeHint: format,
             hideKey: false,
             path: path,
-            sourceId: sourceNode&&sourceNode.id,
+            sourceId: sourceNode && sourceNode.id,
             rootPath: path,
             nodeSelector: config.messageSourceClick,
+            enablePinning: true
         });
         // Do this in a separate step so the element functions aren't stripped
         debugMessage.appendTo(el);