Issue with Closing Node Detail Page in n8n Workflow

[Raymondhou0917]

Hi,

I encountered a serious issue while renaming a filter node using a Chinese phonetic input method. After pressing enter, it automatically opened the filter node’s detail page, and now I am unable to close the current window (node detail page).

Regardless of refreshing the page, navigating back and reopening the workflow, or restarting my self-deployed n8n instance, as soon as I enter this workflow page, I am stuck on the current window with no ability to perform any actions. Even the “back to canvas” button in the top left corner is unresponsive.

I have recorded a screen capture of the issue using CleanShotX: CleanShot 2024-05-24 at 00.47.18 · CleanShot Cloud

Could you please advise on how to resolve this? I desperately need support as this workflow contains a lot of important settings.

Thank you!

Information on your n8n setup

• n8n version: 1.42.1
• Database (default: SQLite): Post greSQL
• n8n EXECUTIONS_PROCESS setting (default: own, main):
• Running n8n via (Docker, npm, n8n cloud, desktop app): zeabur
• Operating system:

[Raymondhou0917]

Additionally, even if I duplicate the workflow and enter the duplicated version, the same issue occurs. This confirms that it is likely a bug in n8n itself. Here is another screen recording showing the issue: CleanShot 2024-05-24 at 01.01.50 · CleanShot Cloud

Console errors include:

Unchecked runtime.lastError: The message port closed before a response was received.
inject.js:1 [Deprecation] Listener added for a 'DOMNodeInserted' mutation event. This event type is deprecated, and will be removed from this browser very soon. Usage of this event listener will cause performance issues today, and represents a large risk of future site breakage. Consider using MutationObserver instead. See https://chromestatus.com/feature/5083947249172480 for more information.
NodeView-8Nd44_r7.js:8 TypeError: Cannot read properties of null (reading 'id')
    at Proxy.node (NodeView-8Nd44_r7.js:8:12830)
    at Ze (vendor-KLOX9vbo.js:13:1373)
    at ke (vendor-KLOX9vbo.js:13:1443)
    at I (vendor-KLOX9vbo.js:13:12595)
    at fo (vendor-KLOX9vbo.js:13:2672)
    at X (vendor-KLOX9vbo.js:13:42496)
    at Xt.A [as fn] (vendor-KLOX9vbo.js:13:41510)
    at Xt.run (vendor-KLOX9vbo.js:9:1517)
    at d.update (vendor-KLOX9vbo.js:13:42352)
    at ce (vendor-KLOX9vbo.js:13:41254)

[barn4k]

Have you tried to clear the cookies? And is the issue persists if you rename the filter node and set some name?

Plus can you share the workflow itself?

[Raymondhou0917]

Update: I found a workaround to bypass this bug!

By using the browser’s Inspect tool, I manually deleted the HTML elements blocking the UI. Specifically, I removed the
<div class="el-overlay" style="z-index: 2009;">...</div>
element as shown in the attached screenshot. This allowed me to interact with the workflow and rename the filter node, resolving the issue.

It seems that if the node name is blank, it causes the UI to get stuck. This might be a significant bug.

Thank you for your assistance!