mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-14 18:01:06 +00:00
Code Issues Projects Releases Packages Wiki Activity

fix(pagination): on:change dispatches with correct value

Browse source
This commit is contained in:
Eric Liu 2025-08-26 20:00:21 -07:00
commit 6f857ce325
2 changed files with 27 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/Pagination/Pagination.svelte
View file

@ -135,8 +135,8 @@
hideLabel
noLabel
inline
on:change={() => {
dispatch("change", { pageSize });
on:update={(event) => {
dispatch("change", { pageSize: event.detail });
}}
bind:selected={pageSize}
>
@ -165,8 +165,8 @@
labelText="Page number, of {totalPages} pages"
inline
hideLabel
on:change={() => {
dispatch("change", { page });
on:update={(event) => {
dispatch("change", { page: event.detail });
}}
bind:selected={page}
>

27
tests/Pagination/Pagination.test.ts
View file

@ -75,7 +75,7 @@ describe("Pagination", () => {
const select = screen.getByRole("combobox", { name: "Items per page:" });
await user.selectOptions(select, "15");
expect(consoleLog).toHaveBeenCalledWith("change", { pageSize: 10 });
expect(consoleLog).toHaveBeenCalledWith("change", { pageSize: 15 });
expect(consoleLog).toHaveBeenCalledWith("update", {
pageSize: 15,
page: 1,
@ -91,7 +91,7 @@ describe("Pagination", () => {
const pageSelect = screen.getAllByRole("combobox");
await user.selectOptions(pageSelect[0], "5");
expect(consoleLog).toHaveBeenCalledWith("change", { pageSize: 10 });
expect(consoleLog).toHaveBeenCalledWith("change", { pageSize: 5 });
expect(consoleLog).toHaveBeenCalledWith("update", { pageSize: 5, page: 1 });
});
@ -169,7 +169,7 @@ describe("Pagination", () => {
// Change page size
const pageSizeSelect = screen.getAllByRole("combobox");
await user.selectOptions(pageSizeSelect[0], "15");
expect(consoleLog).toHaveBeenCalledWith("change", { pageSize: 10 });
expect(consoleLog).toHaveBeenCalledWith("change", { pageSize: 15 });
expect(consoleLog).toHaveBeenCalledWith("update", {
pageSize: 15,
page: 1,
@ -178,7 +178,7 @@ describe("Pagination", () => {
// Change page
const pageSelect = screen.getAllByRole("combobox");
await user.selectOptions(pageSelect[1], "2");
expect(consoleLog).toHaveBeenCalledWith("change", { pageSize: 10 });
expect(consoleLog).toHaveBeenCalledWith("change", { page: 2 });
expect(consoleLog).toHaveBeenCalledWith("update", {
pageSize: 15,
page: 2,
@ -257,4 +257,23 @@ describe("Pagination", () => {
expect(screen.getByText(/1–10 of 100000/)).toBeInTheDocument();
});
it("should dispatch change event with new value, not previous value", async () => {
const consoleLog = vi.spyOn(console, "log");
render(Pagination, {
props: { totalItems: 102, pageSizes: [10, 15, 20] },
});
const pageSizeSelect = screen.getByRole("combobox", {
name: "Items per page:",
});
await user.selectOptions(pageSizeSelect, "15");
expect(consoleLog).toHaveBeenCalledWith("change", { pageSize: 15 });
const pageSelect = screen.getAllByRole("combobox")[1];
await user.selectOptions(pageSelect, "2");
expect(consoleLog).toHaveBeenCalledWith("change", { page: 2 });
});
});