Merge remote-tracking branch 'origin/master' into feat/serialize-addon

addons/xterm-addon-attach/package.json

@@ -1,6 +1,6 @@
 {
   "name": "xterm-addon-attach",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "author": {
     "name": "The xterm.js authors",
     "url": "https://xtermjs.org/"

addons/xterm-addon-search/package.json

@@ -1,6 +1,6 @@
 {
   "name": "xterm-addon-search",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "author": {
     "name": "The xterm.js authors",
     "url": "https://xtermjs.org/"

addons/xterm-addon-webgl/package.json

@@ -1,6 +1,6 @@
 {
   "name": "xterm-addon-webgl",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "author": {
     "name": "The xterm.js authors",
     "url": "https://xtermjs.org/"

addons/xterm-addon-webgl/src/RectangleRenderer.ts

@@ -22,13 +22,13 @@ const enum VertexAttribLocations {
 const vertexShaderSource = `#version 300 es
 layout (location = ${VertexAttribLocations.POSITION}) in vec2 a_position;
 layout (location = ${VertexAttribLocations.SIZE}) in vec2 a_size;
-layout (location = ${VertexAttribLocations.COLOR}) in vec3 a_color;
+layout (location = ${VertexAttribLocations.COLOR}) in vec4 a_color;
 layout (location = ${VertexAttribLocations.UNIT_QUAD}) in vec2 a_unitquad;
 
 uniform mat4 u_projection;
 uniform vec2 u_resolution;
 
-out vec3 v_color;
+out vec4 v_color;
 
 void main() {
   vec2 zeroToOne = (a_position + (a_unitquad * a_size)) / u_resolution;
@@ -39,12 +39,12 @@ void main() {
 const fragmentShaderSource = `#version 300 es
 precision lowp float;
 
-in vec3 v_color;
+in vec4 v_color;
 
 out vec4 outColor;
 
 void main() {
-  outColor = vec4(v_color, 1);
+  outColor = v_color;
 }`;
 
 interface IVertices {

addons/xterm-addon-webgl/src/WebglRenderer.api.ts

@@ -702,6 +702,22 @@ describe('WebGL Renderer Integration Tests', function(): void {
       await pollFor(page, () => getCellColor(8, 2), [64, 64, 64, 255]);
     });
   });
+
+  describe('allowTransparency', async () => {
+    before(async () => setupBrowser({ rendererType: 'dom', allowTransparency: true}));
+    after(async () => browser.close());
+    beforeEach(async () => page.evaluate(`window.term.reset()`));
+    it('transparent background inverse', async () => {
+      const theme: ITheme = {
+        background: '#ff000080'
+      };
+      await page.evaluate(`window.term.setOption('theme', ${JSON.stringify(theme)});`);
+      const data = `\\x1b[7m█\x1b[0m`;
+      await writeSync(data);
+      // Inverse background should be opaque
+      await pollFor(page, () => getCellColor(1, 1), [255, 0, 0, 255]);
+    });
+  });
 });
 
 async function openTerminal(options: ITerminalOptions = {}): Promise<void> {
@@ -732,7 +748,7 @@ async function getCellColor(col: number, row: number): Promise<number[]> {
   return await page.evaluate(`Array.from(window.result)`);
 }
 
-async function setupBrowser(): Promise<void> {
+async function setupBrowser(options: ITerminalOptions = { rendererType: 'dom' }): Promise<void> {
   browser = await puppeteer.launch({
     headless: process.argv.indexOf('--headless') !== -1,
     args: [`--window-size=${width},${height}`, `--no-sandbox`]
@@ -740,9 +756,7 @@ async function setupBrowser(): Promise<void> {
   page = (await browser.pages())[0];
   await page.setViewport({ width, height });
   await page.goto(APP);
-  await openTerminal({
-    rendererType: 'dom'
-  });
+  await openTerminal(options);
   await page.evaluate(`
     window.addon = new WebglAddon(true);
     window.term.loadAddon(window.addon);

addons/xterm-addon-webgl/src/atlas/WebglCharAtlas.ts

@@ -6,7 +6,7 @@
 import { ICharAtlasConfig } from './Types';
 import { DIM_OPACITY } from 'browser/renderer/atlas/Constants';
 import { IRasterizedGlyph, IBoundingBox, IRasterizedGlyphSet } from '../Types';
-import { DEFAULT_COLOR, FgFlags, Attributes, BgFlags } from 'common/buffer/Constants';
+import { DEFAULT_COLOR, Attributes } from 'common/buffer/Constants';
 import { throwIfFalsy } from '../WebglUtils';
 import { IColor } from 'browser/Types';
 import { IDisposable } from 'xterm';
@@ -228,7 +228,12 @@ export class WebglCharAtlas implements IDisposable {
       case Attributes.CM_DEFAULT:
       default:
         if (inverse) {
-          return this._config.colors.background.css;
+          const bg = this._config.colors.background.css;
+          if (bg.length === 9) {
+            // Remove bg alpha channel if present
+            return bg.substr(0, 7);
+          }
+          return bg;
         }
         return this._config.colors.foreground.css;
     }
@@ -530,20 +535,3 @@ function toPaddedHex(c: number): string {
   const s = c.toString(16);
   return s.length < 2 ? '0' + s : s;
 }
-
-function getFgColor(fg: number): number {
-  switch (fg & Attributes.CM_MASK) {
-    case Attributes.CM_P16:
-    case Attributes.CM_P256:  return fg & Attributes.PCOLOR_MASK;
-    case Attributes.CM_RGB:   return fg & Attributes.RGB_MASK;
-    default:                  return -1;  // CM_DEFAULT defaults to -1
-  }
-}
-function getBgColor(bg: number): number {
-  switch (bg & Attributes.CM_MASK) {
-    case Attributes.CM_P16:
-    case Attributes.CM_P256:  return bg & Attributes.PCOLOR_MASK;
-    case Attributes.CM_RGB:   return bg & Attributes.RGB_MASK;
-    default:                  return -1;  // CM_DEFAULT defaults to -1
-  }
-}