Can't specify both foreground and background text color #153

itaych · 2019-03-04T11:04:49Z

Under Jenkins 2.150.2, AnsiColor 0.6.2, it appears that when specifying both foreground and background color for text, only the latter of the two will take effect.

For example:
\e[45;32m Text1 \e[m \e[32;45m Text2 \e[m

Both text1 and text2 should have green text and a purple background, and that indeed is the result in Gnome Terminal. But in Jenkins, text1 will be green on unchanged background and text2 will be white text on purple background.

Here's an example stress test file: colorlog.txt

Here's what it looks like under Gnome Terminal:

And here it is under AnsiColor:

Thanks!

dblock · 2019-03-04T15:15:04Z

@itaych Care to turn this matrix into a test in this project?

itaych · 2019-03-04T16:21:53Z

@dblock I wouldn't know how to do that myself (Github newbie, unfamiliar with the innards of this project, haven't touched Java since last century). I will be happy to give you any information you need though, here or by email (same username at gmail).

itaych · 2019-03-05T14:55:51Z

@dblock I think I've understood the problem. The first line ("green text purple background" twice) looks like this in the HTML generated by ansicolor:


green text purple background




green text purple background


This is perfectly valid HTML but unfortunately it seems that only the inner span tag has the desired effect and the external one is ignored. If I manually change it to this:

then the problem is fixed. Unfortunately looking at the code this looks very far from trivial to implement because you open a new tag for every setForegroundColor / setBackgroundColor.

dwnusbaum · 2019-03-05T14:57:10Z

@itaych What web browser are you using? I wonder if some browsers are ok with nested spans like that and others don't like it.

Unfortunately looking at the code this looks very far from trivial to implement because you open a new tag for every setForegroundColor / setBackgroundColor.

Yeah, changing this wouldn't be trivial. It would probably be possible to do something like buffer color-related tags just in case the next tag is also a color-related tag and then combine them before emitting them, but it would take some experimentation.

itaych · 2019-03-05T19:26:52Z

@dwnusbaum I was using Firefox under Linux to test, and I believe it looked the same under Chrome too. But here's where the rabbit hole gets deeper: I've just tried pasting the code with the nested spans from my previous message into a blank .html file (wrapped in html and body tags), loaded the file in Firefox and Chrome and it works - both text segments are green on purple background. So there's no need to change the code, rather understand why the result looks bad in the context of a full Jenkins console output web page but just fine when isolated.

itaych · 2019-03-06T09:08:13Z

I think I'm getting close. TL;DR: I believe there is no need to change the plugin - the issue can be easily solved with some CSS changes.

Consider this HTML:
<html><head>
<style>
.console-output, .console-output * {
background: #263238;
color: #e9eded;
}
</style>
</head><body>
<pre class="console-output">
-- ANSI color test --
green text purple background green text purple background
</pre></html>

This is basically a Jenkins console output window with all text and code irrelevant to reproducing the issue removed. The style segment is from the file jenkins-material-theme.css (part of the Jenkins install).

What happens here is that every new 'span' inside the console-output is created with the specified console-output text and background color; in case of nesting this causes the color from the outer element to be lost. I've found that this can be prevented in three ways:
(1) remove the , .console-output * from the stylesheet. This will still set the console-output section to these colors but will not start each subelement with the same initial colors.
(2) add this to the stylesheet. It makes 'span' elements exceptional in that their default colors are inherited from their parent element:
.console-output span {
background: inherit;
color: inherit;
}
(3) This fix involves altering the plugin rather than any stylesheet but is a little ugly: when ansicolor emits a span tag, add the appropriate inherit argument: background: inherit; in setForegroundColor, color: inherit; in setBackgroundColor. So a typical span tag would look like 

Any of these solutions is sufficient to solve this issue but (especially regarding 1 and 2) I'm not sure what undesirable side effects they may have, nor do I know where to implement them. (Should we change the jenkins-material-theme.css? Are there additional themes that would all need to be changed?)

itaych · 2019-03-25T14:19:18Z

@dblock - You added "needs more info" - what more info do you need (and how can I help)? You added "bug?" - do you think this isn't a bug?

dwnusbaum · 2019-03-25T14:27:29Z

@itaych I wasn't sure where you were getting jenkins-material-theme.css from since I couldn't find it in Jenkins core, but I think you might have a custom theme plugin installed which is causing the issue. Perhaps https://github.com/afonsof/jenkins-material-theme? If this bug is specific to the CSS in a custom theme, then I would report it there.

itaych · 2019-03-26T12:09:40Z

@dwnusbaum You are correct, we are indeed using the Material Theme, and without it the bug no longer appears. Theme author @afonsof - please take a look at this thread. What I'm uncertain about is whether the problem is specific to this theme or is common to several themes that perhaps share a common base. In any case I now agree that this is not an issue with ansicolor. Thank you.

dwnusbaum · 2019-03-26T13:33:11Z

@itaych Thanks for your detailed investigation into finding the root cause of the bug!

itaych changed the title ~~Can't specify both fore and backround color~~ Can't specify both foreground and background text color Mar 4, 2019

dblock added needs more info 💤 bug ❓ Possibly an ansicolor plugin bug labels Mar 20, 2019

itaych closed this as completed Mar 26, 2019

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Can't specify both foreground and background text color #153

Can't specify both foreground and background text color #153

itaych commented Mar 4, 2019 •

edited

Loading

dblock commented Mar 4, 2019

itaych commented Mar 4, 2019

itaych commented Mar 5, 2019

dwnusbaum commented Mar 5, 2019 •

edited

Loading

itaych commented Mar 5, 2019

itaych commented Mar 6, 2019 •

edited

Loading

itaych commented Mar 25, 2019

dwnusbaum commented Mar 25, 2019

itaych commented Mar 26, 2019

dwnusbaum commented Mar 26, 2019

Can't specify both foreground and background text color #153

Can't specify both foreground and background text color #153

Comments

itaych commented Mar 4, 2019 • edited Loading

dblock commented Mar 4, 2019

itaych commented Mar 4, 2019

itaych commented Mar 5, 2019

dwnusbaum commented Mar 5, 2019 • edited Loading

itaych commented Mar 5, 2019

itaych commented Mar 6, 2019 • edited Loading

itaych commented Mar 25, 2019

dwnusbaum commented Mar 25, 2019

itaych commented Mar 26, 2019

dwnusbaum commented Mar 26, 2019

itaych commented Mar 4, 2019 •

edited

Loading

dwnusbaum commented Mar 5, 2019 •

edited

Loading

itaych commented Mar 6, 2019 •

edited

Loading