fix(bloblang): Fix autocomplete for functions and methods

- Fix type mismatch in getCompletions() for functionSpecWithHTML/methodSpecWithHTML
- Improve autocompletion suggestions for Bloblang keywords
- Add tests to verify completion types and structure

Signed-off-by: Ramtin Mesgari <26694963+iamramtin@users.noreply.github.com>

Author: iamramtin

internal/cli/blobl/core.go

@@ -319,12 +319,9 @@ func generateAutocompletion(env *bloblang.Environment, req AutocompletionRequest
 
 	// Determine context: method vs function/keyword context
 	isMethodContext := regexp.MustCompile(`\.\w*$`).MatchString(req.BeforeCursor)
-
 	if isMethodContext {
-		// Add method completions
 		completions = append(completions, getCompletions(syntaxData.Methods)...)
 	} else {
-		// Add function and keyword completions
 		completions = append(completions, getCompletions(syntaxData.Functions)...)
 		completions = append(completions, getKeywordCompletions()...)
 	}

internal/cli/blobl/core_test.go

@@ -221,45 +221,76 @@ func TestGenerateAutocompletion(t *testing.T) {
 	env := bloblang.GlobalEnvironment()
 
 	tests := []struct {
-		name        string
-		request     AutocompletionRequest
-		expectError bool
+		name                string
+		request             AutocompletionRequest
+		expectError         bool
+		expectCompletions   bool
+		expectKeywords      bool
+		expectFunctions     bool
+		expectMethods       bool
+		minCompletions      int
 	}{
 		{
-			name: "function context",
+			name: "function context - should return functions and keywords",
 			request: AutocompletionRequest{
 				Line:         "root = ",
 				Column:       7,
 				BeforeCursor: "root = ",
 			},
-			expectError: false,
+			expectError:       false,
+			expectCompletions: true,
+			expectKeywords:    false, // Keywords only show when typing keyword prefix
+			expectFunctions:   true,
+			expectMethods:     false,
+			minCompletions:    10, // Should have many function completions
 		},
 		{
-			name: "method context with dot",
+			name: "method context - should return methods only",
 			request: AutocompletionRequest{
 				Line:         "root = this.u",
 				Column:       13,
 				BeforeCursor: "root = this.u",
 			},
-			expectError: false,
+			expectError:       false,
+			expectCompletions: true,
+			expectKeywords:    false,
+			expectFunctions:   false,
+			expectMethods:     true,
+			minCompletions:    5, // Should have method completions (uppercase, etc.)
 		},
 		{
-			name: "invalid column",
+			name: "keyword context - should return keywords",
+			request: AutocompletionRequest{
+				Line:         "ro",
+				Column:       2,
+				BeforeCursor: "ro",
+			},
+			expectError:       false,
+			expectCompletions: true,
+			expectKeywords:    true,
+			expectFunctions:   true,
+			expectMethods:     false,
+			minCompletions:    1,
+		},
+		{
+			name: "invalid column - should fail",
 			request: AutocompletionRequest{
 				Line:         "root = this",
 				Column:       -1,
 				BeforeCursor: "",
 			},
-			expectError: true,
+			expectError:       true,
+			expectCompletions: false,
 		},
 		{
-			name: "inside comment",
+			name: "inside comment - should return empty",
 			request: AutocompletionRequest{
 				Line:         "# comment",
 				Column:       5,
 				BeforeCursor: "# com",
 			},
-			expectError: false,
+			expectError:       false,
+			expectCompletions: false,
 		},
 	}
 
@@ -271,12 +302,59 @@ func TestGenerateAutocompletion(t *testing.T) {
 				t.Errorf("generateAutocompletion() success = %v, expectError = %v", result.Success, tt.expectError)
 			}
 
-			if !tt.expectError && len(result.Completions) > 0 {
-				// Check that completions have DocHTML when present
+			if tt.expectCompletions {
+				if len(result.Completions) < tt.minCompletions {
+					t.Errorf("Expected at least %d completions, got %d", tt.minCompletions, len(result.Completions))
+				}
+
+				// Verify completion structure
 				for _, comp := range result.Completions {
+					if comp.Caption == "" {
+						t.Error("Completion missing Caption")
+					}
+					if comp.Type == "" {
+						t.Error("Completion missing Type")
+					}
 					if comp.DocHTML == "" {
-						t.Error("Completion missing DocHTML field")
+						t.Error("Completion missing DocHTML")
+					}
+					if comp.Meta == "" {
+						t.Error("Completion missing Meta")
 					}
+					// Either Value or Snippet should be set
+					if comp.Value == "" && comp.Snippet == "" {
+						t.Error("Completion missing both Value and Snippet")
+					}
+				}
+
+				// Verify expected types are present
+				hasKeyword := false
+				hasFunction := false
+				hasMethod := false
+
+				for _, comp := range result.Completions {
+					switch comp.Type {
+					case "keyword":
+						hasKeyword = true
+					case "function":
+						hasFunction = true
+					case "method":
+						hasMethod = true
+					}
+				}
+
+				if tt.expectKeywords && !hasKeyword {
+					t.Error("Expected keyword completions but found none")
+				}
+				if tt.expectFunctions && !hasFunction {
+					t.Error("Expected function completions but found none")
+				}
+				if tt.expectMethods && !hasMethod {
+					t.Error("Expected method completions but found none")
+				}
+			} else {
+				if len(result.Completions) > 0 {
+					t.Errorf("Expected no completions, got %d", len(result.Completions))
 				}
 			}
 		})

internal/cli/blobl/editor.go

@@ -59,18 +59,17 @@ func getKeywordCompletions() []CompletionItem {
 		name        string
 		description string
 		score       int
-		category    string
 	}{
-		{"root", "The root of the output document", 950, "core"},
-		{"this", "The current context value", 950, "core"},
-		{"if", "Conditional expression", 900, "control"},
-		{"match", "Pattern matching expression", 900, "control"},
-		{"let", "Variable assignment", 880, "variable"},
-		{"map", "Create named mapping", 870, "mapping"},
-		{"else", "Alternative branch", 850, "control"},
-		{"import", "Import external mapping", 800, "mapping"},
-		{"meta", "Access message metadata", 820, "metadata"},
-		{"deleted", "Delete the current field", 750, "mutation"},
+		{"root", "The root of the output document", 950},
+		{"this", "The current context value", 950},
+		{"if", "Conditional expression", 900},
+		{"match", "Pattern matching expression", 900},
+		{"let", "Variable assignment", 880},
+		{"map", "Create named mapping", 870},
+		{"else", "Alternative branch", 850},
+		{"import", "Import external mapping", 800},
+		{"meta", "Access message metadata", 820},
+		{"deleted", "Delete the current field", 750},
 	}
 
 	var completions []CompletionItem
@@ -81,16 +80,15 @@ func getKeywordCompletions() []CompletionItem {
 				<div class="ace-doc-header">
 					<div class="ace-doc-signature">
 						<strong>%s</strong>
-						<span class="ace-keyword-category">%s</span>
 					</div>
 				</div>
 				<div class="ace-doc-description">%s</div>
-			</div>`, keyword.name, keyword.category, keyword.description)
+			</div>`, keyword.name, keyword.description)
 
 		completions = append(completions, CompletionItem{
 			Caption:     keyword.name,
 			Value:       keyword.name,
-			Meta:        keyword.category,
+			Meta:        "keyword",
 			Type:        "keyword",
 			Score:       keyword.score,
 			Description: keyword.description,
@@ -101,32 +99,31 @@ func getKeywordCompletions() []CompletionItem {
 	return completions
 }
 
-// getCompletions converts function/method specs into autocompletion items.
-// Uses type switch to handle both FunctionSpec and MethodSpec maps.
+// getCompletions converts function/method specs with HTML into autocompletion items.
 func getCompletions(specs any) []CompletionItem {
 	var completions []CompletionItem
 
 	switch s := specs.(type) {
-	case map[string]query.FunctionSpec:
+	case map[string]functionSpecWithHTML:
 		for name, spec := range s {
 			completions = append(completions, buildCompletionItem(
 				name,
-				FunctionSpecWrapper{spec},
+				FunctionSpecWrapper{spec.FunctionSpec},
 				spec.Category,
 				"function",
 				false, // isMethod
 			))
 		}
 
-	case map[string]query.MethodSpec:
+	case map[string]methodSpecWithHTML:
 		for name, spec := range s {
 			category := "general"
 			if len(spec.Categories) > 0 {
 				category = spec.Categories[0].Category
 			}
 			completions = append(completions, buildCompletionItem(
 				name,
-				MethodSpecWrapper{spec},
+				MethodSpecWrapper{spec.MethodSpec},
 				category,
 				"method",
 				true, // isMethod
@@ -139,6 +136,11 @@ func getCompletions(specs any) []CompletionItem {
 
 // buildCompletionItem creates a CompletionItem from a spec wrapper.
 func buildCompletionItem(name string, spec Spec, category, itemType string, isMethod bool) CompletionItem {
+	// Use "general" as default if no category provided
+	if category == "" {
+		category = "general"
+	}
+
 	item := CompletionItem{
 		Caption:     name,
 		Meta:        category,

internal/cli/blobl/playground/assets/css/components.css

@@ -15,7 +15,7 @@
     padding: 6px 12px;
     font-size: 13px;
   }
-  
+
   .panel {
     border-radius: 4px;
     box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
@@ -109,7 +109,8 @@ body.embedded .status-badge {
   font-family: var(--bento-font-family);
   box-shadow: var(--bento-shadow-3d);
   transform: translateY(0);
-  transition: transform var(--bento-transition-fast), box-shadow var(--bento-transition-fast),
+  transition: transform var(--bento-transition-fast),
+    box-shadow var(--bento-transition-fast),
     background-color var(--bento-transition-fast);
   margin-left: 4px;
 }
@@ -581,18 +582,15 @@ body.embedded .status-badge {
   }
 }
 
-/* ===================================================================
-   Notifications
-   =================================================================== */
-
+/* Notifications */
 .notification {
   position: fixed;
   top: 20px;
   right: 20px;
   padding: 12px 16px;
   border-radius: 6px;
   border: 1px solid;
-  font-family: 'IBM Plex Sans', sans-serif;
+  font-family: "IBM Plex Sans", sans-serif;
   font-size: 13px;
   font-weight: 500;
   z-index: 1000;
@@ -608,25 +606,25 @@ body.embedded .status-badge {
 }
 
 .notification-success {
-  background: #E8F5E8;
-  color: #2E7D32;
-  border-color: #2E7D32;
+  background: #e8f5e8;
+  color: #2e7d32;
+  border-color: #2e7d32;
 }
 
 .notification-error {
-  background: #FFEBEE;
-  color: #D32F2F;
-  border-color: #D32F2F;
+  background: #ffebee;
+  color: #d32f2f;
+  border-color: #d32f2f;
 }
 
 .notification-warning {
-  background: #FFF3E0;
-  color: #F57C00;
-  border-color: #F57C00;
+  background: #fff3e0;
+  color: #f57c00;
+  border-color: #f57c00;
 }
 
 .notification-info {
-  background: #FDE5D8;
+  background: #fde5d8;
   color: #553630;
-  border-color: #EB8788;
+  border-color: #eb8788;
 }

internal/cli/blobl/playground/assets/css/editor.css

@@ -50,7 +50,7 @@
   .ace-bento .ace_cursor {
     margin-left: 3px;
   }
-  
+
   .ace-bento .ace_marker-layer .ace_bracket {
     margin-left: 2.5px;
   }
@@ -62,11 +62,11 @@
     font-size: 12px !important;
     line-height: 1.4 !important;
   }
-  
+
   .editor {
     min-height: 80px !important;
   }
-  
+
   .formatter-section {
     padding: 4px 8px;
     font-size: 11px;