diff --git a/packages/calcite-components/src/components/pagination/pagination.e2e.ts b/packages/calcite-components/src/components/pagination/pagination.e2e.ts index a7d678eb83a..b1d3d725570 100644 --- a/packages/calcite-components/src/components/pagination/pagination.e2e.ts +++ b/packages/calcite-components/src/components/pagination/pagination.e2e.ts @@ -183,15 +183,36 @@ describe("calcite-pagination", () => { expect(toggleSpy).toHaveReceivedEventTimes(2); }); }); + describe("start-item", () => { - it("checks page defaults to 1 when start-item is negative", async () => { + const testCases = [ + { + name: "page defaults to 1 when page-size equals total-items", + html: ``, + }, + { + name: "page defaults to 1 when page-size is less than total-items", + html: ``, + }, + { + name: "page defaults to 1 when page-size is greater than total-items", + html: ``, + }, + { + name: "page defaults to 1 when start-item is negative", + html: ``, + }, + ]; + + it.each(testCases)("$name", async ({ html }) => { const page = await newE2EPage(); - await page.setContent(``); + await page.setContent(html); const links = await findAll(page, `calcite-pagination >>> .${CSS.page}`); - expect(links.length).toBe(1); + expect(links).toHaveLength(1); expect(await links[0].getProperty("value")).toBe("1"); }); }); + describe("showing one item at a time", () => { let page: E2EPage; let pagination: E2EElement; diff --git a/packages/calcite-components/src/components/pagination/pagination.tsx b/packages/calcite-components/src/components/pagination/pagination.tsx index 490242c992f..a9a50a6d8aa 100644 --- a/packages/calcite-components/src/components/pagination/pagination.tsx +++ b/packages/calcite-components/src/components/pagination/pagination.tsx @@ -232,16 +232,8 @@ export class Pagination extends LitElement { } private handleLastStartItemChange(): void { - const { totalItems, pageSize, totalPages } = this; - - const isStartNegative = totalItems - pageSize < 0; - - this.lastStartItem = - (totalItems % pageSize === 0 - ? isStartNegative - ? 0 - : totalItems - pageSize - : Math.floor(totalPages) * pageSize) + 1; + const { totalItems, pageSize } = this; + this.lastStartItem = Math.max(1, Math.floor((totalItems - 1) / pageSize) * pageSize + 1); } private handleIsXXSmall(): void {