Skip to content

New Workflow button: blank canvas with NodeView error (direct URL works fine) #26069

@NozeDiveNeu

Description

@NozeDiveNeu

Describe the bug

When clicking the "New Workflow" button (+ icon in the top bar), the workflow is created successfully via API, but the canvas renders as a blank diagonal-striped area with no nodes visible and no ability to add nodes. The node sidebar is missing.

However, navigating directly to /workflow/new in the browser URL bar works perfectly — the canvas renders correctly and nodes can be added.

Similarly, opening the workflow created by the broken button via its direct URL (/workflow/{id}) also works fine.

To reproduce

  1. Log in to n8n
  2. Click the "+" / "New Workflow" button in the top navigation
  3. Observe: blank canvas with diagonal stripes, no node sidebar, no "Add first step" prompt
  4. Open browser console → see errors below

Workaround: Navigate directly to https://your-instance.com/workflow/new

Expected behavior

Clicking "New Workflow" should open the editor with a blank canvas and the ability to add nodes, identical to navigating to /workflow/new.

Console errors

GET https://n8n.example.com/rest/login 401 (Unauthorized)
POST https://n8n.example.com/rest/login 401 (Unauthorized)

Error: Could not resolve undefined
    at injectStrict (injectStrict-DRL1gb3N.js:4:23)
    at setup (NodeView-PtMtif7S.js:1656:22)
    at callWithErrorHandling (vue.runtime.esm-bundler-XtMkEjzB.js:1780:17)
    at setupStatefulComponent (vue.runtime.esm-bundler-XtMkEjzB.js:4936:23)
    at setupComponent (vue.runtime.esm-bundler-XtMkEjzB.js:4923:35)
    at mountComponent (vue.runtime.esm-bundler-XtMkEjzB.js:3889:3)
    at processComponent (vue.runtime.esm-bundler-XtMkEjzB.js:3883:8)
    at patch (vue.runtime.esm-bundler-XtMkEjzB.js:3714:28)
    at ReactiveEffect.componentUpdateFn [as fn] (vue.runtime.esm-bundler-XtMkEjzB.js:3973:5)
    at ReactiveEffect.run (vue.runtime.esm-bundler-XtMkEjzB.js:1337:17)

The 401 errors occur before login completes. The injectStrict error in NodeView suggests a Vue provide/inject dependency is not available when the component mounts during button-triggered navigation.

Environment

  • n8n version: 2.9.0 (also reproduced on 2.8.3)
  • Database: PostgreSQL
  • Running in: Docker (self-hosted) behind Traefik reverse proxy
  • OS: Debian (Docker host)
  • Browser: Chrome (also reproduced in Incognito mode)

What we ruled out

  • Not a browser extension issue (reproduced in Incognito)
  • Not an MFA issue (reproduced with MFA disabled)
  • Not a Task Runner issue (reproduced with N8N_RUNNERS_ENABLED=false)
  • Not a database issue (workflow is created successfully, existing workflows load fine)
  • Not a version issue (reproduced on both 2.8.3 and 2.9.0)
  • Not a CSP issue (no Content-Security-Policy headers present)
  • Not a cookie/proxy issue (N8N_SECURE_COOKIE=true, N8N_TRUST_PROXY=true behind Traefik)

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions