Fixes #459 - letter spacing breaks gutter annotation

Author: eamodio

CHANGELOG.md

@@ -18,6 +18,7 @@ The format is based on [Keep a Changelog](http://keepachangelog.com/) and this p
 ### Fixed
 - Fixes [#462](https://github.com/eamodio/vscode-gitlens/issues/462) - Source Control shortcut on macOS (⌃⇧G) shouldn't be overridden
 - Fixes [#457](https://github.com/eamodio/vscode-gitlens/issues/457) - Displays the wrong username (You) — thanks to [PR #460](https://github.com/eamodio/vscode-gitlens/pull/460) by Zyck ([@qzyse2017](https://github.com/qzyse2017))
+- Fixes [#459](https://github.com/eamodio/vscode-gitlens/issues/459) - File blame annotation text overflow with letter spacing setting
 - Fixes issues with GitLens Welcome and the interactive settings editor with light themes
 
 ## [8.5.3] - 2018-07-25

src/annotations/annotations.ts

@@ -3,7 +3,8 @@ import {
     DecorationOptions,
     MarkdownString,
     ThemableDecorationRenderOptions,
-    ThemeColor
+    ThemeColor,
+    workspace
 } from 'vscode';
 import {
     DiffWithCommand,
@@ -272,26 +273,26 @@ export class Annotations {
         format: string,
         options: ICommitFormatOptions
     ): IRenderOptions {
-        // Get the width of all the tokens, assuming there there is a cap (bail if not)
-        let width = 0;
+        // Get the character count of all the tokens, assuming there there is a cap (bail if not)
+        let chars = 0;
         for (const token of Objects.values(options.tokenOptions!)) {
             if (token === undefined) continue;
 
             // If any token is uncapped, kick out and set no max
             if (token.truncateTo == null) {
-                width = -1;
+                chars = -1;
                 break;
             }
 
-            width += token.truncateTo;
+            chars += token.truncateTo;
         }
 
-        if (width >= 0) {
-            // Add the width of the template string (without tokens)
-            width += Strings.getWidth(Strings.interpolate(format, undefined));
-            // If we have some width, add a bit of padding
-            if (width > 0) {
-                width += 3;
+        if (chars >= 0) {
+            // Add the chars of the template string (without tokens)
+            chars += Strings.getWidth(Strings.interpolate(format, undefined));
+            // If we have chars, add a bit of padding
+            if (chars > 0) {
+                chars += 3;
             }
         }
 
@@ -302,6 +303,17 @@ export class Annotations {
             borderWidth = heatmap.location === 'left' ? '0 0 0 2px' : '0 2px 0 0';
         }
 
+        let width;
+        if (chars >= 0) {
+            const spacing = workspace.getConfiguration('editor').get<number>('letterSpacing');
+            if (spacing != null && spacing !== 0) {
+                width = `calc(${chars}ch + ${Math.round(chars * spacing)}px)`;
+            }
+            else {
+                width = `${chars}ch`;
+            }
+        }
+
         return {
             backgroundColor: new ThemeColor('gitlens.gutterBackgroundColor'),
             borderStyle: borderStyle,
@@ -310,9 +322,9 @@ export class Annotations {
             fontWeight: 'normal',
             fontStyle: 'normal',
             height: '100%',
-            margin: '0 26px -1px 0',
+            margin: `0 26px -1px 0`,
             textDecoration: separateLines ? 'overline solid rgba(0, 0, 0, .2)' : 'none',
-            width: width >= 0 ? `${width}ch` : undefined,
+            width: width,
             uncommittedColor: new ThemeColor('gitlens.gutterUncommittedForegroundColor')
         } as IRenderOptions;
     }