1478455 - overflow-wrap: normal for table into html.css

Status: VERIFIED FIXED

(Core :: Layout: Tables, defect)

Description

[Trevor Rowbotham [:rowbot]]

I am running on the latest nightly on Windows 10.

STR:
1) Visit https://github.com/vscode-icons/vscode-icons/wiki/ListOfFiles
2) Scroll down to bring the table into view.

The table shouldn't overflow its containing element and the first and last 2 columns should not be squished in such a way that the text becomes vertical. This renders properly on Edge and Chrome. Disabling Webrender and running in safe-mode did not fix the issue.

Comment 1

[Trevor Rowbotham [:rowbot]]

This was regressed by Bug 1472386. 

I should mention that when it was working the table rendering was *extremely* slow. I'll file a separate bug for that.

Comment 2

[Trevor Rowbotham [:rowbot]]

I filed Bug 1478500 about the performance issue.

Comment 3

[Xidorn Quan [:xidorn] UTC+11]

Hmm... so this is because GitHub set "word-wrap: break-word" on the top level, and in bug 1472386 we changed how intrinsic size is calculated in that case, which breaks tables on GitHub...

If I add "word-break: break-word" on the page, the table would become broken in the same way on Chrome, which indicates that it isn't really the problem of table layout, but more related to intrinsic size calculation for that case.

Comment 4

[idontlikespying]

When in .markdown-body rule overflow-wrap is set to normal its looking normal. Funny thing

@Xl
>If I add "word-break: break-word" on the page, the table would become broken in the same way on Chrome
Not exactly the same. In Chromium is still keeping width sie from <div class="markdown-body"> but in Firefox take size from <div class="repository-content">

Comment 5

[fantasai]

Maybe consider adding `table { word-wrap: normal; }` to the UA style sheet, see if that addresses most of the web-compat concerns?

Comment 6

[idontlikespying]

Or just not inherit that rule for tables by default from higher levels

Comment 7

[Xidorn Quan [:xidorn] UTC+11]

Attachment: Bug 1478455 - Add overflow-wrap: normal for table to html.css. r?dbaron

This would fix this bug as well as webcompat/web-bugs#17900.

The argument for this to be a reasonable change is that, table cells can
never shrink below the min intrinsic size, so overflow-wrap: break-word
doesn't make any sense in table when it didn't affect intrinsic size.
So this change basically revert the behavior of bug 1472386 for tables
which seems to be the biggest problem so far.

Comment 8

[Phabricator Automation]

Comment on attachment 8996900 [details]
Bug 1478455 - Add overflow-wrap: normal for table to html.css. r?dbaron

David Baron :dbaron: 🏴󠁵󠁳󠁣󠁡󠁿 ⌚UTC-7 has approved the revision.

https://phabricator.services.mozilla.com/D2638

Comment 9

[David Baron :dbaron:]

As I noted in the review and would like to note here as well since it's not specifically about the code:


One note is that you should somehow keep track of the stuff that would need to be backed out if we decide to revert the whole set of changes, since now you have two pieces (this and bug 1472386).  I think you should file a tracking bug for a decision to either ship or revert the whole set of changes, request tracking for 63 (that's the right release, right?), so that we have a bug where we're being pushed to make an explicit decision one way or the other about shipping in 63 rather than just shipping by default because we put it in nightly.

Comment 10

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/9c9b31d0ed53
Add overflow-wrap: normal for table to html.css. r=dbaron

Comment 11

[Xidorn Quan [:xidorn] UTC+11]

Filed bug 1480284 for tracking.

Comment 13

[Noemi Erli[:noemi_erli]]

https://hg.mozilla.org/mozilla-central/rev/9c9b31d0ed53

Comment 14

[Mohammad Maruf Rahman]

I have reproduced this bug with Nightly 63.0a1 (2018-07-25) on Windows 7, 64 Bit!
This bug's fix is verified with latest DeveEdition Beta 63.0b14!

Build ID 	20181011200118
User Agent 	Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:63.0) Gecko/20100101 Firefox/63.0

Comment 15

[Cristian Comorasu, QA [:ccomorasu], Releae Desktop QA - Please contact [e-mail]]

Thank you, Mohammad Maruf Rahman!