Scroll a long file list on the download page on its own

A share with hundreds of files made the download page as tall as its
list, so the recipient scrolled far past the buttons. The list now sits
in .share-file-list, capped at min(32rem, 60dvh) with its own scroll, as
the upload page's selected-files list already is; the download buttons
stay on the first screen.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Andreas Reinhold / reini
2026-10-08 22:40:34 +02:00
co-authored by Claude Opus 5.5
parent 63bae2d1a6
commit 6c3202a0cf
3 changed files with 47 additions and 19 deletions
+16
View File
@@ -297,3 +297,19 @@ test('Browse Folder picks a whole folder and keeps each file\'s path in it', fun
$page->assertSee('holiday/docs/notes.txt')
->assertNoJavaScriptErrors();
});
test('a long file list scrolls on its own and keeps the download buttons on the first screen', function () {
$share = app(ShareService::class)->createShare(collect(range(1, 40))->map(fn (int $number): array => [
'file' => UploadedFile::fake()->createWithContent("file-{$number}.txt", "file {$number}"),
'relativePath' => null,
])->all());
$page = ready(visit(route('share.download', $share, false))->resize(1280, 800));
$page->assertScript("(() => {
const list = document.querySelector('[data-test=share-file-list]');
return list.scrollHeight > list.clientHeight && getComputedStyle(list).overflowY === 'auto';
})()")
->assertScript("[...document.querySelectorAll('[data-md-button]')].filter((button) => button.offsetParent !== null && button.textContent.trim().toLowerCase().startsWith('download all')).every((button) => button.getBoundingClientRect().bottom <= window.innerHeight)")
->assertNoJavaScriptErrors();
});