Error when trying to add a custom sidebar tab

Core Development
1

Moved from the NR v5 thread as I think this might be a bug from before then?

Ah, another sidebar issue?

UIBUILDER has the uib-sidebar node that creates a custom sidebar - in NR5, unless I'm missing something, there doesn't appear to be a way to get to that sidebar any more. It was working fine before and, I think, was working in the beta.

Hmm, actually, it might be a bug in the uib-sidebar node.

So this actually appears to be a bug in core - I think.

function w(a) {
  return N.primary.tabs.contains(a)
}

Sorry, I can't find this in the actual node-red code, that is how it appears in the browser when viewing the Editor page.

In my uib-sidebar node, I watch for an instance of the node being added and, for the first instance only, try to add the sidebar tab. But first, I test for whether it already exists using:

    RED.events.on('nodes:add', function(node) {
        if (node.type === moduleName) {
            // console.log(`🌐📊[uib-sidebar] Node added: ${node.id}`, node.html)
            window['uibSidebarNodeCount']++
            console.info(`🌐📊[uib-sidebar] Node count: ${window['uibSidebarNodeCount']}`)
            // When the first uib-sidebar node is added ...
            if (window['uibSidebarNodeCount'] === 1) {
                log('🌐📊[uib-sidebar] FIRST uib-sidebar added - ADDING SIDEBAR')
                let uibSb = false
                try {
                    uibSb = RED.sidebar.containsTab('uibuilder-sidebar-ui')
                } catch (e) {
                    // Ignore - this just means the sidebar tab doesn't exist yet
                    console.error('🌐📊[uib-sidebar] Error checking for existing sidebar tab:', e)
                }
                // Add the sidebar tab
                if (!uibSb) {
                    RED.sidebar.addTab({
                        id: 'uibuilder-sidebar-ui',
                        label: 'uib UI',
                        name: 'UIBUILDER Sidebar UI',
                        content: sbMasterEl,
                        // toolbar: uiComponents.footer,
                        enableOnEdit: true,
                        iconClass: 'fa fa-globe uib-blue',
                    })
                }
            }
   ...

The line:

uibSb = RED.sidebar.containsTab('uibuilder-sidebar-ui')

Produces the error:

VM4018:127 🌐📊[uib-sidebar] Error checking for existing sidebar tab: TypeError: Cannot read properties of undefined (reading 'contains')
    at Object.w [as containsTab] (red.min.js?v=358a4182b458:97:106251)
    at <anonymous>:124:41
    at Object.k [as emit] (red.min.js?v=358a4182b458:16:23144)
    at h (red.min.js?v=358a4182b458:18:16973)
    at Object.nt [as import] (red.min.js?v=358a4182b458:18:44991)
    at Object.success (red.min.js?v=358a4182b458:16:3526)
    at c (vendor.js?v=358a4182b458:2:25304)
    at Object.fireWith [as resolveWith] (vendor.js?v=358a4182b458:2:26053)
    at l (vendor.js?v=358a4182b458:2:77782)
    at XMLHttpRequest.<anonymous> (vendor.js?v=358a4182b458:2:80265)

When tracing the problem, I find the error is generated in that initial code I posted. It turns out that the tabs property is undefined.

I think this is probably a bug in that code and it probably should be something like:

function w(a) {
    return N.primary?.tabs?.contains(a) ?? false
}
2

Missing sidebar.tabs instantiation in setupSidebar.

I'm not sure what's supposed to replace that :thinking:

3

Hmm, thanks. But the RED.sidebar.containsTab function is still there so this is definitely a bug one way or another right? Either that function should be removed from the code and documentation or the tabs property should be fixed or the containsTab function should be amended as shown.

As it happens, I don't really need that function I don't think since I am manually tracking for node instances and will only add it for the first instance anyway. So I have a work around.

4

Looking at the new code, I would say the fix is:

function containsTab(id) {
  return !!knownTabs[id];
}
5

RED.sidebar.containsTab() isn't actually used anywhere in the editor code - which is how this has slipped through.

Lets get an issue raised and we'll fix it up.

6

Done: