From 7ffd9e1f7f24e35d79796118535177d59cc96f97 Mon Sep 17 00:00:00 2001
From: Daniel Imms <2193314+Tyriar@users.noreply.github.com>
Date: Fri, 26 Aug 2022 14:16:02 -0700
Subject: [PATCH] Only draw character outline if it has a descent

Fixes #4059
---
 .../src/atlas/WebglCharAtlas.ts               | 28 ++++++++++++-------
 1 file changed, 18 insertions(+), 10 deletions(-)

diff --git a/addons/xterm-addon-webgl/src/atlas/WebglCharAtlas.ts b/addons/xterm-addon-webgl/src/atlas/WebglCharAtlas.ts
index 90d13e5547..2af88b9217 100644
--- a/addons/xterm-addon-webgl/src/atlas/WebglCharAtlas.ts
+++ b/addons/xterm-addon-webgl/src/atlas/WebglCharAtlas.ts
@@ -533,18 +533,26 @@ export class WebglCharAtlas implements IDisposable {
         // This only works when transparency is disabled because it's not clear how to clear stroked
         // text
         if (!this._config.allowTransparency && chars !== ' ') {
-          // This translates to 1/2 the line width in either direction
+          // Measure the text, only draw the stroke if there is a descent beyond an alphabetic text
+          // baseline
           this._tmpCtx.save();
-          // Clip the region to only draw in valid pixels near the underline to avoid a slight
-          // outline around the whole glyph, as well as additional pixels in the glyph at the top
-          // which would increase GPU memory demands
-          const clipRegion = new Path2D();
-          clipRegion.rect(xLeft, yTop - Math.ceil(lineWidth / 2), this._config.scaledCellWidth, yBot - yTop + Math.ceil(lineWidth / 2));
-          this._tmpCtx.clip(clipRegion);
-          this._tmpCtx.lineWidth = window.devicePixelRatio * 3;
-          this._tmpCtx.strokeStyle = backgroundColor.css;
-          this._tmpCtx.strokeText(chars, padding, padding + this._config.scaledCharHeight);
+          this._tmpCtx.textBaseline = 'alphabetic';
+          const metrics = this._tmpCtx.measureText(chars);
           this._tmpCtx.restore();
+          if ('actualBoundingBoxDescent' in metrics && metrics.actualBoundingBoxDescent > 0) {
+            // This translates to 1/2 the line width in either direction
+            this._tmpCtx.save();
+            // Clip the region to only draw in valid pixels near the underline to avoid a slight
+            // outline around the whole glyph, as well as additional pixels in the glyph at the top
+            // which would increase GPU memory demands
+            const clipRegion = new Path2D();
+            clipRegion.rect(xLeft, yTop - Math.ceil(lineWidth / 2), this._config.scaledCellWidth, yBot - yTop + Math.ceil(lineWidth / 2));
+            this._tmpCtx.clip(clipRegion);
+            this._tmpCtx.lineWidth = window.devicePixelRatio * 3;
+            this._tmpCtx.strokeStyle = backgroundColor.css;
+            this._tmpCtx.strokeText(chars, padding, padding + this._config.scaledCharHeight);
+            this._tmpCtx.restore();
+          }
         }
       }
     }