Fix wrapping issues with long filenames/revisions in the diff viewer.

Review Request #6822 — Created Jan. 22, 2015 and submitted

Information

Review Board
release-2.0.x
41d00dd...

Reviewers

The diff viewer's forced-wrapping behavior, intended to break up long
lines, had issues when the filename or revisions were too long.

In the case of very long filenames, the filename would cause the table
to stretch off the page (in a way where content was being clipped),
which messed up all the other calculations. To fix this, we needed to
impose forced widths on the filename columns, just like we do with the
diff columns.

When resizing the page to a small width, the revision text would then
start to mess up the calculations, since they'd force certain minimum
page widths. We now force widths on these columns as well, ellipsizing
them, to prevent them from interfering with the calculations.

Along with this, there were small wrapping errors just in the diff
contents, where a letter had to be almost fully obscured before it'd
wrap. This was due to not factoring in the border and padding of the
table, container, and diff cells when computing how much space we had to
work with. By fixing this, lines wrap naturally.

Resized the window pixel-by-pixel to see at which point the characters
wrapped in a normal situation. They were no longer appearing
partially-obscured.

Tested with a long filename, and saw that it no longer influenced the
wrapping of the diffs. It instead ellipsized.

Tested with widths smaller than the revision IDs. Again, no impact on
the wrapping of the diffs, and they ellipsized as well.

Tested this in Chrome and Firefox.

reviewbot
  1. Tool: Pyflakes
    Ignored Files:
        reviewboard/static/rb/css/diffviewer.less
        reviewboard/static/rb/js/diffviewer/views/diffReviewableView.js
        reviewboard/templates/diffviewer/diff_file_fragment.html
    
    
    
    Tool: PEP8 Style Checker
    Ignored Files:
        reviewboard/static/rb/css/diffviewer.less
        reviewboard/static/rb/js/diffviewer/views/diffReviewableView.js
        reviewboard/templates/diffviewer/diff_file_fragment.html
    
    
  2. 
      
david
  1. Ship It!
  2. 
      
chipx86
Review request changed
Status:
Completed
Change Summary:
Pushed to release-2.0.x (bcc3333)