Skip to content

fix(table-core): skip state update in toggleExpanded when state is unchanged#6184

Open
isaackaara wants to merge 2 commits intoTanStack:mainfrom
isaackaara:fix/toggle-expanded-no-op-rerender-v8
Open

fix(table-core): skip state update in toggleExpanded when state is unchanged#6184
isaackaara wants to merge 2 commits intoTanStack:mainfrom
isaackaara:fix/toggle-expanded-no-op-rerender-v8

Conversation

@isaackaara
Copy link

Problem

Calling row.toggleExpanded(false) when the row is already collapsed (or row.toggleExpanded(true) when already expanded) triggers onExpandedChange and causes an unnecessary re-render of the entire table.

As reported in #6136, this causes noticeable UI freezes when toggleExpanded is called in high-frequency event handlers like onBlur.

Root Cause

The toggleExpanded function passes an updater to table.setExpanded() unconditionally, even when the desired state matches the current state. While the updater returns old (same reference) when no change is needed, onExpandedChange is still invoked with the updater function, triggering React's state update flow.

Fix

Added an early return that checks the current expanded state via row.getIsExpanded() before calling table.setExpanded(). If the desired state matches the current state, the function returns immediately, avoiding the unnecessary state update entirely.

Before (workaround required)

// User had to manually check state before calling toggleExpanded
if (newValue === '') row.getIsExpanded() && row.toggleExpanded(false)
else !row.getIsExpanded() && row.toggleExpanded(true)

After

// toggleExpanded now handles this internally
if (newValue === '') row.toggleExpanded(false)
else row.toggleExpanded(true)

Closes #6136

…changed

When calling row.toggleExpanded(bool) with a value matching the
current expanded state, the function would still trigger
onExpandedChange and cause unnecessary re-renders.

This adds an early return that checks the current expanded state
before proceeding with the state update, avoiding the overhead of
calling onExpandedChange when no state change is needed.

Closes TanStack#6136
@changeset-bot
Copy link

changeset-bot bot commented Mar 4, 2026

🦋 Changeset detected

Latest commit: 6cd1aa9

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 9 packages
Name Type
@tanstack/table-core Patch
@tanstack/angular-table Patch
@tanstack/lit-table Patch
@tanstack/qwik-table Patch
@tanstack/react-table Patch
@tanstack/solid-table Patch
@tanstack/svelte-table Patch
@tanstack/vue-table Patch
@tanstack/react-table-devtools Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Mar 4, 2026

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 0f2bf87c-705e-4152-97ad-b0242277ccd1

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

  • 🔍 Trigger review
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment

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

Comment @coderabbitai help to get the list of available commands and usage tips.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant