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>
74 lines
2.7 KiB
TypeScript
74 lines
2.7 KiB
TypeScript
import { test, expect, type Page } from './fixtures';
|
|
|
|
// The bookmarks list pages the results: the first 50 load with the page, and a
|
|
// "Load more" button fetches the next page (offset-based) and appends it, so
|
|
// bookmarks past the first page are reachable rather than silently truncated.
|
|
|
|
function bookmark(i: number) {
|
|
return {
|
|
id: `bm-${i}`,
|
|
manga_id: `m-${i}`,
|
|
manga_title: `Manga ${i}`,
|
|
manga_cover_image_path: null,
|
|
chapter_id: null,
|
|
chapter_number: null,
|
|
page: null,
|
|
created_at: '2026-01-01T00:00:00Z'
|
|
};
|
|
}
|
|
|
|
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/files/**', (r) => r.fulfill({ status: 200, body: '' }));
|
|
}
|
|
|
|
test('bookmarks list loads more pages on demand', async ({ page }) => {
|
|
await authed(page);
|
|
// total = 60: first page 50 (offset 0), second page 10 (offset 50).
|
|
await page.route('**/api/v1/me/bookmarks*', (r) => {
|
|
const url = new URL(r.request().url());
|
|
const offset = Number(url.searchParams.get('offset') ?? '0');
|
|
const items =
|
|
offset === 0
|
|
? Array.from({ length: 50 }, (_, i) => bookmark(i))
|
|
: Array.from({ length: 10 }, (_, i) => bookmark(50 + i));
|
|
return r.fulfill({
|
|
status: 200,
|
|
contentType: 'application/json',
|
|
body: JSON.stringify({ items, page: { limit: 50, offset, total: 60 } })
|
|
});
|
|
});
|
|
|
|
await page.goto('/bookmarks');
|
|
|
|
// First page rendered; more remain so the button shows.
|
|
await expect(page.getByText('Manga 0')).toBeVisible();
|
|
await expect(page.getByText('Manga 49')).toBeVisible();
|
|
await expect(page.getByText('Manga 50')).toHaveCount(0);
|
|
const loadMore = page.getByTestId('load-more');
|
|
await expect(loadMore).toBeVisible();
|
|
|
|
// Load the rest; the button disappears once everything is shown.
|
|
await loadMore.click();
|
|
await expect(page.getByText('Manga 59')).toBeVisible();
|
|
await expect(loadMore).toHaveCount(0);
|
|
});
|