`getValue` cache not invalidating when `accessorFn` is updated

[danny-does-stuff]

TanStack Table version

v8.12.0

Framework/Library version

React v18.2.0

Describe the bug and the steps to reproduce it

When the accessorFn for a column is updated to return a new value, the new value is never displayed in the table. Through a sophisticated series of console.logs, I discovered that when getValue is called on the rerender, the new accessorFn is never called, presumably due to caching on column id.

The use case is a column that displays the name of the person for the current row. We want the user to be able to choose whether to display first or last name first (e.g. Tanner Linsley or Linsley, Tanner). We could just change the column id when the accessorFn is updated, but then we lose the current sort state for that column, ie if the table is currently sorted by name, we want to stay sorted by name after the name format is changed.

Steps to reproduce:

1. Define a column where the accessorFn returns a different value based on some piece of state
2. Update that piece of state
3. The values in the column don't change

Your Minimal, Reproducible Example - (Sandbox Highly Recommended)

https://stackblitz.com/edit/tanstack-table-rnjqkx?file=src%2Fmain.tsx

Screenshots or Videos (Optional)

No response

Do you intend to try to help solve this bug with your own PR?

No, because I do not know how

Terms & Code of Conduct

• [X] I agree to follow this project's Code of Conduct
• [X] I understand that if my bug cannot be reliable reproduced in a debuggable environment, it will probably not be fixed and this issue may even be closed.

[badench]

Any updates on this? I'm seeing the same issue where a piece of state changes the value returned by the accessorFn but the new value isn't being shown in the table

[takoshi]

I found the same issue on my project. I suspect that the following code causes it

https://github.com/TanStack/table/blob/6d89e41533324d62eb17922e49007b4c082609e5/packages/table-core/src/core/row.ts#L113-L129

https://github.com/TanStack/table/blob/6d89e41533324d62eb17922e49007b4c082609e5/packages/table-core/src/utils/getCoreRowModel.ts#L9-L48

Summary

• getInfo function in row returns a cached value if it exists. (Probably) Cached values are not invalidated until the rows are removed from memory.
• Each row is (re)built by createRow in getCoreRowModel. getCoreRowModel only depends on data, so rows are not (re)built by updating columnDefs.

I think there are some ways to fix the bug.

• CoreRow manages accessorFn. If CoreRow detects difference between managed accessorFn and latest one, it will invalidate cached data.
• getCoreRowModel depends on data and columnDefs.

[andbjer]

We had the same issue in our project. The suggested fix in #5582 fixes the issue for us. We've applied the fix with yarn patch until it is merged and released.