1432198 - Ensure a minimum rendered width of 0.5ch for tabs [was: https://golang.org/src/errors/errors.go pre eliminates leading whitespace]

Status: RESOLVED FIXED

(Core :: Layout: Text and Fonts, defect, P3)

Description

[thepciet]

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/63.0.3239.132 Safari/537.36

Steps to reproduce:

Visit https://golang.org/src/errors/errors.go on macOS 10.13.2 or 10.12.6 with Firefox 57.0.4. Initially reported to the Go project at https://github.com/golang/go/issues/23500, not seen with Chrome on macOS or with Firefox 57.0.4 on Ubuntu 16.04 or with Firefox 52.5.3 on OpenSuse Leap 42.3.


Actual results:

The Go code examples in a <pre> tag without CSS white-space set have leading white-space removed (a tab) in the final rendering. Setting "white-space: pre-line;" changes it to a single space instead of no white-space, and "white-space: pre-wrap;" has the same behavior as no white-space or "white-space: pre;".


Expected results:

Indented code in the <pre> should show the indentation in the resulting rendering.

Comment 1

[Masatoshi Kimura [:emk]]

macOS only per the github issue (and works for me on Windows).

Comment 2

[thepciet]

Here's a reduced example: https://jsbin.com/yubalijuyi/1/edit?html,output

Removing "font-family: Menlo, monospace;" from "pre, code" or removing "content: attr(data-content);" from ".ln::before" fix the missing whitespace.

Comment 3

[Jet Villegas (inactive)]

[ Triage 2017/02/20: P3 ]

Comment 4

[kev]

I can reproduce with an even smaller jsbin:

https://jsbin.com/cavayixako/edit?html,output

I can only reproduce it with Menlo, another font does not show the same issue.

With the Menlo font, a tab character starting in column 9 has zero width.

I can't reproduce that JSBin in Chrome.

Comment 5

[kev]

Can we edit the title to read "Menlo font renders tabs with zero width"?

Comment 6

[Jonathan Kew [:jfkthame]]

See https://github.com/webcompat/web-bugs/issues/17530#issuecomment-402675091 for an explanation of what appears to be going on here.

Comment 7

[Jonathan Kew [:jfkthame]]

The CSS WG has just resolved that tabs should be rendered with a minimum width of 0.5ch; implementing this should fix this issue and resolve the bad rendering.

See https://github.com/w3c/csswg-drafts/issues/2883#issuecomment-422872689.

Comment 8

[Jonathan Kew [:jfkthame]]

Attachment: Test for minimum rendered width of 0.5ch for the tab character

Basic reftest (fails with current trunk code)

Comment 9

[Jonathan Kew [:jfkthame]]

Attachment: Ensure tab characters are rendered with a minimum advance of 0.5ch

And this should resolve the problem, AFAICS.

Comment 10

[Xidorn Quan [:xidorn] UTC+11]

Comment on attachment 9010967 [details] [diff] [review]
Test for minimum rendered width of 0.5ch for the tab character

Review of attachment 9010967 [details] [diff] [review]:
-----------------------------------------------------------------

Looks good, but it should probably be a wpt rather than our internal test if this behavior has been resolved by the working group.

Comment 11

[Jonathan Kew [:jfkthame]]

Attachment: Test for minimum rendered width of 0.5ch for the tab character

Fair enough, I moved the test over to WPT. (r? again just to double-check it looks ok.)

Comment 12

[Xidorn Quan [:xidorn] UTC+11]

Comment on attachment 9011432 [details] [diff] [review]
Test for minimum rendered width of 0.5ch for the tab character

Review of attachment 9011432 [details] [diff] [review]:
-----------------------------------------------------------------

Thanks.

Comment 13

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/mozilla-inbound/rev/408b85dd564c
Ensure tab characters are rendered with a minimum advance of 0.5ch. r=xidorn
https://hg.mozilla.org/integration/mozilla-inbound/rev/3ef50c7154b8
Test for minimum rendered width of 0.5ch for the tab character. r=xidorn

Comment 14

[Web Platform Test Sync Bot (Matrix: #interop:mozilla.org)]

Created web-platform-tests PR https://github.com/web-platform-tests/wpt/pull/13190 for changes under testing/web-platform/tests

Comment 15

[Stefan Hindli [:stefan_hindli]]

https://hg.mozilla.org/mozilla-central/rev/408b85dd564c
https://hg.mozilla.org/mozilla-central/rev/3ef50c7154b8

Comment 16

[Web Platform Test Sync Bot (Matrix: #interop:mozilla.org)]

Upstream PR merged

Comment 17

[Web Platform Test Sync Bot (Matrix: #interop:mozilla.org)]

Can't merge web-platform-tests PR due to failing upstream checks:
Github PR https://github.com/web-platform-tests/wpt/pull/13190
* Taskcluster (pull_request) (https://tools.taskcluster.net/task-group-inspector/#/NBeePBatSy6mMFj0mcYcoA)