Skip to main content
Back to Dev generators

Dev

Mock Pagination Response Generator

Used by developers, writers, and creators worldwide.

A mock pagination response generator gives frontend and backend developers a complete, realistic JSON payload without waiting for a live API. Paste the output directly into MSW handlers, Jest fixtures, or Postman collections and start building list views, data tables, and infinite scroll components immediately. Configure three inputs — items per page, current page, and total items — and every derived field is computed for you: total_pages, has_next, has_prev, next_page, prev_page, and from/to range indicators. Pagination edge cases are where bugs hide. The last page returning fewer items than the page size, a single-page result set, or a current page beyond the total range all behave differently. This tool generates accurate metadata for every scenario automatically.

Loading usage…

Free forever — no account required

How to use

  1. Choose your options above
  2. Click Generate
  3. Copy your result

Detailed instructions

  1. Set 'Items per Page' to the page size your real API will use, such as 10, 25, or 50.
  2. Enter the 'Current Page' number you want to simulate, starting at 1 for the first page.
  3. Set 'Total Items' to your expected dataset size, including odd numbers to test partial last pages.
  4. Click Generate to produce a complete JSON response with all pagination metadata computed.
  5. Copy the output and paste it into your test fixture, MSW handler, or API documentation example.

Use Cases

  • •Populating a TanStack Table or AG Grid component before the backend API exists
  • •Creating MSW (Mock Service Worker) handler responses for paginated REST endpoints
  • •Testing last-page partial-item behavior with 97 total items and 10 per page in Vitest
  • •Generating JSON Server fixture files to power local development with realistic pagination
  • •Writing accurate, runnable pagination examples in OpenAPI or Postman collection documentation

Tips

  • →Test page 1, a middle page, and the exact last page separately — UI bugs often appear only at boundaries.
  • →Use a total like 101 with page size 10 to force an 11-page scenario and quickly spot off-by-one errors in your page count display.
  • →If your framework uses 0-indexed pages internally, generate with page 1 and adjust the current_page value in your fixture before committing.
  • →Pair the generated JSON with MSW's runtime handler so different page parameters return different generated responses without maintaining multiple files.
  • →Set total items to 0 to generate an empty-state response and verify your UI shows the correct 'no results' message instead of broken pagination controls.
  • →Match your real API's field naming conventions — if your backend uses camelCase (totalPages vs total_pages), do a quick find-and-replace on the output before using it in tests.

FAQ

how do I mock a paginated API response for Jest or Vitest tests

Generate a response with your desired page size, current page, and total items, then paste the JSON into a fixture file or inline it as your API mock's return value. Fields like total_pages and has_next are already computed, so your assertions can check pagination state without extra setup logic. This works equally well with React Query, SWR, and TanStack Query test patterns.

how do I simulate the last page returning fewer items than the page size

Set total items to a number that doesn't divide evenly by page size — for example, 97 items with 10 per page — then set current page to 10. The generator returns 7 items in the data array, sets has_next to false, and calculates the correct from/to range. This is the fastest way to catch UI bugs that only surface on the final page.

what's the difference between the from/to fields and the page/page_size fields

page and page_size describe the pagination parameters themselves. from and to are derived fields showing the absolute item index range on the current page — for example, items 21 to 30 on page 3 of a 10-per-page result set. Most table UIs display 'Showing 21–30 of 97 results' directly from these fields without any extra calculation on your end.