3ca05dcb58
Both lists fetched a single capped page (100 / 200) with no pager, so entries past the cap were silently unreachable. Add a reusable LoadMore component that seeds from the streamed first page (preserving the auth gate + inline error handling) and fetches further offset-based pages on demand, and wire it into the bookmarks and collections pages. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
75 lines
2.6 KiB
TypeScript
75 lines
2.6 KiB
TypeScript
import { test, expect, type Page } from './fixtures';
|
|
|
|
// The collections grid pages results: a "Load more" button fetches the next
|
|
// page (offset-based) and appends it, so collections past the first page are
|
|
// reachable rather than silently truncated at the old 200 cap.
|
|
|
|
function collection(i: number) {
|
|
return {
|
|
id: `col-${i}`,
|
|
user_id: 'u1',
|
|
name: `Collection ${i}`,
|
|
description: null,
|
|
created_at: '2026-01-01T00:00:00Z',
|
|
updated_at: '2026-01-01T00:00:00Z',
|
|
manga_count: 0,
|
|
sample_covers: []
|
|
};
|
|
}
|
|
|
|
async function authed(page: Page) {
|
|
await page.route('**/api/v1/auth/config', (r) =>
|
|
r.fulfill({
|
|
status: 200,
|
|
contentType: 'application/json',
|
|
body: JSON.stringify({ self_register_enabled: true, private_mode: false })
|
|
})
|
|
);
|
|
await page.route('**/api/v1/auth/me', (r) =>
|
|
r.fulfill({
|
|
status: 200,
|
|
contentType: 'application/json',
|
|
body: JSON.stringify({
|
|
user: { id: 'u1', username: 'reader', created_at: '2026-01-01T00:00:00Z', is_admin: false }
|
|
})
|
|
})
|
|
);
|
|
await page.route('**/api/v1/auth/me/preferences', (r) =>
|
|
r.fulfill({ status: 200, contentType: 'application/json', body: '{}' })
|
|
);
|
|
await page.route('**/api/v1/me/bookmarks*', (r) =>
|
|
r.fulfill({
|
|
status: 200,
|
|
contentType: 'application/json',
|
|
body: JSON.stringify({ items: [], page: { limit: 50, offset: 0, total: 0 } })
|
|
})
|
|
);
|
|
}
|
|
|
|
test('collections grid loads more pages on demand', async ({ page }) => {
|
|
await authed(page);
|
|
await page.route('**/api/v1/me/collections*', (r) => {
|
|
const offset = Number(new URL(r.request().url()).searchParams.get('offset') ?? '0');
|
|
const items =
|
|
offset === 0
|
|
? Array.from({ length: 60 }, (_, i) => collection(i))
|
|
: Array.from({ length: 5 }, (_, i) => collection(60 + i));
|
|
return r.fulfill({
|
|
status: 200,
|
|
contentType: 'application/json',
|
|
body: JSON.stringify({ items, page: { limit: 60, offset, total: 65 } })
|
|
});
|
|
});
|
|
|
|
await page.goto('/collections');
|
|
|
|
await expect(page.getByText('Collection 0')).toBeVisible();
|
|
await expect(page.getByText('Collection 64')).toHaveCount(0);
|
|
const loadMore = page.getByTestId('load-more');
|
|
await expect(loadMore).toBeVisible();
|
|
|
|
await loadMore.click();
|
|
await expect(page.getByText('Collection 64')).toBeVisible();
|
|
await expect(loadMore).toHaveCount(0);
|
|
});
|