Integrated Terminal: Spaces in Right Prompt immediately after Powerline character do not render in the correct color

[j0hnm4r5]

Spaces in Right Prompt immediately after Powerline character do not render in the correct color in the integrated terminal.

Example

• VSCode Version: 1.22.1
• OS Version: macOS 10.13.4
• ZSH Prompt: Powerlevel9k w/ Nerdfonts

Steps to Reproduce:

1. Use a ZSH theme with a right prompt
2. Visually check integrated terminal for issue

Does this issue occur when all extensions are disabled?: Yes

[Tyriar]

What's in your settings.json?

[j0hnm4r5]

Nothin I can see being an issue:

{
    // fonts & themes =========
    "editor.fontFamily": "Operator Mono Lig, Operator Mono, Fira Code, monospace",
    "editor.fontLigatures": true,
    "editor.fontSize": 14,
    "workbench.colorTheme": "One Dark Rain Coat",
    "terminal.integrated.fontFamily": "Hurmit Nerd Font",
    "terminal.integrated.fontSize": 14,
    "workbench.iconTheme": "seti",

    // editor =========
    "window.zoomLevel": -1,
    "editor.renderWhitespace": "boundary",
    "editor.insertSpaces": false,
    "editor.formatOnSave": true,
    "editor.formatOnPaste": true,
    "editor.multiCursorModifier": "alt",
    "editor.snippetSuggestions": "top",
    "editor.renderIndentGuides": true,
    "workbench.startupEditor": "newUntitledFile",
    "files.autoSave": "onFocusChange",
    "npm.packageManager": "yarn",
    "npm.enableScriptExplorer": true,
    "explorer.confirmDelete": false,
    "explorer.confirmDragAndDrop": false,
    "extensions.ignoreRecommendations": true,
    "extensions.showRecommendationsOnlyOnDemand": true,
    "files.associations": {
        "*.js": "javascript"
    },

    // =========
    //  plugins 
    // =========

    // bracket pair colorizer =========
    "bracketPairColorizer.consecutivePairColors": [
        "()",
        "[]",
        "{}",
        [
            "#ff5c57",
            "#f3f99d",
            "#5af78e",
            "#57c7ff",
            "#ff6ac1"
        ],
        "#ff5c57"
    ],

    // sync =========
    "sync.gist": "REDACTED",
    "sync.lastUpload": "2018-05-11T20:15:19.865Z",
    "sync.autoDownload": false,
    "sync.autoUpload": true,
    "sync.lastDownload": "",
    "sync.forceDownload": false,
    "sync.host": "",
    "sync.pathPrefix": "",
    "sync.quietSync": false,
    "sync.askGistName": false,
    "sync.removeExtensions": true,
    "sync.syncExtensions": true,

    // gitlens =========
    "gitlens.advanced.messages": {
        "suppressShowKeyBindingsNotice": true
    },
    "gitlens.currentLine.enabled": false,

    // XO =========
    "xo.enable": true,
}

[Tyriar]

You're not using a powerlines font?

"terminal.integrated.fontFamily": "Hurmit Nerd Font"

[j0hnm4r5]

It is a Powerline font, just one with a ton more symbols than a standard one: https://github.com/ryanoasis/nerd-fonts. Nerdfonts do explicitly contain the Powerline symbols.

The issue seems to stem from VSCode's rendering of ambiguous-width characters. It can be fixed in iTerm, as seen here: https://github.com/bhilburn/powerlevel9k/wiki/Troubleshooting#strange-character--segment-spacing

FWIW, this issue does not occur in iTerm2 (since the ambiguous-width characters are not rendered as double-width), but does occur in Hyper.

[Tyriar]

Thanks for the info! Let's track this in xtermjs/xterm.js#1453