Selection Handles Sampler

#451833352 -- Long-press to select text on Android

Selection handles (teardrops) are Android-only UI. On desktop this page just shows the CSS scenarios. Use an Android device/emulator with the test APKs.

Blink Non-composited inputs

BUG: height: 40px; line-height: 50px

Overflows clip by 10px. Both APKs should show handles (blink fix merged).

BUG: height: 30px; line-height: 60px

Extreme overflow. Both APKs should show handles.

OK: height: 40px; line-height: 40px

No overflow. Always works.

CC Composited inputs

These inputs are on composited layers. Selection visibility goes through ComputeViewportSelectionBound in CC.
patched.apk = handles visible. unpatched.apk = handles may be hidden.

CC: will-change: transform + overflow

Composited via will-change. CC path determines handle visibility.

CC: translateZ(0) + overflow

Composited via translateZ(0). Same CC path.

CC: extreme overflow, composited

line-height is double the height on a composited layer.

CC: composited container with clip

Input in a composited container with overflow:hidden clipping the edge.

CC: scrollable composited container

Filler to make scrollable. Scroll and try selecting at different positions.

Scrollable composited area. Selection bounds go through CC scroll path.

Controls (no overflow)

OK: normal input

No overflow, no compositing. Always works.

OK: composited, no overflow

Composited but no overflow. Always works.