Support invisible attr

src/renderer/BaseRenderLayer.ts

@@ -80,7 +80,7 @@ export abstract class BaseRenderLayer implements IRenderLayer {
     this._ctx.clearRect(startCol * this.scaledCharWidth, startRow * this.scaledCharHeight, colWidth * this.scaledCharWidth, colHeight * this.scaledCharHeight);
   }
 
-  protected drawChar(terminal: ITerminal, char: string, code: number, fg: number, x: number, y: number): void {
+  protected drawChar(terminal: ITerminal, char: string, code: number, x: number, y: number, fg: number): void {
     let colorIndex = 0;
     if (fg < 256) {
       colorIndex = fg + 1;

src/renderer/CursorRenderLayer.ts

@@ -116,7 +116,7 @@ export class CursorRenderLayer extends BaseRenderLayer {
 
   private _renderBlockCursor(terminal: ITerminal, x: number, y: number, charData: CharData): void {
     this.fillCells(x, y, 1, 1);
-    this.drawChar(terminal, charData[CHAR_DATA_CHAR_INDEX], <number>charData[CHAR_DATA_CODE_INDEX], COLOR_CODES.BLACK, x, y);
+    this.drawChar(terminal, charData[CHAR_DATA_CHAR_INDEX], <number>charData[CHAR_DATA_CODE_INDEX], x, y, COLOR_CODES.BLACK);
   }
 
   private _renderUnderlineCursor(terminal: ITerminal, x: number, y: number, charData: CharData): void {

src/renderer/ForegroundRenderLayer.ts

@@ -61,13 +61,14 @@ export class ForegroundRenderLayer extends BaseRenderLayer {
         }
         this._state.cache[x][y] = charData;
 
+        const flags = attr >> 18;
+
         // Skip rendering if the character is invisible
-        if (!code || code === 32 /*' '*/) {
+        if (!code || code === 32 /*' '*/ || (flags & FLAGS.INVISIBLE)) {
           continue;
         }
 
         let fg = (attr >> 9) & 0x1ff;
-        const flags = attr >> 18;
 
         // If inverse flag is on, the foreground should become the background.
         if (flags & FLAGS.INVERSE) {
@@ -87,7 +88,7 @@ export class ForegroundRenderLayer extends BaseRenderLayer {
           }
         }
 
-        this.drawChar(terminal, char, code, fg, x, y);
+        this.drawChar(terminal, char, code, x, y, fg);
         this._ctx.restore();
       }
     }