fix: prevent partial rows in table pagination

[jiuyige]

Description

The Table widget could round a fractional pageSize up, which allowed a partially visible row and caused a vertical scrollbar even when the table was intended to fit one page.

This change always floors the calculated pageSize so that only complete fixed-height rows are counted. It also updates the existing Cypress regression coverage for the default, short, and tall row-height modes.

Dynamic page-size calculation for wrapped cells is intentionally out of scope, as discussed in the issue.

Fixes #42004

Testing

• Prettier check for the changed files
• ESLint for the Table widget derived property
• ESLint for the Cypress spec
• yarn check-types
• Pre-commit lint-staged and gitleaks checks
• Deploy preview manual regression for default, short, and tall row-height modes
• Cypress E2E run (the local config requires Appsmith test credentials)

Automation

/ok-to-test tags="@tag.All"

🔍 Cypress test results

Caution

If you modify the content in this section, you are likely to disrupt the CI result for your PR.

Communication

Should the DevRel and Marketing teams inform users about this change?

• Yes
• No

Summary by CodeRabbit

Summary by CodeRabbit

• Bug Fixes

  • Improved TableWidgetV2 pagination/page-size calculations to consistently use floor-based sizing, yielding more predictable rows per page across the default row-height options (including compact modes).

• Tests

  • Updated end-to-end page-size assertions for the TableV2 segmented control to match the new behavior and compare values numerically.
  • Added Jest unit coverage for getPageSize across default, short, and tall scenarios.

[coderabbitai]

Walkthrough

TableV2 now uses updated header heights and always rounds calculated page sizes down. Jest and Cypress tests cover the resulting page-size values for default, short, and tall row-height configurations.

Changes

TableV2 page-size behavior

Layer / File(s)	Summary
Floor page-size calculation and regression coverage app/client/src/widgets/TableWidgetV2/widget/derived.js, app/client/src/widgets/TableWidgetV2/widget/__tests__/derived.test/getPageSize.test.js, app/client/cypress/e2e/Regression/ClientSide/Widgets/TableV2/Pagesize_spec.ts	Header heights change from 38 to 40, getPageSize always applies Math.floor, and tests cover the resulting page sizes for default, short, and tall modes.

Estimated code review effort: 1 (Trivial) | ~5 minutes

Poem

Fractions fall with a gentle sway,
Extra rows now drift away.
Tables fit their measured space,
Scrollbars find a smaller place.
Three checks sing, “The floor is right!”

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Linked Issues check	✅ Passed	The code fixes the reported extra partial-row scrollbar issue by flooring pageSize and updates regression coverage, matching #42004.
Out of Scope Changes check	✅ Passed	The changes stay focused on table page-size calculation and related regression tests, with no clear unrelated scope introduced.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Title check	✅ Passed	The title clearly states the main change: preventing partial rows in table pagination.
Description check	✅ Passed	The PR description covers motivation, issue linkage, testing, automation, and communication per the template.

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In
`@app/client/cypress/e2e/Regression/ClientSide/Widgets/TableV2/Pagesize_spec.ts`:
- Line 27: Update the page-size assertions in the relevant Cypress test to
convert each extracted text value to a number before comparison, covering all
three expectations near the existing $text assertions. Keep the expected
page-size values numeric rather than string literals.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: c8ddf497-0fd8-4e24-be97-2e0ed4f95d14

📥 Commits

Reviewing files that changed from the base of the PR and between 13ee80c and 5dc63a2.

📒 Files selected for processing (2)

• app/client/cypress/e2e/Regression/ClientSide/Widgets/TableV2/Pagesize_spec.ts
• app/client/src/widgets/TableWidgetV2/widget/derived.js

[sebastianiv21]

/build-deploy-preview skip-tests=true

[github-actions]

Deploying Your Preview: https://github.com/appsmithorg/appsmith/actions/runs/29593233548.
Workflow: On demand build Docker image and deploy preview.
skip-tests: true.
env: ``.
PR: 42008.
recreate: .
base-image-tag: .

[github-actions]

Deploy-Preview-URL: https://ce-42008.dp.appsmith.com

[sebastianiv21]

@jiuyige you can test your changes here https://ce-42008.dp.appsmith.com/

[jiuyige]

@jiuyige you can test your changes here https://ce-42008.dp.appsmith.com/

Thanks! I checked the deploy preview and noticed there’s still a 2px vertical overflow. The pageSize calculation uses a 38px header height, but the actual height is 40px.
I’ve pushed a fix in 8bbdb19 and added regression tests for all three row-height modes. Could you rebuild the deploy preview so I can check it again?

[sebastianiv21]

/build-deploy-preview skip-tests=true

[github-actions]

Deploying Your Preview: https://github.com/appsmithorg/appsmith/actions/runs/29605676490.
Workflow: On demand build Docker image and deploy preview.
skip-tests: true.
env: ``.
PR: 42008.
recreate: .
base-image-tag: .

[github-actions]

Deploy-Preview-URL: https://ce-42008.dp.appsmith.com

[sebastianiv21]

@jiuyige you can test it again

[jiuyige]

@jiuyige you can test it again

Thanks for rebuilding the preview! I tested it again, and the scrollbar issue is now fixed for all three row-height options:

Default: 4 rows
Short: 6 rows
Tall: 3 rows

I reloaded the page after each change to make sure the setting persisted. All rows were fully visible, with no extra vertical scrollbar. I switched the table back to Default when I was done.

I also reran the related Jest tests, Prettier, ESLint, and type check locally, and they all passed. The CodeRabbit comment has already been addressed.

I haven’t run the full Cypress E2E suite because it requires test credentials, so I left that item unchecked.

Looks good from my side. Could you take another look when you get a chance?