microsoft / microsoft/monaco-editor
[Bug] monaco.editor.colorize does not work as expected with json language
@alexdima is already working on this.
Since Jul 19, 2022.
- 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 Code
I don't know how to reproduce this issue in VS Code Desktop
How to reproduce the bug
Go to playground: https://microsoft.github.io/monaco-editor/playground.html#creating-the-editor-syntax-highlighting-for-html-elements
Replace the code in the JavaScript tab with this:
const jsonCode = `{ "some": "body once told me" }`;
const language = "json";
monaco.editor.colorize(jsonCode, language, { tabSize: 2 }).then((code) => {
document.getElementById('code').innerHTML = code;
console.log(code)
});
Actual Behavior
no syntax highlighting for JSON — this is the output I get (HTML):
<span><span class="mtk1">{ "some": "body once told me" }</span></span><br/>
Expected Behavior
syntax highlighted JSON output
Additional Context
If you change const language = "json"; to const language = "javascript"; it works though, it gives the expected output:
<span><span class="mtk1">{ </span><span class="mtk20">"some"</span><span class="mtk1">: </span><span class="mtk20">"body once told me"</span><span class="mtk1"> }</span></span><br/>
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.
Assessment
This issue has not been assessed yet.