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 {