diff --git a/packages/material-ui/src/TablePagination/TablePagination.js b/packages/material-ui/src/TablePagination/TablePagination.js
index 62ce0ed1264adc..5f75bc45979db7 100644
--- a/packages/material-ui/src/TablePagination/TablePagination.js
+++ b/packages/material-ui/src/TablePagination/TablePagination.js
@@ -246,6 +246,11 @@ TablePagination.propTypes = {
*/
page: chainPropTypes(PropTypes.number.isRequired, props => {
const { count, page, rowsPerPage } = props;
+
+ if (count === -1) {
+ return null;
+ }
+
const newLastPage = Math.max(0, Math.ceil(count / rowsPerPage) - 1);
if (page < 0 || page > newLastPage) {
return new Error(
diff --git a/packages/material-ui/src/TablePagination/TablePagination.test.js b/packages/material-ui/src/TablePagination/TablePagination.test.js
index b82fb648cf4f20..c59e1ea5571bcd 100644
--- a/packages/material-ui/src/TablePagination/TablePagination.test.js
+++ b/packages/material-ui/src/TablePagination/TablePagination.test.js
@@ -1,7 +1,8 @@
import * as React from 'react';
-import { assert } from 'chai';
+import { expect, assert } from 'chai';
import PropTypes from 'prop-types';
import { createMount, getClasses } from '@material-ui/core/test-utils';
+import { fireEvent, createClientRender } from 'test/utils/createClientRender';
import describeConformance from '../test-utils/describeConformance';
import consoleErrorMock from 'test/utils/consoleErrorMock';
import Select from '../Select';
@@ -16,6 +17,7 @@ describe('', () => {
const noop = () => {};
let classes;
let mount;
+ const render = createClientRender();
function mountInTable(node) {
const wrapper = mount(
@@ -32,11 +34,14 @@ describe('', () => {
classes = getClasses(
{}} page={0} rowsPerPage={10} />,
);
- // StrictModeViolation: test uses #html()
+ });
+
+ beforeEach(() => {
+ // StrictModeViolation: test uses #html()()
mount = createMount({ strict: false });
});
- after(() => {
+ afterEach(() => {
mount.cleanUp();
});
@@ -248,6 +253,36 @@ describe('', () => {
});
});
+ describe('prop: count=-1', () => {
+ it('should display the "of more than" text and keep the nextButton enabled', () => {
+ const Test = () => {
+ const [page, setPage] = React.useState(0);
+ return (
+
+
+
+ {
+ setPage(newPage);
+ }}
+ />
+
+
+
+ );
+ };
+
+ const { container, getByLabelText } = render();
+
+ expect(container).to.have.text('Rows per page:101-10 of more than 10');
+ fireEvent.click(getByLabelText('Next page'));
+ expect(container).to.have.text('Rows per page:1011-20 of more than 20');
+ });
+ });
+
describe('warnings', () => {
before(() => {
consoleErrorMock.spy();
@@ -282,33 +317,4 @@ describe('', () => {
);
});
});
-
- it('should display the "of more than" text and keep the nextButton enabled, if count is -1 ', () => {
- const wrapper = mount(
- ,
- );
-
- assert.strictEqual(
- wrapper
- .find(Typography)
- .at(0)
- .text(),
- '1-5 of more than 5',
- );
- const nextButton = wrapper.find(IconButton).at(1);
- assert.strictEqual(nextButton.props().disabled, false);
- });
});