Canvas renderer doesn't respect background color changes for spaces

[davidfiala]

When using exclusively the xterm-addon-canvas, changes to background color are not respected if the character(s) immediately following the escape sequence are space characters. Related, if the next character after a background color change is \r, then the entire rest of the line is filled with that background color.

Without canvas, or with just webgl, this bug is not present.

Details

• Browser and browser version: FF, Chrome
• OS version: Windows, Linux
• xterm.js version: Head as of this reporting... master @ 9154831afa9aea78306d8edad8fe403616758ad3

Steps to reproduce

1. Open the xterm demo app. Disable all addons (specifically webgl and canvas)
2. Run: echo -e "AAA\e[41mRED\e[49mBBB" ; echo -e "CCC\e[41mRED\e[49m DDD"
3. Toggle the canvas addon on/off to see the effect.

Note that this applied to any background color, not just default. For example, echo -e "CCC\e[41mRED\e[42m DDD\e[49mEND" will show red before DDD even though it should have been green.

\e[41m: Set BG color to red \e[42m: Set BG color to green \e[49m: Set BG color to default

[mrev11]

I can confirm. Loook at this example from the real world. This is htop in xterm.js 5.1.0 with blue background (so that difference will be more spectacular): And the same in the old xterm.js 4.19.0: Pale colors are adjusted in the second case.

[Tyriar]

duplicate of https://github.com/xtermjs/xterm.js/issues/4120

[mrev11]

TextRendererLayer.ts, line 173. // libvte and xterm both draw the background (but not foreground) of invisible characters,
// so we should too.

DomRendererRowFactory.ts, line 65. let lineLength = 0;
for (let x = Math.min(lineData.length, cols) - 1; x >= 0; x--) {
if (lineData.loadCell(x, this._workCell).getCode() !== NULL_CELL_CODE || (isCursorRow && x === lineLength = x + 1;
break;
}
}
This code cuts lines ending with invisible charactres.