Skip to content

DEV: workflow node expression editor using CodeMirror#1634

Merged
jjaffeux merged 1 commit intodiscourse-workflowsfrom
discourse-workflows-codemirror
Apr 13, 2026
Merged

DEV: workflow node expression editor using CodeMirror#1634
jjaffeux merged 1 commit intodiscourse-workflowsfrom
discourse-workflows-codemirror

Conversation

@renato
Copy link
Copy Markdown
Collaborator

@renato renato commented Apr 13, 2026

Replaces the existing contenteditable` expression editor with a CodeMirror-based editor and adds a backend expression preview endpoint.

Expression editor

  • Syntax highlighting for {{ }} expressions with embedded JavaScript (variables, properties, strings, numbers, operators)
  • Autocompletion with ranked sections: $json, trigger, $vars, $site_settings, $current_user, $execution, $('Node Name') references, and JavaScript globals (Math, JSON, Object, etc.)
  • Type-aware method completions (string methods after a string value, array methods after an array, etc.)
  • Hover tooltips showing variable descriptions and property types
  • Argument info tooltips when the cursor is inside a function call
  • Auto-close {{ }} braces with immediate completion trigger
  • Drag-drop variable insertion from the context panel, context-aware (inserts bare variable inside {{ }}, wraps in {{ }} outside)
  • Unclosed expression validation with error decoration
  • Parent objects (e.g., post) are now draggable, not just leaf fields

Expression preview

  • Real-time backend evaluation via POST /expressions/evaluate with debounced requests
  • Builds evaluation context from declared node output schemas — works without any past execution data
  • Overlays real values from the most recent successful execution when available
  • Node-aware: $json reflects the upstream node's output, not just the trigger's
  • Distinguishes undefined paths, invalid JavaScript, uncalled functions, and empty expressions with distinct labels and styling

Core CodeMirror infrastructure

  • Generic codemirror-editor.gjs component with @extension callback for domain-specific behavior
  • {{ }} Lezer grammar with mixed JavaScript parser, reusable for email templates, onebox templates, or any {{ }} surface
  • JavaScript method completion data and syntax tree utilities as shared expression utils
  • Single lazy loader to async load the CodeMirror editor
image

@github-actions github-actions Bot added the i18n label Apr 13, 2026
@renato renato force-pushed the discourse-workflows-codemirror branch 2 times, most recently from 2e34390 to 2dd7680 Compare April 13, 2026 15:38
@renato renato force-pushed the discourse-workflows-codemirror branch from 2dd7680 to 6aa4791 Compare April 13, 2026 20:42
@jjaffeux jjaffeux merged commit d376c46 into discourse-workflows Apr 13, 2026
6 of 16 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants