Page MenuHomePhabricator

In source views, wrap display tabs in "user-select: all" to improve cursor selection behavior
ClosedPublic

Authored by epriestley on Jul 17 2020, 10:07 PM.
Tags
None
Referenced Files
Unknown Object (File)
Mon, Dec 2, 12:09 PM
Unknown Object (File)
Sun, Dec 1, 5:14 PM
Unknown Object (File)
Fri, Nov 29, 2:26 PM
Unknown Object (File)
Mon, Nov 25, 1:28 PM
Unknown Object (File)
Sat, Nov 23, 3:26 PM
Unknown Object (File)
Nov 22 2024, 4:03 PM
Unknown Object (File)
Nov 18 2024, 6:21 PM
Unknown Object (File)
Oct 24 2024, 4:39 AM
Subscribers
None

Details

Summary

Ref T2495. See PHI1814. Currently, Phabricator replaces tabs with spaces when rendering diffs.

This may or may not be the best behavior in the long term, but it gives us more control over expansion of tabs than using tab literals.

However, one downside is that you can use your mouse cursor to select "half a tab", and can't use your mouse cursor to distinguish between tabs and spaces. Although you probably shouldn't be doing this, this behavior is less accurate/correct than selecting the entire block as a single unit.

A specific correctness issue with this behavior is that the entire block is copied to the clipboard as a tab literal if you select any of it, so two different visual selection ranges can produce the same clipboard content.

This particular behavior can be improved with "user-select: all", to instruct browsers to select the entire element as a single logical element. Now, selecting part of the tab selects the whole thing, as though it were really a tab literal.

(Some future change might abandon this approach and opt to use real tab literals with "tab-size" CSS, but we lose some ability to control alignment behavior if we do that and it doesn't have any obvious advantages over this approach other than cursor selection behavior.)

Test Plan
  • In Safari and Firefox, dragged text to select a whitespace-expanded tab literal. Saw browsers select the whole sequence as though it were a single tab.
  • In Chorme, this also mostly works, but there's some glitchiness and flickering. I think this is still a net improvement, it's just not as smooth as Safari and Firefox.

Diff Detail

Repository
rP Phabricator
Lint
Lint Not Applicable
Unit
Tests Not Applicable