Bug 236142

Summary:

Adding padding on a horizontal scroller prevents last item from being fully viewable

Product:

WebKit

Reporter:

Charlie Croom <charlie.croom>

Component:

Layout and Rendering

Assignee:

alan <zalan>

Status:

RESOLVED FIXED

Severity:

Normal

CC:

bfulgham, changseok, esprehn+autocc, ews-watchlist, glenn, kondapallykalyan, pdr, simon.fraser, webkit-bug-importer, zalan

Priority:

Keywords:

BrowserCompat, InRadar

Version:

Safari Technology Preview

Hardware:

All

OS:

All

See Also:

https://bugs.webkit.org/show_bug.cgi?id=95032
https://bugs.webkit.org/show_bug.cgi?id=201453
https://bugs.webkit.org/show_bug.cgi?id=241461

Bug Depends on:

241689

Bug Blocks:

Attachments:

Description	Flags
Test case	none
Patch	none
Patch	none
Patch	none
Test reduction	none
Patch	none
Patch	none

Charlie Croom

Reported 2022-02-04 09:53:32 PST

When a scrollable element has padding added to it, the last item can never be scrolled into view. This appears to be because there's not enough scrollable area added. Potentially related: the `scrollWidth` property appears to be smaller than that of Chrome and Firefox. Reduced repro (see Firefox/Chrome handling): https://jsfiddle.net/comp615/Lf15jkgp/15/ The example kind of illustrates Twitter's use case. We want to show a preview/peek of the next item, or to overflow the parent, while still aligning the scroller to the parent layout). Potentially related bugs: #95032 #201453

Attachments
Test case (1.18 KB, text/html) 2022-02-25 15:05 PST, Simon Fraser (smfr)	no flags	Details
Patch (3.95 KB, patch) 2022-06-16 21:24 PDT, alan	no flags	Details Formatted Diff Diff
Patch (5.43 KB, patch) 2022-06-17 11:49 PDT, alan	no flags	Details Formatted Diff Diff
Patch (8.86 KB, patch) 2022-06-18 07:06 PDT, alan	no flags	Details Formatted Diff Diff
Test reduction (471 bytes, text/html) 2022-06-21 16:57 PDT, alan	no flags	Details
Patch (3.21 KB, patch) 2022-06-22 11:56 PDT, alan	no flags	Details Formatted Diff Diff
Patch (4.17 KB, patch) 2022-06-22 13:24 PDT, alan	no flags	Details Formatted Diff Diff
Show Obsolete (4) View All Add attachment proposed patch, testcase, etc.

Simon Fraser (smfr)

Comment 1 2022-02-04 10:03:06 PST

This does indeed look like a rather serious bug.

Radar WebKit Bug Importer

Comment 2 2022-02-04 10:03:20 PST

<rdar://problem/88495053>

Simon Fraser (smfr)

Comment 3 2022-02-25 15:05:05 PST

Created attachment 453268 [details] Test case

Simon Fraser (smfr)

Comment 4 2022-02-25 15:30:34 PST

This works for vertical scrollers, but not horizontal scrollers. For vertical scrollers, the padding is taken into account by the `oldClientAfterEdge` value passed in to `computeOverflow()`, which comes from clientLogicalBottom(). But there is no equivalent logic for horizontal padding.

Simon Fraser (smfr)

Comment 5 2022-02-25 15:30:54 PST

This is about the computation of layout overflow.

alan

Comment 6 2022-06-16 21:24:56 PDT

Created attachment 460292 [details] Patch

alan

Comment 7 2022-06-17 11:49:42 PDT

Created attachment 460305 [details] Patch

alan

Comment 8 2022-06-18 07:06:01 PDT

Created attachment 460330 [details] Patch