microsoft / microsoft/monaco-editor
[Bug] TypeScript string autocomplete works in VS Code but not Monaco
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 46.8k
- Forks
- 4.1k
- Avg merge
- 17h 58m
- Merged PRs (30d)
- 1
Description
Reproducible in vscode.dev or in VS Code Desktop?
- Not reproducible in vscode.dev or VS Code Desktop
Reproducible in the monaco editor playground?
- Not reproducible in the monaco editor playground
Monaco Editor Playground Link
Try typing document.addEventListener(" in both VS Code and the Monaco playground, with either JavaScript or TypeScript. In VS Code autocomplete shows a list of allowed event names. In Monaco there is no such suggestion.
This occurs in general with any string parameters - for example if a TypeScript function parameter type is "MyString1" | "MyString2", VS Code will autocomplete suggest those strings, but Monaco does not suggest anything.
Monaco Playground link demonstrating the problem
Monaco Editor Playground Code
// Most minimal repro:
type AllowedStrings = "MyString1" | "MyString2";
function test2(str : AllowedStrings) {}
// Then try typing: test2("
Reproduction Steps
With the most minimal repro code snippet shown previously, try typing:
test2("
Actual (Problematic) Behavior
In Monaco, no autocomplete is shown for the string parameter.
Expected Behavior
In VS Code, autocomplete is shown for the string parameter, suggesting the allowed strings "MyString1" and "MyString2". This is what Monaco should do as well.
Additional Context
Monaco is able to use the type information to correctly validate parameters - for example test2("MyString1") is allowed, and test2("invalid") is correctly marked as an error. So it seems the type information is there and working, it's just not being provided to autocomplete.
This issue makes it significantly harder to write common calls like addEventListener in Monaco outside of VS Code: autocompleting the allowed strings is very useful, and avoids the need for trial-and-error to get the right string.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the linked Monaco Playground reproduction and the minimal TypeScript union-string example, then trace how Monaco handles autocomplete for string parameters compared with VS Code. The work is done when typing test2(" and document.addEventListener(" produces the allowed string suggestions without breaking existing validation.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- frontend, tooling
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Quiet
- Clarity
- Clearly specified
- Newbie friendliness
- 68/100