Two terminals with equal configs share one TextureAtlas (CharAtlasCache). When the atlas merges pages it raises a consume-once clear-model flag (TextureAtlas.beginFrame); only the first terminal to render consumes it and rebuilds its vertex model. Every other terminal keeps stale texture-page indexes/coords and draws wrong glyphs on its next partial render even though its buffer is intact. The test churns terminal A to force merges, then gives terminal B a tiny partial update: B's untouched header row garbles (signature diff ~130/255 vs tolerance 14) while B's buffer still reads HEADER_REF. A DOM-renderer control runs the same workload without GPU acceleration and passes: the corruption is exclusive to the WebGL path. RED on current code by design; the fix lands separately.
@xterm/addon-webgl
An addon for xterm.js that enables a WebGL2-based renderer. This addon requires xterm.js v4+.
Install
npm install --save @xterm/addon-webgl
Usage
import { Terminal } from '@xterm/xterm';
import { WebglAddon } from '@xterm/addon-webgl';
const terminal = new Terminal();
terminal.open(element);
terminal.loadAddon(new WebglAddon());
See the full API for more advanced usage.
Handling Context Loss
The browser may drop WebGL contexts for various reasons like OOM or after the system has been suspended. There is an API exposed that fires the webglcontextlost event on the canvas so embedders can handle it however they wish. An easy, but suboptimal way, to handle this is by disposing of WebglAddon when the event fires:
const terminal = new Terminal();
const addon = new WebglAddon();
addon.onContextLoss(e => {
addon.dispose();
});
terminal.loadAddon(addon);
Read more about handling WebGL context losses on the Khronos wiki.