Microsoft/monaco-editor

Invalid completion items when using dots in completion item label

Open

#2,136 opened on Sep 17, 2020

View on GitHub
 (3 comments) (0 reactions) (0 assignees)JavaScript (14,836 stars) (1,283 forks)batch import
bughelp wantedsuggesttypescript

Description

monaco-editor version: 0.20.0 Browser: Chrome OS: Windows Playground code that reproduces the issue:

function getSuggestions(range) {
    return [
        {
            label: 'parameters.In1',
            kind: monaco.languages.CompletionItemKind.Field,
            insertText: 'parameters.In1',
            insertTextRules: null,
            range: range
        }
    ];
}


monaco.languages.registerCompletionItemProvider('javascript', {
    provideCompletionItems: function(model, position) {
        return {
            suggestions: getSuggestions(null)
        };
    }
});

monaco.editor.create(document.getElementById("container"), {
    language: "javascript"
});

I was only able to reproduce this when registering a completion item provider which return completion items with dots in the label/insertText.

Repro steps:

  1. Execute the code above
  2. Type param and choose the option parameters.In1
  3. Type again type Result: The completion menu shows an option "parameters" which was not returned by my provider neither exists in the Javascript language.

See the gif below: issue-autocomplete2

Contributor guide

Tech stack
typescriptjavascript
Domain
frontend
Issue type
bug
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
Basic understanding of monaco editor completion APIJavaScript/TypeScript
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
45
Research direction
Review the completion provider logic in monaco editor, specifically how completion items with dots are handled. The issue occurs when a completion item label contains dots, causing the editor to incorrectly suggest fragments. Look at the code that processes completion items, likely in the language feature implementation. Check if similar issues exist in the VS Code repository as monaco editor shares some code.