80- (or n-) column indicator in diff viewer

Review Request #11294 — Created Nov. 20, 2020 and updated — Latest diff uploaded

Information

Review Board
release-4.0.x
46

Reviewers

The current diff viewer does not have a column indicator that shows
the character boundary. Adding the feature will allow reviewers to see
when a line exceeds n characters.

We added a red dashed line on the diff viewer at the specified column.
The indicator defaults to 80 characters and the user can specify a
number at the input box on top. With file changes, the indicator shows
on both side of the diff viewer and changes together. We also check
for the maximum column number based on the diff viewer's size. If the
diff viewer is shrunk beyond the indicator, the indicator will be
hidden.

We added the indicator as a div which the CSS property
border-left: 1px dashed red. Whenever the column number is changed,
moveColumnIndicator() does the calculation and moves the indicator
to the new position with jQuery's css(). Although JS function does
the calculations everytime the position changes, in theory, a user
will not be changing the position too often.

Testing Done:

Tested following behaviours:

  • Set column indicator to 0 (check underflow)
  • Set column indicator to 999 (check overflow)
  • Check indicator line

Browsers tested:

  • Chrome (Version 87.0.4280)
  • Edge (Version 87.0.664.5)
  • Firefox (Version 83.0)
  • Safari (Version 14.0.1)

Tested following behaviours:

  • Set column indicator to 0 (check underflow)
  • Set column indicator to 999 (check overflow)
  • Check indicator line

Browsers tested:

  • Chrome (Version 87.0.4280)
  • Edge (Version 87.0.664.5)
  • Firefox (Version 83.0)
  • Safari (Version 14.0.1)

Commits

Files