Skip to content

TablePagination deprecated props in 4.x.x introduced breaking changes #27192

@dhallstr

Description

@dhallstr

While prop deprecation is intended to be a non-breaking change, there is a corner case in TablePagination where renaming the onChangePage prop breaks existing code. Specifically, using TablePagination with a custom ActionsComponent is broken because the prop provided to the custom ActionsComponent has changed from onChangePage -> onPageChange.

  • The issue is present in the latest release.
  • I have searched the issues of this repository and believe that this is not a duplicate.

Current Behavior 😯

TablePagination no longer passes the custom ActionsComponent an onChangePage prop, causing the app to crash.

Expected Behavior 🤔

TablePagination should pass both onChangePage and onPageChange props to the ActionsComponent to support both the deprecated prop and the new prop.

Steps to Reproduce 🕹

The following CodeSandbox live examples contain exactly the same code, just using different MUI versions to demonstrate the breaking changes introduced in v4.12.0.

Working CodeSandbox with MUI v4.11.4: https://codesandbox.io/s/inspiring-jepsen-n2eyf?file=/src/Demo.tsx
Broken CodeSandbox with MUI v4.12.1: https://codesandbox.io/s/polished-butterfly-ym3u5

Steps:

  1. Render a <TablePagination> component with the deprecated onChangePage prop and a custom ActionsComponent prop
  2. Within the custom ActionsComponent, try calling props.onChangePage that worked prior to v4.12.0
  3. Click the Next or Previous button rendered within the custom ActionsComponent
  4. Notice that onChangePage is undefined, causing the app to crash.

Context 🔦

Your Environment 🌎

`npx @material-ui/envinfo`
System:
    OS: Windows 10 10.0.18363
  Binaries:
    Node: 14.16.0
    Yarn: Not Found
    npm: 6.14.13
  Browsers:
    Chrome: 91.0.4472.124
    Edge: Spartan (44.18362.1593.0)
  npmPackages:
    @material-ui/core: 4.12.1
    @material-ui/icons:  4.11.2
    @material-ui/styles:  4.11.4
    @material-ui/system:  4.12.1
    @material-ui/types:  5.1.0
    @material-ui/utils:  4.11.2
    @types/react:  17.0.13
    react: ^16.13.1 => 16.14.0
    react-dom: ^16.13.1 => 16.14.0
    typescript:  2.9.2

Metadata

Metadata

Assignees

Labels

ready to takeHelp wanted. Guidance available. There is a high chance the change will be acceptedscope: tableChanges related to the table.type: bugIt doesn't behave as expected.v5.x migration

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions