Fix allowTransparency in lib and demo

Fixes #5558
Fixes #5560

src/browser/CoreBrowserTerminal.ts

@@ -436,6 +436,8 @@ export class CoreBrowserTerminal extends CoreTerminal implements ITerminal {
     this.element.dir = 'ltr';   // xterm.css assumes LTR
     this.element.classList.add('terminal');
     this.element.classList.add('xterm');
+    this.element.classList.toggle('allow-transparency', this.options.allowTransparency);
+    this._register(this.optionsService.onSpecificOptionChange('allowTransparency', value => this.element!.classList.toggle('allow-transparency', value)));
     parent.appendChild(this.element);
 
     // Performance: Use a document fragment to build the terminal

src/browser/Viewport.ts

@@ -71,6 +71,7 @@ export class Viewport extends Disposable {
 
     this._scrollableElement.setScrollDimensions({ height: 0, scrollHeight: 0 });
     this._register(Event.runAndSubscribe(themeService.onChangeColors, () => {
+      element.style.backgroundColor = themeService.colors.background.css;
       this._scrollableElement.getDomNode().style.backgroundColor = themeService.colors.background.css;
     }));
     element.appendChild(this._scrollableElement.getDomNode());

src/common/Color.test.ts

@@ -303,6 +303,9 @@ describe('Color', () => {
         assert.deepEqual(css.toColor('rgba(0, 0, 80, 0.5)'), { css: '#00005080', rgba: 0x00005080 });
         assert.deepEqual(css.toColor('rgba(255, 255, 255, 1)'), { css: '#ffffffff', rgba: 0xffffffff });
       });
+      it('should convert "transparent" to an IColor', () => {
+        assert.deepEqual(css.toColor('transparent'), { css: 'transparent', rgba: 0x00000000 });
+      });
     });
   });
 

src/common/Color.ts

@@ -184,6 +184,14 @@ export namespace css {
       return channels.toColor($r, $g, $b, $a);
     }
 
+    // Handle the "transparent" keyword
+    if (css === 'transparent') {
+      return {
+        css: 'transparent',
+        rgba: 0x00000000
+      };
+    }
+
     // Validate the context is available for canvas-based color parsing
     if (!$ctx || !$litmusColor) {
       throw new Error('css.toColor: Unsupported css format');