How to get lengthy values out of the editor?

I have an HTTP response that I would like to take a closer look at. Both the debug node and the context tab truncate the string to 1415 characters. Can I somehow get the value out of the editor or do I have to write it to a file or provide it by HTTP or something like that?

This is a limit in settings.js

 // The maximum length, in characters, of any message sent to the debug sidebar tab
    debugMaxLength: 1000,

It can be changed but may cause a slowdown in the browser, so it may be better to write it to a file to inspect it.

You can send the value to console in the debug node config, were it will not be truncated .

Here is a subflow where you can send the msg or any property of it to a separarte browser window, where you can copy it if you wish.


That is very, very clever. I'm going to make use of it in some of my more complex flows. Thanks.


Just tried out your subflow in my 3.1.0-beta-4 windows instance and I got this error and an unconnected msg in the browser tab

I then tried it out on my main 3.0.2 running on Pi2 and it worked lovely

When 3.1.0 is released i will look to see if issue remains. Cheers for heads up. Looks like websocket node may have some breaking changes.

I wrote a uibuilder version at some point - based on this clever sub-flow.

[{"id":"38dea932ad8bf5b0","type":"group","z":"ff1a7711.244f48","name":"uibuilder Node-RED debug page - with full output and copy (Read my description for details)","style":{"label":true,"fill":"#ffefbf","fill-opacity":"0.34","color":"#000000"},"nodes":["b2b9cd88db08056f","30f917ba22b7601a","465991cb13575bdc","2dcf170369271854","85e33c87a851fd7b","cd117dec98696547"],"env":[{"name":"debug_name","value":"Debug","type":"str"},{"name":"debug_property","value":"msg","type":"str"}],"x":34,"y":319,"w":578,"h":142,"info":"A simple debug output page using uibuilder.\r\n\r\nNote that this group has 2 defined environment\r\nvariables. \r\n\r\n`debug_name` and `debug_property`. These\r\ncan also be overridden using msg properties\r\nof the same name.\r\n\r\nSimple send any message to the `link-in` node\r\nin this group and view a formatted version of\r\nthe message on the debug web page.\r\n\r\nThe web page has pause/resume buttons and \r\nclear all entries buttons.\r\n\r\nEach entry on the page can be copied to the \r\nclipboard using the ❒ button. Or the entry \r\ncan be deleted using the ❌ button.\r\n\r\nThe formatted output for each entry appears in \r\na scrollable box. You can grab the bottom-right\r\ncorner and expand the box manually.\r\n\r\nUnlike Node-RED's debug panel, ALL of the msg\r\nobject is included in the output - up to the \r\nmax limit of the Socket.IO client. If you need\r\nto extend the limit, you can do so in the \r\nuibuilder settings in the `settings.js` file.\r\n\r\nHowever, as with any web app, be wary of How\r\nmuch data you keep in the browser window. If \r\nyou let it get too big, your browser will slow\r\ndown and eventually break."},{"id":"b2b9cd88db08056f","type":"function","z":"ff1a7711.244f48","g":"38dea932ad8bf5b0","name":"","func":"// What msg property to debug (or the whole msg)\nconst debug_property = msg.debug_property || env.get('debug_property') || 'msg'\n// Each property part as an array. e.g `msg._ui` becomes ['msg','_ui']\nlet debug_property_array = []\n// Record any errors\nlet err = []\n\nlet dt = (new Date()).toLocaleString()\n\ntry {\n  debug_property_array = RED.util.normalisePropertyExpression(debug_property)\n  // node.send([null, {debug_property, debug_property_array}])\n} catch (e) {\n  node.warn(e.message)\n  err.push(e.message)\n}\n\nlet msg1 = {data: null}\nif (debug_property === 'msg') {\n  // Get the whole msg\n = RED.util.cloneMessage(msg)\n} else {\n  try {\n    // Try to get a specific msg property if requested\n    let ans = RED.util.getMessageProperty(msg, debug_property)\n    if (ans === undefined) {\n      err.push(`Message property not found. '${debug_property}'`)\n    } else {\n = ans\n    }\n  } catch(e) {\n    // Else get the whole msg\n = RED.util.cloneMessage(msg)\n    // but remove the debug meta data if it was passed in on the orig msg\n    delete\n    delete\n    delete\n    delete\n    err.push(e.message)\n  }\n}\n\nmsg1.topic = msg.topic\nmsg1.errors = err\nmsg1.debug_property = debug_property\nmsg1.debug_property_array = debug_property_array\n// Optional msg name - will default to original msg id\nmsg1.debug_name = msg.debug_name || env.get(\"debug_name\") || msg._msgid || \"name error\"\nmsg1.debug_dt = dt\n\nreturn [msg1,msg]","outputs":2,"noerr":0,"initialize":"","finalize":"","libs":[],"x":220,"y":360,"wires":[["30f917ba22b7601a"],[]],"inputLabels":["msg to debug"],"outputLabels":["debug msg","Original msg"]},{"id":"30f917ba22b7601a","type":"uibuilder","z":"ff1a7711.244f48","g":"38dea932ad8bf5b0","name":"","topic":"","url":"debug","fwdInMessages":false,"allowScripts":false,"allowStyles":false,"copyIndex":true,"templateFolder":"blank","extTemplate":"","showfolder":false,"reload":false,"sourceFolder":"src","deployedVersion":"6.5.0","showMsgUib":false,"credentials":{},"x":480,"y":360,"wires":[[],[]]},{"id":"465991cb13575bdc","type":"link in","z":"ff1a7711.244f48","g":"38dea932ad8bf5b0","name":"DEBUG","links":["e1e4747c8aa0481c"],"x":75,"y":360,"wires":[["b2b9cd88db08056f"]]},{"id":"2dcf170369271854","type":"comment","z":"ff1a7711.244f48","g":"38dea932ad8bf5b0","name":"index.html","info":"<!doctype html>\n<html lang=\"en\">\n\n<head>\n\n    <meta charset=\"utf-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n    <link rel=\"icon\" href=\"../uibuilder/images/node-blue.ico\">\n\n    <title>Debug - Node-RED uibuilder</title>\n    <meta name=\"description\" content=\"Node-RED uibuilder - Debug\">\n\n    <!-- Your own CSS (defaults to loading uibuilders css)-->\n    <link type=\"text/css\" rel=\"stylesheet\" href=\"./index.css\" media=\"all\">\n\n    <!-- #region Supporting Scripts. These MUST be in the right order. Note no leading / -->\n    <script defer src=\"../uibuilder/uibuilder.iife.min.js\"></script>\n    <script defer src=\"./index.js\">\n        /* OPTIONAL: Put your custom code in that */\n    </script>\n    <!-- #endregion -->\n\n</head>\n\n<body class=\"uib\">\n    <h1 class=\"with-subtitle\">uibuilder - Debug</h1>\n    <div role=\"doc-subtitle\">Using the IIFE library.</div>\n\n    <div id=\"header\">\n        <button id=\"pauser1\" value=\"pause\" onclick=\"doPause(event)\">Pause</button>\n        <button onclick=\"doClear(event)\">Clear All</button>\n        <button onclick=\"doToggle(event)\">Toggle All</button>\n    </div>\n\n    <div id=\"more\">\n        <!-- '#more' is used as a parent for dynamic HTML content in examples -->\n    </div>\n\n    <div id=\"footer\">\n        <button id=\"pauser2\" value=\"pause\" onclick=\"doPause(event)\">Pause</button>\n        <button onclick=\"doClear(event)\">Clear All</button>\n        <button onclick=\"doToggle(event)\">Toggle All</button>\n    </div>\n\n</body>\n\n</html>","x":120,"y":420,"wires":[]},{"id":"85e33c87a851fd7b","type":"comment","z":"ff1a7711.244f48","g":"38dea932ad8bf5b0","name":"index.js","info":"// uibuilder.logLevel = 2 // info\n\nconst elPaused1 = document.getElementById(\"pauser1\") || { innerText: '' }\nconst elPaused2 = document.getElementById(\"pauser2\") || { innerText: '' }\nlet paused = false\nlet msgCount = 0\n\n// Stop/resume inbound msgs\nfunction doPause(event) {\n    if (paused === true) {\n        elPaused1.innerText = \"Pause\"\n        elPaused2.innerText = \"Pause\"\n        paused = false\n        uibuilder.log('info', 'uibuilder.debug', 'Visual debug messages flowing')\n    } else {\n        elPaused1.innerText = \"Resume\"\n        elPaused2.innerText = \"Resume\"\n        paused = true\n        uibuilder.log('info', 'uibuilder.debug', 'Visual debug messages paused')\n    }\n}\n\n// Clears all debug entries\nfunction doClear(event) {\n    document.querySelector('#more').textContent = ''\n}\n\n// Toggle Hide/Show all syntax-highlight boxes\nfunction doToggle(event) {\n    const els ='pre.compact.syntax-highlight')\n    els.forEach( el => {\n        if (el.offsetWidth > 0) = 'none'\n        else = 'block'\n    })\n}\n\n// Copy the selected debug entry text to the browser OS clipboard\nfunction cpy(event) {\n    const elToCopy ='pre')\n    window.prompt(\"Copy to clipboard: Ctrl+C, Enter\", elToCopy.innerText)\n}\n// Remove the selected debug entry\nfunction del(event) {\n\n}\n// Toggle hide/show syntax-highlight for selected debug entry\nfunction toggle(event) {\n    const el ='pre')\n    if (el.offsetWidth > 0) = 'none'\n    else = 'block'\n}\n\nuibuilder.onChange('msg', (msg) => {\n    // console.log('DEBUG msg', msg)\n\n    if (paused === true || msg._ui) return\n\n    ++msgCount\n\n    // use uibuilder's low-code capability to build the output structure for the new debug entry\n    const toAdd = [{\n        method: 'add',\n        components: [\n            {\n                type: 'article',\n                parent: '#more',\n                position: 'first',\n                id: `dbg_${msgCount}`,\n                attributes: {\n                    class: 'dbg',\n                },\n                components: [\n                    {\n                        type: 'div',\n                        slot: `#${msgCount} | ${msg.debug_name} | ${msg.debug_dt} | <i title=\"msg property\">${msg.debug_property}</i> | <button title=\"copy\" class=\"cbtn\" onclick=\"cpy(event)\"> 📋 </button> <button title=\"toggle\" class=\"cbtn\" onclick=\"toggle(event)\"> ⬇️ </button> <button title=\"delete\" class=\"cbtn fr\" onclick=\"del(event)\"> 🗑️ </button>`,\n                    },\n                ],\n            }\n        ],\n\n    }]\n\n    // If there are errors, output a list of them\n    if (msg.errors.length > 0) {\n        toAdd[0].components[0].components.push({\n            type: 'div',\n            slot: `<p class=\"error\">${msg.errors.join('</p><p class=\"error\">')}</p>`\n        })\n    } else {\n        // otherwise output the highlighted\n        toAdd[0].components[0].components.push({\n            type: 'pre',\n            attributes: {\n                class: 'compact syntax-highlight',\n            },\n            // Formates the data using a simple JSON colour formatter\n            slot: uibuilder.syntaxHighlight(\n        })\n    }\n\n    uibuilder.ui(toAdd)\n})\n","x":250,"y":420,"wires":[]},{"id":"cd117dec98696547","type":"comment","z":"ff1a7711.244f48","g":"38dea932ad8bf5b0","name":"index.css","info":"/* Load defaults from `<userDir>/node_modules/node-red-contrib-uibuilder/front-end/uib-brand.css`\n * This version auto-adjusts for light/dark browser settings but might not be as complete.\n */\n@import url(\"../uibuilder/uib-brand.css\");\n\n#header {\n    margin-bottom: 0;\n    padding-bottom: .5em;\n    border-bottom: 1px solid var(--surface5);\n}\n#footer {\n    margin-top: 1em;\n    padding-top: .5em;\n    border-top: 1px solid var(--surface5);\n}\n.dbg {\n    border: 1px solid var(--surface5);\n    padding: 0.2rem 0.5rem;\n    margin: 0;\n}\n.cbtn {\n    padding: 2px 5px;\n    border-radius: 0;\n    background: inherit;\n    margin: 2px;\n}\n.compact {\n    margin: 0;\n    padding-top: 0.2rem;\n    padding-bottom: 0.2rem;\n}\ {\n    float: right;\n}","x":380,"y":420,"wires":[]}]

Just did a little exploring and for some reason - there's no code in the function node

Code is their on the working Pi 3.0.2 one
[edit] I've found out I don't seem able to type code into ANY function node on by 3.1.0-beta-4 :frowning: so I'll go a and report that on its thread

The no-code issue is fixed (clash with new FlowFlow dashboard) but still getting the missing server config error message and not connected in the browser tab

[edit} I removed the FF dashboard module completely (and restarted NR) but made no difference

Did you refresh the browser

I have now but no difference

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.