Migrate to esbuild

.eslintrc.json

@@ -39,7 +39,8 @@
     "**/inwasm-sdks/*",
     "**/typings/*.d.ts",
     "**/node_modules",
-    "**/*.js"
+    "**/*.js",
+    "**/*.mjs"
   ],
   "plugins": [
     "@typescript-eslint",

.github/workflows/ci.yml

@@ -19,8 +19,14 @@ jobs:
         cache: 'yarn'
     - name: Install dependencies
       run: yarn --frozen-lockfile
-    - name: Build
-      run: yarn setup
+    - name: Esbuild
+      run: |
+        tsc -b addons/xterm-addon-image/src/tsconfig.json
+        yarn esbuild
+    - name: Inwasm
+      run: yarn inwasm
+    - name: Check types # TODO: This could be its own job
+      run: yarn check-types
     - name: Zip artifacts
       run: |
         zip -r compressed-build \

.vscode/tasks.json

@@ -18,9 +18,9 @@
       "problemMatcher": []
     },
     {
-      "label": "watch",
+      "label": "watch-types",
       "type": "npm",
-      "script": "watch",
+      "script": "watch-types",
       "group": "build",
       "isBackground": true,
       "problemMatcher": "$tsc-watch",
@@ -29,7 +29,69 @@
       }
     },
     {
-      "label": "start",
+      "label": "inwasm",
+      // TODO: inwasm can be invalidated easily (#4646)
+      "dependsOn": "esbuild-dev",
+      "type": "npm",
+      "script": "inwasm",
+      "group": "build",
+      "isBackground": true,
+      "problemMatcher": [],
+      "presentation": {
+        "group": "vscode"
+      }
+    },
+    {
+      "label": "esbuild-dev",
+      // TODO: Remove this when the demo imports xterm-addon-image
+      "dependsOn": ["tsc-addon-image"],
+      "type": "npm",
+      "script": "esbuild-dev",
+      "group": "build",
+      "isBackground": true,
+      "problemMatcher": [],
+      "presentation": {
+        "group": "vscode"
+      }
+    },
+    {
+      "label": "watch-esbuild-demo",
+      "dependsOn": ["esbuild-dev"],
+      "type": "npm",
+      "script": "esbuild-demo-watch",
+      "group": "build",
+      "isBackground": true,
+      "problemMatcher": [],
+      "presentation": {
+        "group": "vscode"
+      }
+    },
+    {
+      "label": "tsc-addon-image",
+      "type": "shell",
+      "command": "node_modules/.bin/tsc -b addons/xterm-addon-image/src/tsconfig.json",
+      "group": "build",
+      "isBackground": true,
+      "problemMatcher": [],
+      "presentation": {
+        "group": "vscode",
+        "close": true
+      }
+    },
+    {
+      "label": "watch-esbuild",
+      "dependsOn": ["inwasm", "esbuild-dev"],
+      "type": "npm",
+      "script": "esbuild-dev-watch",
+      "group": "build",
+      "isBackground": true,
+      "problemMatcher": [],
+      "presentation": {
+        "group": "vscode"
+      }
+    },
+    {
+      "label": "serve-demo",
       "type": "npm",
       "script": "start",
       "group": "build",
@@ -41,7 +103,7 @@
     },
     {
       "label": "Start demo",
-      "dependsOn": ["start", "watch"],
+      "dependsOn": ["serve-demo", "watch-types", "watch-esbuild", "watch-esbuild-demo"],
       "group": {
         "kind": "build",
         "isDefault": true

addons/xterm-addon-image/src/Constants.ts

@@ -0,0 +1,16 @@
+/**
+ * Copyright (c) 2020 The xterm.js authors. All rights reserved.
+ * @license MIT
+ */
+
+import { Attributes, BgFlags, Content, ExtFlags, UnderlineStyle } from 'common/buffer/Constants';
+
+// export some privates for local usage
+export { Attributes, BgFlags, Content, ExtFlags, UnderlineStyle };
+
+export const enum Cell {
+  CONTENT = 0,  // codepoint and wcwidth information (enum Content)
+  FG = 1,       // foreground color in lower 3 bytes (rgb), attrs in 4th byte (enum FgFlags)
+  BG = 2,       // background color in lower 3 bytes (rgb), attrs in 4th byte (enum BgFlags)
+  SIZE = 3      // size of single cell on buffer array
+}

addons/xterm-addon-image/src/ImageStorage.ts

@@ -5,7 +5,8 @@
 
 import { IDisposable } from 'xterm';
 import { ImageRenderer } from './ImageRenderer';
-import { ITerminalExt, IExtendedAttrsImage, IImageAddonOptions, IImageSpec, IBufferLineExt, BgFlags, Cell, Content, ICellSize, ExtFlags, Attributes, UnderlineStyle } from './Types';
+import { ITerminalExt, IExtendedAttrsImage, IImageAddonOptions, IImageSpec, IBufferLineExt, ICellSize } from './Types';
+import { Attributes, BgFlags, Cell, Content, ExtFlags, UnderlineStyle } from './Constants';
 
 
 // fallback default cell size

addons/xterm-addon-image/src/Types.d.ts

@@ -6,23 +6,15 @@
 import { IDisposable, IMarker, Terminal } from 'xterm';
 
 // private imports from base repo we build against
-import { Attributes, BgFlags, Content, ExtFlags, UnderlineStyle } from 'common/buffer/Constants';
 import type { AttributeData } from 'common/buffer/AttributeData';
 import type { IParams, IDcsHandler, IOscHandler, IEscapeSequenceParser } from 'common/parser/Types';
 import type { IBufferLine, IExtendedAttrs, IInputHandler } from 'common/Types';
 import type { ITerminal, ReadonlyColorSet } from 'browser/Types';
 import type { IRenderDimensions } from 'browser/renderer/shared/Types';
 import type { ICoreBrowserService, IRenderService, IThemeService } from 'browser/services/Services';
 
-export const enum Cell {
-  CONTENT = 0,  // codepoint and wcwidth information (enum Content)
-  FG = 1,       // foreground color in lower 3 bytes (rgb), attrs in 4th byte (enum FgFlags)
-  BG = 2,       // background color in lower 3 bytes (rgb), attrs in 4th byte (enum BgFlags)
-  SIZE = 3      // size of single cell on buffer array
-}
-
 // export some privates for local usage
-export { AttributeData, IParams, IDcsHandler, IOscHandler, BgFlags, IRenderDimensions, IRenderService, Content, ExtFlags, Attributes, UnderlineStyle, ReadonlyColorSet };
+export { AttributeData, IParams, IDcsHandler, IOscHandler, IRenderDimensions, IRenderService, ReadonlyColorSet };
 
 /**
  * Plugin ctor options.

addons/xterm-addon-ligatures/src/index.test.ts

@@ -108,12 +108,12 @@ describe('xterm-addon-ligatures', () => {
   });
 
   it('ensures no empty errors are thrown', async () => {
-    sinon.stub(fontLigatures, 'loadFile').callsFake(async () => { throw undefined; });
+    const stub = sinon.stub(fontLigatures, 'loadFile').callsFake(async () => { throw undefined; });
     term.options.fontFamily = 'Iosevka';
     assert.deepEqual(term.joiner!(input), []);
     await delay(500);
     assert.isTrue(onRefresh.notCalled);
-    (fontLigatures.loadFile as sinon.SinonStub).restore();
+    stub.restore();
   });
 });
 

addons/xterm-addon-serialize/src/SerializeAddon.ts

@@ -5,10 +5,58 @@
  * (EXPERIMENTAL) This Addon is still under development
  */
 
-import { DEFAULT_ANSI_COLORS } from 'browser/services/ThemeService';
+import { channels, css } from 'common/Color';
 import { IAttributeData, IColor } from 'common/Types';
 import { IBuffer, IBufferCell, IBufferRange, ITerminalAddon, Terminal } from 'xterm';
 
+// HACK: Duplicated from theme service as esbuild complained when referenced
+export const DEFAULT_ANSI_COLORS = Object.freeze((() => {
+  const colors = [
+    // dark:
+    css.toColor('#2e3436'),
+    css.toColor('#cc0000'),
+    css.toColor('#4e9a06'),
+    css.toColor('#c4a000'),
+    css.toColor('#3465a4'),
+    css.toColor('#75507b'),
+    css.toColor('#06989a'),
+    css.toColor('#d3d7cf'),
+    // bright:
+    css.toColor('#555753'),
+    css.toColor('#ef2929'),
+    css.toColor('#8ae234'),
+    css.toColor('#fce94f'),
+    css.toColor('#729fcf'),
+    css.toColor('#ad7fa8'),
+    css.toColor('#34e2e2'),
+    css.toColor('#eeeeec')
+  ];
+
+  // Fill in the remaining 240 ANSI colors.
+  // Generate colors (16-231)
+  const v = [0x00, 0x5f, 0x87, 0xaf, 0xd7, 0xff];
+  for (let i = 0; i < 216; i++) {
+    const r = v[(i / 36) % 6 | 0];
+    const g = v[(i / 6) % 6 | 0];
+    const b = v[i % 6];
+    colors.push({
+      css: channels.toCss(r, g, b),
+      rgba: channels.toRgba(r, g, b)
+    });
+  }
+
+  // Generate greys (232-255)
+  for (let i = 0; i < 24; i++) {
+    const c = 8 + i * 10;
+    colors.push({
+      css: channels.toCss(c, c, c),
+      rgba: channels.toRgba(c, c, c)
+    });
+  }
+
+  return colors;
+})());
+
 function constrain(value: number, low: number, high: number): number {
   return Math.max(low, Math.min(value, high));
 }

addons/xterm-addon-serialize/src/tsconfig.json

@@ -20,6 +20,7 @@
       ]
     },
     "strict": true,
+    "experimentalDecorators": true,
     "types": [
       "../../../node_modules/@types/mocha"
     ]

addons/xterm-addon-webgl/typings/xterm-addon-webgl.d.ts

@@ -27,6 +27,11 @@ declare module 'xterm-addon-webgl' {
      */
     public readonly onAddTextureAtlasCanvas: IEvent<HTMLCanvasElement>;
 
+    /**
+     * An event that is fired when the a page is removed from the texture atlas.
+     */
+    public readonly onRemoveTextureAtlasCanvas: IEvent<HTMLCanvasElement>;
+
     constructor(preserveDrawingBuffer?: boolean);
 
     /**