Scrollbar coloring (#755)

This a proposed MR to fix #754. While building the scroll bar the pixels were completely reseted thus canceling any style previously applied to said pixels. This MR removes this resetting of the pixels and leaves only the drawing of the shape of the scroll bar.

src/ftxui/dom/scroll_indicator.cpp

@@ -64,7 +64,6 @@ Element vscroll_indicator(Element child) {
         const bool down = (start_y <= y_down) && (y_down <= start_y + size);
 
         const char* c = up ? (down ? "┃" : "╹") : (down ? "╻" : " ");  // NOLINT
-        screen.PixelAt(x, y) = Pixel();
         screen.PixelAt(x, y).character = c;
       }
     }
@@ -121,7 +120,6 @@ Element hscroll_indicator(Element child) {
 
         const char* c =
             left ? (right ? "─" : "╴") : (right ? "╶" : " ");  // NOLINT
-        screen.PixelAt(x, y) = Pixel();
         screen.PixelAt(x, y).character = c;
       }
     }

src/ftxui/dom/scroll_indicator_test.cpp

@@ -9,6 +9,7 @@
 #include "ftxui/dom/elements.hpp"  // for operator|, Element, operator|=, text, vbox, Elements, border, focus, frame, vscroll_indicator
 #include "ftxui/dom/node.hpp"      // for Render
 #include "ftxui/screen/screen.hpp"  // for Screen
+#include "ftxui/screen/color.hpp"   // for Color, Color::Red
 
 // NOLINTBEGIN
 namespace ftxui {
@@ -127,6 +128,60 @@ TEST(ScrollIndicator, BasicVertical) {
             "╰────╯");
 }
 
+TEST(ScrollIndicator, VerticalColorable) {
+
+  // The list we generate looks like this
+  //           "╭────╮\r\n"
+  //           "│0  ┃│\r\n"
+  //           "│1  ┃│\r\n"
+  //           "│2   │\r\n"
+  //           "│3   │\r\n"
+  //           "╰────╯"
+
+  auto element = MakeVerticalList(0, 10) | color(Color::Red);
+  Screen screen(6, 6);
+  Render(screen, element);
+
+  EXPECT_EQ(screen.PixelAt(4, 4).foreground_color, Color::Red);
+  EXPECT_EQ(screen.PixelAt(4, 4).background_color, Color());
+}
+
+TEST(ScrollIndicator, VerticalBackgroundColorable) {
+
+  // The list we generate looks like this
+  //           "╭────╮\r\n"
+  //           "│0  ┃│\r\n"
+  //           "│1  ┃│\r\n"
+  //           "│2   │\r\n"
+  //           "│3   │\r\n"
+  //           "╰────╯"
+
+  auto element = MakeVerticalList(0, 10) | bgcolor(Color::Red);
+  Screen screen(6, 6);
+  Render(screen, element);
+
+  EXPECT_EQ(screen.PixelAt(4, 4).foreground_color, Color());
+  EXPECT_EQ(screen.PixelAt(4, 4).background_color, Color::Red);
+}
+
+TEST(ScrollIndicator, VerticalFullColorable) {
+
+  // The list we generate looks like this
+  //           "╭────╮\r\n"
+  //           "│0  ┃│\r\n"
+  //           "│1  ┃│\r\n"
+  //           "│2   │\r\n"
+  //           "│3   │\r\n"
+  //           "╰────╯"
+
+  auto element = MakeVerticalList(0, 10) | color(Color::Red) | bgcolor(Color::Red);
+  Screen screen(6, 6);
+  Render(screen, element);
+
+  EXPECT_EQ(screen.PixelAt(4, 4).foreground_color, Color::Red);
+  EXPECT_EQ(screen.PixelAt(4, 4).background_color, Color::Red);
+}
+
 TEST(ScrollIndicator, BasicHorizontal) {
   EXPECT_EQ(PrintHorizontalList(0, 10),
             "╭────╮\r\n"
@@ -177,6 +232,54 @@ TEST(ScrollIndicator, BasicHorizontal) {
             "╰────╯");
 }
 
+TEST(ScrollIndicator, HorizontalColorable) {
+
+  // The list we generate looks like this
+  //           "╭────╮\r\n"
+  //           "│5678│\r\n"
+  //           "│  ──│\r\n"
+  //           "╰────╯"
+
+  auto element = MakeHorizontalList(6, 10) | color(Color::Red);
+  Screen screen(6, 4);
+  Render(screen, element);
+
+  EXPECT_EQ(screen.PixelAt(4, 2).foreground_color, Color::Red);
+  EXPECT_EQ(screen.PixelAt(4, 2).background_color, Color());
+}
+
+TEST(ScrollIndicator, HorizontalBackgroundColorable) {
+
+  // The list we generate looks like this
+  //           "╭────╮\r\n"
+  //           "│5678│\r\n"
+  //           "│  ──│\r\n"
+  //           "╰────╯"
+
+  auto element = MakeHorizontalList(6, 10) | bgcolor(Color::Red);
+  Screen screen(6, 4);
+  Render(screen, element);
+
+  EXPECT_EQ(screen.PixelAt(4, 2).foreground_color, Color());
+  EXPECT_EQ(screen.PixelAt(4, 2).background_color, Color::Red);
+}
+
+TEST(ScrollIndicator, HorizontalFullColorable) {
+
+  // The list we generate looks like this
+  //           "╭────╮\r\n"
+  //           "│5678│\r\n"
+  //           "│  ──│\r\n"
+  //           "╰────╯"
+
+  auto element = MakeHorizontalList(6, 10) | color(Color::Red) | bgcolor(Color::Red);
+  Screen screen(6, 4);
+  Render(screen, element);
+
+  EXPECT_EQ(screen.PixelAt(4, 2).foreground_color, Color::Red);
+  EXPECT_EQ(screen.PixelAt(4, 2).background_color, Color::Red);
+}
+
 namespace {
 
 Element MakeHorizontalFlexboxList(int n) {