N8n Workflow Agent Extension

n8n Agentic Chat

n8n - Transform your workflow creation with AI-powered agentic assistance

An intelligent Chrome extension that brings Cursor-style agentic workflow editing to n8n. Create, modify, analyze, and debug workflows using natural language with multi-step autonomous execution.

n8n Agentic Chat Demo


:sparkles: Features

:robot: Agentic Multi-Step Execution

  • Autonomous workflow creation: AI automatically executes ALL required steps until completion
  • Multi-step planning: AI breaks down complex requests into actionable steps
  • Continuous execution: Never stops mid-task - completes the entire workflow automatically
  • Smart continuation: Context-aware guidance after each function execution

:artist_palette: Modern Chat Interface

  • Glassmorphism design with animated gradients and smooth transitions
  • Real-time streaming responses with typing effect
  • Function execution badges with status icons and animations
  • Smart timestamps with automatic message grouping
  • Drag-and-drop positioning with persistent layout
  • Enhanced markdown support (code blocks, links, formatting)

:brain: Intelligent Workflow Management

  • Create workflows from natural language descriptions
  • Modify existing nodes with context-aware updates
  • Analyze workflows for architecture, performance, and security issues
  • Debug workflows with integrated real-time logging
  • Auto-fix issues detected during analysis
  • Smart node selection: Prefers dedicated service nodes over generic HTTP requests

:link: Advanced Connection Handling

  • Automatic connection of newly created nodes
  • Ghost connection cleanup prevents workflow corruption
  • Vue reactivity sync eliminates race conditions
  • Connection verification ensures workflow integrity

:bullseye: Multi-Provider AI Support

  • OpenAI (GPT-4, GPT-3.5, o1, o3)
  • Anthropic (Claude 3.5 Sonnet, Opus, Haiku)
  • Google (Gemini 2.5 Pro, Flash)
  • DeepSeek (DeepSeek R1, DeepSeek Chat)
  • OpenRouter (Meta Llama, Mistral, and more)
  • Groq (Ultra-fast inference)
  • Cohere (Command models)
  • Local LLM (Ollama, LM Studio, etc.)

:wrench: Real-Time Debugging

  • Integrated debug server with WebSocket support
  • Function call logging with full argument tracking
  • Error tracking with stack traces and context
  • Session summaries with operation metrics
  • Toggle on/off directly from extension popup

:globe_showing_europe_africa: Language Consistency

  • Automatic language detection: Responds in the same language as user’s input
  • Supports Turkish, English, Spanish, and more
  • Never switches languages mid-conversation

:rocket: Installation

Prerequisites

  • Google Chrome or Chromium-based browser (Edge, Brave, etc.)
  • n8n instance (cloud or self-hosted)
  • API key from one of the supported AI providers (optional for local LLM)

Install from Chrome Web Store

  1. Visit the [Chrome Web Store](coming soon)
  2. Click β€œAdd to Chrome”
  3. Pin the extension to your toolbar

Install from Source

  1. Clone the repository:

    git clone https://github.com/eros1sh/n8n-workflow-agent.git
    cd n8n-workflow-agent
    
  2. Load the extension in Chrome:

    • Open Chrome and navigate to chrome://extensions/
    • Enable β€œDeveloper mode” (top right)
    • Click β€œLoad unpacked”
    • Select the extension folder
  3. Configure your API keys:

    • Click the extension icon in your toolbar
    • Go to Settings β†’ API tab
    • Select your preferred AI provider
    • Enter your API key
    • Click β€œSave”

:open_book: Usage

Getting Started

  1. Navigate to n8n:

    • Open your n8n workflow editor (e.g., https://app.n8n.cloud/workflow/...)
  2. Activate the extension:

    • Click the extension icon
    • Click β€œActivate on Current Page”
    • A floating chat button will appear in the bottom right
  3. Start chatting:

    • Click the floating chat button (:speech_balloon:)
    • Type your request in natural language
    • Press Enter or click β€œSend”

Example Prompts

Create Workflows

Create a workflow that:
- Gets data from Supabase
- Summarizes content with AI
- Sends result to Telegram

Modify Workflows

Replace all Google Sheets nodes with Supabase nodes

Analyze Workflows

Analyze this workflow for performance and security issues

Debug Workflows

Why isn't my webhook trigger working?

Get Information

Show me the workflow structure and connections

:bullseye: Key Concepts

Agentic Execution Model

The extension operates in agentic mode, meaning it autonomously executes multiple steps to complete complex tasks:

  1. User Request: β€œReplace Google Sheets with Supabase”
  2. AI Planning: Breaks down into steps:
    • Get workflow info
    • Remove Google Sheets nodes
    • Create Supabase nodes
    • Connect new nodes
    • Clean layout
    • Validate workflow
  3. Autonomous Execution: AI executes ALL steps sequentially without stopping
  4. Verification: AI confirms completion and reports results

No manual intervention required - the AI handles the entire workflow lifecycle.

Smart Node Selection

The AI automatically prefers dedicated service nodes over generic HTTP requests:

User Intent Selected Node Type
β€œUse OpenAI” @n8n/n8n-nodes-langchain.openAi
β€œConnect to Supabase” n8n-nodes-base.supabase
β€œSend to Telegram” n8n-nodes-base.telegram
β€œGoogle Sheets” n8n-nodes-base.googleSheets
β€œPostgreSQL database” n8n-nodes-base.postgres

HTTP Request node is used ONLY when no dedicated node exists.

Connection Management

Every created node is automatically connected to the workflow:

Trigger β†’ Processing β†’ AI/Logic β†’ Storage/Output

Rules enforced:

  • No floating/orphan nodes
  • Logical flow maintained
  • All connections verified
  • Ghost connections cleaned up

:hammer_and_wrench: Configuration

Chat Settings

Navigate to Settings β†’ Chat:

  • Include Workflow Context: Send current workflow data with each request
  • Node Creation: Allow AI to create new nodes
  • Node Editing: Allow AI to modify node parameters
  • Node Removal: Allow AI to delete nodes
  • Workflow Access: Allow AI to read workflow information
  • Node Library Access: Allow AI to browse available node types

Advanced Settings

  • Temperature (0.0 - 1.0): Controls response creativity (lower = deterministic, higher = creative)
  • Max Tokens: Maximum tokens for AI response (higher = longer responses, more expensive)
  • Top P (0.0 - 1.0): Controls response diversity
  • Reasoning Level: For reasoning models (o1, o3) - low/medium/high

:bug: Debugging

Enable Debug Mode

  1. Open extension popup
  2. Navigate to β€œDebug” tab
  3. Toggle β€œEnable Debug API”
  4. Chat will now log all function calls and responses

Debug Server (Optional)

For advanced debugging with WebSocket support:

cd debug-server
npm install
node server.js

The debug server runs on http://localhost:3456 and provides:

  • Real-time function call logging
  • Error tracking with stack traces
  • Session summaries
  • WebSocket streaming

:building_construction: Architecture

β”Œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”
β”‚              Chrome Extension                    β”‚
β”œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€
β”‚  content.js  β”‚  Modern Chat UI & Stream Handler β”‚
β”‚  injected.js β”‚  n8n Canvas Manipulation          β”‚
β”‚  popup.js    β”‚  Settings & Configuration         β”‚
β”‚  background/ β”‚  API Handlers (Multi-Provider)    β”‚
β””β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”˜
                    ↕ (Function Calls)
β”Œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”
β”‚              n8n Workflow Editor                 β”‚
β”œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€
β”‚  Vue.js App  β”‚  Pinia Store  β”‚  Canvas Operationsβ”‚
β””β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”˜

Key Components

  • content.js: Chat UI, message streaming, conversation history
  • injected.js: Direct n8n canvas manipulation, node CRUD, connection management
  • popup.js: Extension settings, API configuration, debug controls
  • background/api-handlers.js: Multi-provider AI streaming handlers
  • lib/storage.js: Secure Chrome storage for settings and API keys

:locked: Security & Privacy

Data Handling

  • API keys are stored securely in Chrome’s encrypted storage
  • No telemetry or usage tracking
  • No server-side processing - all AI requests go directly to your chosen provider
  • Local-first: Chat history stored locally in your browser

Permissions Explained

  • storage: Save settings and API keys locally
  • scripting: Inject content scripts into n8n pages
  • tabs: Detect n8n workflow pages
  • activeTab: Access current tab for activation
  • host_permissions: Connect to AI provider APIs and local debug server

What is Sent to AI Providers?

  • Your workflow structure (nodes, connections, parameters) - only when β€œInclude Workflow Context” is enabled
  • Your chat messages
  • Function call results

What is NOT sent:

  • Credentials or API keys stored in your workflows
  • Sensitive data (masked automatically)
  • Your IP address or personal information (beyond what the AI provider collects)

:handshake: Contributing

Contributions are welcome! Please read CONTRIBUTING.md for details on our code of conduct and the process for submitting pull requests.

Development Setup

  1. Clone the repo:

    git clone https://github.com/eros1sh/n8n-workflow-agent.git
    cd n8n-workflow-agent
    
  2. Install debug server dependencies (optional):

    cd debug-server
    npm install
    
  3. Load extension in Chrome:

    • Enable Developer mode in chrome://extensions/
    • Click β€œLoad unpacked” and select the extension folder
  4. Make your changes

  5. Test thoroughly on n8n workflows

  6. Submit a pull request


:bug: Known Issues & Limitations

  • Vue Store Access: The extension relies on n8n’s internal Vue/Pinia store structure. Future n8n updates may break compatibility temporarily.
  • Race Conditions: Fixed with waitForVueUpdate(), but edge cases may exist.
  • Token Limits: Large workflows may exceed model context windows. Use β€œLazy Loading” context strategy or disable β€œNode Library Access”.
  • Language Switching: AI may occasionally switch languages mid-conversation (rare, fixed in v1.4.2).

:scroll: License

This project is licensed under the MIT License - see the LICENSE file for details.


:folded_hands: Acknowledgments

  • n8n for building an amazing workflow automation platform
  • OpenAI, Anthropic, Google for providing powerful AI models
  • Cursor for inspiring the agentic execution model
  • The n8n Community for feedback and feature requests

:star: Star History

If you find this project useful, please consider giving it a star! :star:


:camera_with_flash: Screenshots

Chat Interface

Chat Interface

Settings

Settings


Made with ❀️ for the n8n community