Layout is broken when the layout editor is opened

Dashboard
1

*This text is translated by a translator.

See Steps

  1. Use the Layout Editor to adjust the dashboard layout.

2.Deploy the system.

  1. View the dashboard and confirm that it is in the same state as the layout set in step 1.

  2. Open the Layout Editor again, and you will see that the layout in the Layout Editor is broken when you open it.

  3. Deploy by pressing "Finish" in that state.

  4. The dashboard shows the same collapsed layout as seen in step 4.

This procedure 1~6 is repeated all the way through.
As a stopgap measure, it is fine to do steps 1~3 every time, but in practice, it is very tedious.

Please give me any solutions or wisdom regarding this problem of collapsing layouts every time I open the layout editor.
Also, if you don't know of a solution but are experiencing similar problems, please let me know. I am trying to find out if this is only happening in my environment.

Node-RED version : v2.2.0
Dashboard version : 3.1.5
Device : Raspberry Pi 4B 4GB
OS : Raspbian(bullseye)
Browser : Microsoft Edge(I have a VNC connection from a Windows 10 PC.)

2

Welcome to the forum @Yamada

Please tell us which versions of node red and node-red-dashboard you are using.
Also what device and os you are running on, how you installed node red and which browser you are using.
Please try to answer all the questions.

3

Thanks for the welcome Colin.

Node-RED version : v2.2.0
Dashboard version : 3.1.5
Device : Raspberry Pi 4B 4GB
OS : Raspbian(bullseye)
Browser : Microsoft Edge(I have a VNC connection from a Windows 10 PC.)
How install : I don't remember. I think it was a very common Raspberry Pi installation method.

Sorry if I've misunderstood or missing information.
These information will be added to the text later.

4

Can you stop node red and start it again in a terminal and copy/paste the full startup log here please.

Do you see the same problem if you run the browser on the pi, or on another machine on the same network as the pi (so avoiding the VPN)?

5

pi@raspberrypi:~ $ node-red-start

Start Node-RED

Once Node-RED has started, point a browser at http://192.168.1.44:1880
On Pi Node-RED works better with the Firefox or Chrome browser

Use sudo systemctl enable nodered.service to autostart Node-RED at every boot
Use sudo systemctl disable nodered.service to disable autostart on boot

To find more nodes and example flows - go to http://flows.nodered.org

Starting as a normal user.
22 Mar 08:19:24 - [info]

Welcome to Node-RED

22 Mar 08:19:24 - [info] Node-RED バージョン: v2.2.0
22 Mar 08:19:24 - [info] Node.js バージョン: v14.19.0
22 Mar 08:19:24 - [info] Linux 5.10.103-v7l+ arm LE
22 Mar 08:19:25 - [info] パレットノードのロード
22 Mar 08:19:26 - [info] Dashboard version 3.1.5 started at /ui
22 Mar 08:19:27 - [info] 設定ファイル: /home/pi/.node-red/settings.js
22 Mar 08:19:27 - [info] HTTP Static : /home/pi/node-red-static
22 Mar 08:19:27 - [info] コンテキストストア : 'default' [module=memory]
22 Mar 08:19:27 - [info] ユーザディレクトリ : /home/pi/.node-red
22 Mar 08:19:27 - [warn] プロジェクトは無効化されています : editorTheme.projects.enabled=false
22 Mar 08:19:27 - [info] フローファイル : /home/pi/.node-red/flows.json
22 Mar 08:19:27 - [error] 未補足の例外:
22 Mar 08:19:27 - [error] Error: listen EADDRINUSE: address already in use 0.0.0.0:1880
at Server.setupListenHandle [as _listen2] (net.js:1331:16)
at listenInCluster (net.js:1379:12)
at doListen (net.js:1516:7)
at processTicksAndRejections (internal/process/task_queues.js:83:21)

(It is a log of my language.)

Sorry for the late reply.
This occurs even when the browser is run on a Pi.
It also occurs when I run the browser on another different machine on the same network.

6

In general I agree with the thread creator - and I see no dependency with the NodeRed core system. If I open the layout editor it happens very often, that the layout is not completely destroyed, but I have to rearrange the groups either within the layout editor or rearrange spacers within the dashboard tab. This is happens since several versions and has not improved in the newest versions. (dashboard v 3.1.6 and Node-Red v 2.2.2)

However for me it has not the priority as you can manually fix it within the dashboard tab. I avoid to use the layout editor at all - as it does not work for me as well.

1 Like
7

You did not stop node-red before starting it again.

8

pi@raspberrypi:~ $ node-red-stop
Stop Node-RED

Use node-red-start to start Node-RED again

pi@raspberrypi:~ $ node-red-start

Start Node-RED

Once Node-RED has started, point a browser at http://192.168.1.44:1880
On Pi Node-RED works better with the Firefox or Chrome browser

Use sudo systemctl enable nodered.service to autostart Node-RED at every boot
Use sudo systemctl disable nodered.service to disable autostart on boot

To find more nodes and example flows - go to http://flows.nodered.org

Starting as a normal user.
23 Mar 11:09:32 - [info]

Welcome to Node-RED

23 Mar 11:09:32 - [info] Node-RED バージョン: v2.2.0
23 Mar 11:09:32 - [info] Node.js バージョン: v14.19.1
23 Mar 11:09:32 - [info] Linux 5.10.103-v7l+ arm LE
23 Mar 11:09:33 - [info] パレットノードのロード
23 Mar 11:09:35 - [info] Dashboard version 3.1.5 started at /ui
23 Mar 11:09:35 - [info] 設定ファイル: /home/pi/.node-red/settings.js
23 Mar 11:09:35 - [info] HTTP Static : /home/pi/node-red-static
23 Mar 11:09:35 - [info] コンテキストストア : 'default' [module=memory]
23 Mar 11:09:35 - [info] ユーザディレクトリ : /home/pi/.node-red
23 Mar 11:09:35 - [warn] プロジェクトは無効化されています : editorTheme.projects.enabled=false
23 Mar 11:09:35 - [info] フローファイル : /home/pi/.node-red/flows.json
23 Mar 11:09:36 - [error] 未補足の例外:
23 Mar 11:09:36 - [error] Error: listen EADDRINUSE: address already in use 0.0.0.0:1880
at Server.setupListenHandle [as _listen2] (net.js:1331:16)
at listenInCluster (net.js:1379:12)
at doListen (net.js:1516:7)
at processTicksAndRejections (internal/process/task_queues.js:83:21)

9

Either node-red was still running (even after the stop) or something else is using that port. Run node-red-stop again and then make sure that the web interface says not available. If the interface still works then I imagine you started node-red by a different method.

10

I confirmed that node-red does not stop even if I do node-red-stop many times.
What should I do?

11

What does sudo ss -tulpn | grep 1880 output? It should show you the process which is using port 1880.

I do not know why node-red-stop is not working but you could try sudo systemctl disable nodered (Note "nodered" not "node-red")
Followed by sudo reboot

12

pi@raspberrypi:~ $ sudo ss -tulpn | grep 1880
tcp LISTEN 0 511 0.0.0.0:1880 0.0.0.0:* users:(("node-red",pid=1426,fd=21))

I ran sudo systemctl disable nodered and node-red was still running...

13

Disable only prevents the service from being started automatically when the system is booted. It does not shut it down. That's why I said sudo reboot.

14

I have not configured node-red to start at system startup.

15

Well it is somehow configured to run automatically, and not using the normal startup script. What have you done on the device that is node red related?

16

I have confirmed that node-red is not running automatically when the Raspberry Pi starts up.

I don't recall making any changes related to starting node-red.
(or I forgot).

17

If you reboot and then try to open node red in the browser, do you see it? Refresh the page to make sure it is really there. If you do see it then obviously node-red is running. If you don't see it then what does the ss command show?
sudo ss -tulpn | grep 1880

If you do see node-red in the browser then what does this show?
ps -aux | grep -i "node"

Also, if you don't see it then try
node-red-start again.

18

We still have not seen the output of a clean startup of Node-red.

Something is odd about your installation since you say it doesn't automatically start at boot but when you try to start it, there is already a Node-red process using port 1880.

I don't disbelieve that you have confirmed it does not start automatically.
But things that jump to mind as possible causes for this behaviour include:
a) the systemd service (which is set up by the installation script) might be automatically restarting it.
b) whatever mechanism node-red-stop uses might have insufficient privileges to kill the process.
They both seem rather unlikely.

Getting back to the dashboard layout issue.

How wide are your dashboard groups? There are known problems with widths over about 30 units.

Please show us a screen capture of the layout editor when you have fixed the layout and another after you have deployed.

19

I cannot open node-red in my browser after rebooting.
So I ran "sudo ss -tulpn | grep 1880".

pi@raspberrypi:~ $ sudo ss -tulpn | grep 1880
pi@raspberrypi:~ $

I then ran "node-red-start" and then also "ps -aux | grep -i "node"".

pi@raspberrypi:~ $ ps -aux | grep -i "node"
pi 1493 0.0 0.0 4328 3004 pts/1 Ss+ 08:26 0:00 /bin/bash /usr/bin/node-red-start
pi 1506 18.2 2.2 201348 88796 pts/1 Sl+ 08:26 0:05 node-red
pi 1554 0.0 0.0 4024 564 pts/0 S+ 08:27 0:00 grep --color=auto -i node

20

The width of the dashboard group where the layout collapse is occurring is 6.
However, the total width of groups belonging to the same tab exceeds 30.

①. Display on normal dashboard screen
68747470733a2f2f71696974612d696d6167652d73746f72652e73332e61702d6e6f727468656173742d312e616d617a6f6e6177732e636f6d2f302f323630303237312f30396330313461322d393030622d383865302d393165662d3965613333303538316366382e706e67

②. Go to the layout editor from the ① state.

2

③. The layout settings are incorrect as follows
3

④. Display on a trial deployed dashboard with the layout settings in ③.
4

⑤. Make modifications on the layout editor and deploy.
5

6

⑥. When I go to the layout editor, the layout is broken again.
7

No matter how many times you repeat the process, it will be the same.