This Visual Studio Code extension reveals some characters that can be harmful because they are invisible or looking like legitimate ones.
- When there is a zero-width space in the code, the extension shows a red bar
- When there is a zero-width non-joiner in the code, the extension shows a red bar
- A few characters that can be harmful have a light red or orange background
- Non-breaking spaces
- Left and right double quotation marks
- Move the cursor over the character to have a hint of the potential issue
- A gremlin icon is shown in the gutter for every line that contains at least one of these characters
You can also use the “Unicode code point of current character” extension to show information about the character under cursor in the status bar.
You can configure the list of characters and how they are shown under user settings key gremlins.characters.
Please help enhance the extension by suggesting new default characters, through Pull Requests or Issues.
By default, gremlins will be highligted in the text editor and an icon will be displayed in the gutter for each line with at least one gremlin. You can toggle whether gremlins also show in the Problems pane with user settings key gremlins.showInProblemPane.
VS Code Gremlins was initialy heavily inspired by Sublime Gremlins, a Sublime Text 3 plugin to help identify invisible and ambiguous Unicode whitespace characters (zero width spaces, no-break spaces, and similar.).
I later discovered the “Gremlins” name had already been used a long time before, in some editors:
Bare Bones Software's famous BBEdit HTML and text editor for macOS has a “Zap Gremlins” feature since its first public release April 12th, 1992!
Here's how it looks in recent versions:
It looks like people liked this feature so much that they made a dedicated website, unfortunately not anymore. Thanks Archive.org for the cached version:
