Fix default bold text

src/renderer/BaseRenderLayer.ts

@@ -127,7 +127,7 @@ export abstract class BaseRenderLayer implements IRenderLayer {
     this._ctx.restore();
   }
 
-  protected drawChar(terminal: ITerminal, char: string, code: number, width: number, x: number, y: number, fg: number, underline: boolean = false): void {
+  protected drawChar(terminal: ITerminal, char: string, code: number, width: number, x: number, y: number, fg: number, bold: boolean): void {
     // Clear the cell next to this character if it's wide
     if (width === 2) {
       this.clearCells(x + 1, y, 1, 1);
@@ -135,7 +135,12 @@ export abstract class BaseRenderLayer implements IRenderLayer {
 
     let colorIndex = 0;
     if (fg < 256) {
-      colorIndex = fg + 1;
+      colorIndex = fg + 2;
+    } else {
+      // If default color and bold
+      if (bold) {
+        colorIndex = 1;
+      }
     }
     const isAscii = code < 256;
     const isBasicColor = (colorIndex > 0 && fg < 16);
@@ -151,6 +156,7 @@ export abstract class BaseRenderLayer implements IRenderLayer {
       this._drawUncachedChar(terminal, char, width, fg, x, y);
     }
     // This draws the atlas (for debugging purposes)
+    // this._ctx.clearRect(0, 0, this._canvas.width, this._canvas.height);
     // this._ctx.drawImage(this._charAtlas, 0, 0);
   }
 

src/renderer/CharAtlas.ts

@@ -105,7 +105,7 @@ class CharAtlasGenerator {
     const cellWidth = scaledCharWidth + CHAR_ATLAS_CELL_SPACING;
     const cellHeight = scaledCharHeight + CHAR_ATLAS_CELL_SPACING;
     this._canvas.width = 255 * cellWidth;
-    this._canvas.height = (/*default*/1 + /*0-15*/16) * cellHeight;
+    this._canvas.height = (/*default+default bold*/2 + /*0-15*/16) * cellHeight;
 
     this._ctx.save();
     this._ctx.fillStyle = foreground;
@@ -116,14 +116,22 @@ class CharAtlasGenerator {
     for (let i = 0; i < 256; i++) {
       this._ctx.fillText(String.fromCharCode(i), i * cellWidth, 0);
     }
+    // Default color bold
+    this._ctx.save();
+    this._ctx.font = `bold ${this._ctx.font}`;
+    for (let i = 0; i < 256; i++) {
+      this._ctx.fillText(String.fromCharCode(i), i * cellWidth, cellHeight);
+    }
+    this._ctx.restore();
 
     // Colors 0-15
+    this._ctx.font = `${fontSize * window.devicePixelRatio}px ${fontFamily}`;
     for (let colorIndex = 0; colorIndex < 16; colorIndex++) {
       // colors 8-15 are bold
       if (colorIndex === 8) {
         this._ctx.font = `bold ${this._ctx.font}`;
       }
-      const y = (colorIndex + 1) * cellHeight;
+      const y = (colorIndex + 2) * cellHeight;
       // Draw ascii characters
       for (let i = 0; i < 256; i++) {
         this._ctx.fillStyle = ansiColors[colorIndex];

src/renderer/ForegroundRenderLayer.ts

@@ -110,7 +110,7 @@ export class ForegroundRenderLayer extends BaseRenderLayer {
           this.drawBottomLineAtCell(x, y);
         }
 
-        this.drawChar(terminal, char, code, width, x, y, fg);
+        this.drawChar(terminal, char, code, width, x, y, fg, !!(flags & FLAGS.BOLD));
 
         this._ctx.restore();
       }