1780169 - Fonts used for URLs in console doesn't look great

Status: NEW

(DevTools :: Console, defect, P3)

Description

[Jan Honza Odvarko [:Honza] (always need-info? me)]

Attachment: obrazek.png

Originally reported here:
https://connect.mozilla.org/t5/discussions/url-font-in-devtools-js-console-is-horrendous/m-p/3287

STR

1. Open the Console panel
2. Type "http://lLlLlLlL.com"
3. Check out the preview (eager evaluation)

See also the attached screenshot.

Should we change the font?

Honza

Comment 1

[Julian Descottes [:jdescottes]]

Note that on macos I don't see this. The instant evaluation font is not significantly different from the regular one. Might be windows only?

Comment 2

[Julian Descottes [:jdescottes]]

Attachment: macos.png

Comment 3

[Julian Descottes [:jdescottes]]

We use the monospace font for this, which is defined as

:root[platform="mac"] {
  --monospace-font-family: Menlo, monospace;
}

:root[platform="win"] {
  --monospace-font-family: Consolas, monospace;
}

:root[platform="linux"] {
  --monospace-font-family: monospace;
}

at https://searchfox.org/mozilla-central/rev/fa71140041c5401b80a11f099cc0cd0653295e2c/devtools/client/themes/common.css#40-50
So I assume this is Consolas in italics?

Comment 4

[Nicolas Chevobbe [:nchevobbe]]

(In reply to Julian Descottes [:jdescottes] from comment #3)

at https://searchfox.org/mozilla-central/rev/fa71140041c5401b80a11f099cc0cd0653295e2c/devtools/client/themes/common.css#40-50
So I assume this is Consolas in italics?

I wonder if we should use the proper italic fonts in such case (i.e. Consolas Italic on windows), I can't remember if font-style: italic tries to do something smart or is just faking italic

Comment 5

[Nicolas Chevobbe [:nchevobbe]]

(In reply to Nicolas Chevobbe [:nchevobbe] from comment #4)

I wonder if we should use the proper italic fonts in such case (i.e. Consolas Italic on windows), I can't remember if font-style: italic tries to do something smart or is just faking italic

I just checked on Windows and it looks good. Consolas Italic is being used under the hood.
Maybe without Consolas, the monospace font isn't great? But switching the font-family to monospace still make the text displayed in Consolas for me, I'd really have to uninstall the font I guess.
I'm not sure there's much we can do at this point, I think Consolas is installed by default on Windows nowadays.

I also checked on Ubuntu and it looks fine there