Microsoft/monaco-editor

Monarch definition of shell language breaks bash syntax highlighting with some command substitutions

Open

#1984 aperta il 27 mag 2020

Vedi su GitHub
 (6 commenti) (2 reazioni) (0 assegnatari)JavaScript (1283 fork)batch import
buggrammarshelp wanted

Metriche repository

Star
 (14.836 star)
Metriche merge PR
 (Merge medio 6h 26m) (15 PR mergiate in 30 g)

Descrizione

monaco-editor version: 0.20.0 (assuming that's the version on the playground) Browser: Chrome OS: Windows Playground code that reproduces the issue:

monaco.editor.create(document.getElementById("container"), {
	value: "function sample-highlight() {\n  echo \"the echo command looks different from this quoted text,\"\n  loc_formatted=$(echo \"WORD\" | awk \'{print tolower($0)}\')\n  echo \"this echo command is the same color as this text\"\n}\n\nfunction still() {\n  echo \"the issue extends out of the scope of that function\"\n}\n",
	language: "shell"
});

I ran into an issue that can be reproduced by displaying the following bash in the Monaco editor, but not VS code:

function sample-highlight() {
  echo "the echo command looks different from this quoted text,"
  loc_formatted=$(echo "WORD" | awk '{print tolower($0)}')
  echo "this echo command SHOULD look different from this text"
}

function still() {
  echo "the issue extends out of the scope of that function"
}

If typed into Visual Studio Code, version info below,

Version: 1.42.1 (system setup)
Commit: c47d83b293181d9be64f27ff093689e8e7aed054
Date: 2020-02-11T14:45:59.656Z
Electron: 6.1.6
Chrome: 76.0.3809.146
Node.js: 12.4.0
V8: 7.6.303.31-electron.0
OS: Windows_NT x64 10.0.18363

that text renders correctly, like so: image

If you create a file called sample.sh in the visual studio code playground (version info below),

Version: 1.46.0-insider
Commit: b26e0bcf39c1b8faaf770265391b5a387d1d9172
Date: 2020-05-26T15:43:08.115Z (product build time)
Browser: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.61 Safari/537.36

and add bash in question, it will again render correctly: image

However, if navigate to the monaco homepage at https://microsoft.github.io/monaco-editor/index.html and select shell, then paste in the sample functions, the syntax highlighting breaks image

If you visit the Monaco playground and add this command:

monaco.editor.create(document.getElementById("container"), {
	value: "function sample-highlight() {\n  echo \"the echo command looks different from this quoted text,\"\n  loc_formatted=$(echo \"WORD\" | awk \'{print tolower($0)}\')\n  echo \"this echo command is the same color as this text\"\n}\n\nfunction still() {\n  echo \"the issue extends out of the scope of that function\"\n}\n",
	language: "shell"
});

after clicking "run" you get an instance of incorrect highlighting on the right-hand side: image

I discovered this issue while using Azure DevOps, where it shows up if you edit a file with a .sh ending: image

I've been working on an MS-internal repo full of bash lately, and this bug has been making it a little tricky to review pull requests there.

Guida contributor