From 0802582c9bbbb62034742affdae97c0fddcec5e1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=B6rg=20Breitbart?= <jerch@rockborn.de>
Date: Mon, 14 Jan 2019 01:00:07 +0100
Subject: [PATCH] test cases for DOM renderer style changes

---
 .../dom/DomRendererRowFactory.test.ts         | 22 +++++++++++++++++++
 src/renderer/dom/DomRendererRowFactory.ts     |  4 ++--
 2 files changed, 24 insertions(+), 2 deletions(-)

diff --git a/src/renderer/dom/DomRendererRowFactory.test.ts b/src/renderer/dom/DomRendererRowFactory.test.ts
index 6a69a4ba..d3b2100c 100644
--- a/src/renderer/dom/DomRendererRowFactory.test.ts
+++ b/src/renderer/dom/DomRendererRowFactory.test.ts
@@ -151,6 +151,28 @@ describe('DomRendererRowFactory', () => {
           );
         }
       });
+
+      it('should set style attribute for RBG', () => {
+        const cell = CellData.fromCharData([0, 'a', 1, 'a'.charCodeAt(0)]);
+        cell.fg |= Attributes.CM_RGB | 1 << 16 | 2 << 8 | 3;
+        cell.bg |= Attributes.CM_RGB | 4 << 16 | 5 << 8 | 6;
+        lineData.setCell(0, cell);
+        const fragment = rowFactory.createRow(lineData, false, undefined, 0, 5, 20);
+        assert.equal(getFragmentHtml(fragment),
+          '<span style="color:rgb(1,2,3);background-color:rgb(4,5,6);">a</span>'
+        );
+      });
+
+      it('should correctly invert RGB colors', () => {
+        const cell = CellData.fromCharData([0, 'a', 1, 'a'.charCodeAt(0)]);
+        cell.fg |= Attributes.CM_RGB | 1 << 16 | 2 << 8 | 3 | FgFlags.INVERSE;
+        cell.bg |= Attributes.CM_RGB | 4 << 16 | 5 << 8 | 6;
+        lineData.setCell(0, cell);
+        const fragment = rowFactory.createRow(lineData, false, undefined, 0, 5, 20);
+        assert.equal(getFragmentHtml(fragment),
+          '<span style="background-color:rgb(1,2,3);color:rgb(4,5,6);">a</span>'
+        );
+      });
     });
   });
 
diff --git a/src/renderer/dom/DomRendererRowFactory.ts b/src/renderer/dom/DomRendererRowFactory.ts
index 7ef26e1f..39b13d48 100644
--- a/src/renderer/dom/DomRendererRowFactory.ts
+++ b/src/renderer/dom/DomRendererRowFactory.ts
@@ -83,7 +83,7 @@ export class DomRendererRowFactory {
       // fg
       if (this._cell.isFgRGB()) {
         let style = charElement.getAttribute('style') || '';
-        style += `${swapColor ? 'background-' : ''}color: rgb(${(this._cell.getFgColor(true) as number[]).join(',')});`;
+        style += `${swapColor ? 'background-' : ''}color:rgb(${(this._cell.getFgColor(true) as number[]).join(',')});`;
         charElement.setAttribute('style', style);
       } else if (this._cell.isFgPalette()) {
         let fg = this._cell.getFgColor() as number;
@@ -98,7 +98,7 @@ export class DomRendererRowFactory {
       // bg
       if (this._cell.isBgRGB()) {
         let style = charElement.getAttribute('style') || '';
-        style += `${swapColor ? '' : 'background-'}color: rgb(${(this._cell.getBgColor(true) as number[]).join(',')});`;
+        style += `${swapColor ? '' : 'background-'}color:rgb(${(this._cell.getBgColor(true) as number[]).join(',')});`;
         charElement.setAttribute('style', style);
       } else if (this._cell.isBgPalette()) {
         charElement.classList.add(`xterm-${swapColor ? 'f' : 'b'}g-${this._cell.getBgColor()}`);