rename overscan props for Gird with deprecation

This commit is contained in:
Neo
2019-04-30 10:16:33 +08:00
parent f2b2106cc8
commit 481f90d564
5 changed files with 147 additions and 43 deletions
+52 -14
View File
@@ -211,15 +211,15 @@ describe('FixedSizeGrid', () => {
});
});
describe('overscanColumnsCount and overscanRowsCount', () => {
describe('overscanColumnCount and overscanRowCount', () => {
it('should require a minimum of 1 overscan to support tabbing', () => {
ReactTestRenderer.create(
<FixedSizeGrid
{...defaultProps}
initialScrollLeft={250}
initialScrollTop={250}
overscanColumnsCount={0}
overscanRowsCount={0}
overscanColumnCount={0}
overscanRowCount={0}
/>
);
expect(onItemsRendered.mock.calls).toMatchSnapshot();
@@ -231,8 +231,8 @@ describe('FixedSizeGrid', () => {
{...defaultProps}
initialScrollLeft={250}
initialScrollTop={250}
overscanColumnsCount={2}
overscanRowsCount={2}
overscanColumnCount={2}
overscanRowCount={2}
/>
);
rendered.getInstance().scrollTo({ scrollLeft: 1000, scrollTop: 1000 });
@@ -246,8 +246,8 @@ describe('FixedSizeGrid', () => {
{...defaultProps}
initialScrollLeft={250}
initialScrollTop={250}
overscanColumnsCount={2}
overscanRowsCount={2}
overscanColumnCount={2}
overscanRowCount={2}
/>
);
expect(onItemsRendered.mock.calls).toMatchSnapshot();
@@ -259,8 +259,8 @@ describe('FixedSizeGrid', () => {
{...defaultProps}
initialScrollLeft={250}
initialScrollTop={250}
overscanColumnsCount={2}
overscanRowsCount={2}
overscanColumnCount={2}
overscanRowCount={2}
/>
);
expect(onItemsRendered.mock.calls).toMatchSnapshot();
@@ -289,12 +289,17 @@ describe('FixedSizeGrid', () => {
spyOn(console, 'warn');
const renderer = ReactTestRenderer.create(
<FixedSizeGrid {...defaultProps} overscanCount={1} />
<FixedSizeGrid
{...defaultProps}
overscanCount={1}
overscanRowsCount={1}
overscanColumnsCount={1}
/>
);
expect(console.warn).toHaveBeenCalledTimes(1);
expect(console.warn).toHaveBeenLastCalledWith(
'The overscanCount prop has been deprecated. ' +
'Please use the overscanColumnsCount and overscanRowsCount props instead.'
'The overscanCount, overscanColumnsCount and overscanRowsCount props have been deprecated. ' +
'Please use the overscanColumnCount and overscanRowCount props instead.'
);
renderer.update(<FixedSizeGrid {...defaultProps} overscanCount={1} />);
@@ -318,7 +323,7 @@ describe('FixedSizeGrid', () => {
expect(onItemsRendered.mock.calls).toMatchSnapshot();
});
it('should use overscanRowsCount if both it and overscanCount are provided', () => {
it('should use overscanRowCount if both it and overscanCount are provided', () => {
spyOn(console, 'warn');
ReactTestRenderer.create(
@@ -327,7 +332,25 @@ describe('FixedSizeGrid', () => {
initialScrollLeft={100}
initialScrollTop={100}
overscanCount={2}
overscanRowsCount={3}
overscanRowCount={3}
/>
);
expect(onItemsRendered.mock.calls).toMatchSnapshot();
});
it('should use overscanColumnCount and overscanRowCount if both them and deprecated props are provided', () => {
spyOn(console, 'warn');
ReactTestRenderer.create(
<FixedSizeGrid
{...defaultProps}
initialScrollLeft={100}
initialScrollTop={100}
overscanCount={1}
overscanColumnsCount={2}
overscanColumnCount={3}
overscanRowsCount={2}
overscanRowCount={3}
/>
);
expect(onItemsRendered.mock.calls).toMatchSnapshot();
@@ -346,6 +369,21 @@ describe('FixedSizeGrid', () => {
);
expect(onItemsRendered.mock.calls).toMatchSnapshot();
});
it('should support deprecated overscanColumnsCount and overscanRowsCount', () => {
spyOn(console, 'warn');
ReactTestRenderer.create(
<FixedSizeGrid
{...defaultProps}
initialScrollLeft={100}
initialScrollTop={100}
overscanColumnsCount={2}
overscanRowsCount={2}
/>
);
expect(onItemsRendered.mock.calls).toMatchSnapshot();
});
});
});
+10 -10
View File
@@ -106,8 +106,8 @@ describe('VariableSizeGrid', () => {
columnWidth={columnWidth}
estimatedColumnWidth={200}
estimatedRowHeight={100}
overscanColumnsCount={0}
overscanRowsCount={0}
overscanColumnCount={0}
overscanRowCount={0}
rowCount={50}
rowHeight={rowHeight}
/>
@@ -131,8 +131,8 @@ describe('VariableSizeGrid', () => {
columnWidth={columnWidth}
estimatedColumnWidth={200}
estimatedRowHeight={100}
overscanColumnsCount={0}
overscanRowsCount={0}
overscanColumnCount={0}
overscanRowCount={0}
rowCount={50}
rowHeight={rowHeight}
/>
@@ -439,8 +439,8 @@ describe('VariableSizeGrid', () => {
{...defaultProps}
estimatedColumnWidth={30}
estimatedRowHeight={30}
overscanColumnsCount={1}
overscanRowsCount={1}
overscanColumnCount={1}
overscanRowCount={1}
columnWidth={index => 50}
rowHeight={index => 25}
/>
@@ -458,8 +458,8 @@ describe('VariableSizeGrid', () => {
{...defaultProps}
estimatedColumnWidth={30}
estimatedRowHeight={30}
overscanColumnsCount={1}
overscanRowsCount={1}
overscanColumnCount={1}
overscanRowCount={1}
columnWidth={index => 40}
rowHeight={index => 20}
/>
@@ -481,8 +481,8 @@ describe('VariableSizeGrid', () => {
{...defaultProps}
estimatedColumnWidth={30}
estimatedRowHeight={30}
overscanColumnsCount={1}
overscanRowsCount={1}
overscanColumnCount={1}
overscanRowCount={1}
columnWidth={index => 40}
rowHeight={index => 20}
/>
@@ -96,7 +96,7 @@ Array [
]
`;
exports[`FixedSizeGrid overscanColumnsCount and overscanRowsCount overscanCount should support deprecated overscanCount 1`] = `
exports[`FixedSizeGrid overscanColumnCount and overscanRowCount overscanCount should support deprecated overscanColumnsCount and overscanRowsCount 1`] = `
Array [
Array [
Object {
@@ -113,7 +113,41 @@ Array [
]
`;
exports[`FixedSizeGrid overscanColumnsCount and overscanRowsCount overscanCount should use overscanColumnsCount if both it and overscanCount are provided 1`] = `
exports[`FixedSizeGrid overscanColumnCount and overscanRowCount overscanCount should support deprecated overscanCount 1`] = `
Array [
Array [
Object {
"overscanColumnStartIndex": 0,
"overscanColumnStopIndex": 5,
"overscanRowStartIndex": 2,
"overscanRowStopIndex": 10,
"visibleColumnStartIndex": 1,
"visibleColumnStopIndex": 3,
"visibleRowStartIndex": 4,
"visibleRowStopIndex": 8,
},
],
]
`;
exports[`FixedSizeGrid overscanColumnCount and overscanRowCount overscanCount should use overscanColumnCount and overscanRowCount if both them and deprecated props are provided 1`] = `
Array [
Array [
Object {
"overscanColumnStartIndex": 0,
"overscanColumnStopIndex": 6,
"overscanRowStartIndex": 1,
"overscanRowStopIndex": 11,
"visibleColumnStartIndex": 1,
"visibleColumnStopIndex": 3,
"visibleRowStartIndex": 4,
"visibleRowStopIndex": 8,
},
],
]
`;
exports[`FixedSizeGrid overscanColumnCount and overscanRowCount overscanCount should use overscanColumnsCount if both it and overscanCount are provided 1`] = `
Array [
Array [
Object {
@@ -130,7 +164,7 @@ Array [
]
`;
exports[`FixedSizeGrid overscanColumnsCount and overscanRowsCount overscanCount should use overscanRowsCount if both it and overscanCount are provided 1`] = `
exports[`FixedSizeGrid overscanColumnCount and overscanRowCount overscanCount should use overscanRowCount if both it and overscanCount are provided 1`] = `
Array [
Array [
Object {
@@ -147,7 +181,7 @@ Array [
]
`;
exports[`FixedSizeGrid overscanColumnsCount and overscanRowsCount should accommodate a custom overscan 1`] = `
exports[`FixedSizeGrid overscanColumnCount and overscanRowCount should accommodate a custom overscan 1`] = `
Array [
Array [
Object {
@@ -164,7 +198,7 @@ Array [
]
`;
exports[`FixedSizeGrid overscanColumnsCount and overscanRowsCount should not scan past the beginning of the grid 1`] = `
exports[`FixedSizeGrid overscanColumnCount and overscanRowCount should not scan past the beginning of the grid 1`] = `
Array [
Array [
Object {
@@ -181,7 +215,7 @@ Array [
]
`;
exports[`FixedSizeGrid overscanColumnsCount and overscanRowsCount should not scan past the end of the grid 1`] = `
exports[`FixedSizeGrid overscanColumnCount and overscanRowCount should not scan past the end of the grid 1`] = `
Array [
Array [
Object {
@@ -198,7 +232,7 @@ Array [
]
`;
exports[`FixedSizeGrid overscanColumnsCount and overscanRowsCount should overscan in both directions when not scrolling 1`] = `
exports[`FixedSizeGrid overscanColumnCount and overscanRowCount should overscan in both directions when not scrolling 1`] = `
Array [
Array [
Object {
@@ -215,7 +249,7 @@ Array [
]
`;
exports[`FixedSizeGrid overscanColumnsCount and overscanRowsCount should overscan in the direction being scrolled 1`] = `
exports[`FixedSizeGrid overscanColumnCount and overscanRowCount should overscan in the direction being scrolled 1`] = `
Array [
Array [
Object {
@@ -256,7 +290,7 @@ Array [
]
`;
exports[`FixedSizeGrid overscanColumnsCount and overscanRowsCount should require a minimum of 1 overscan to support tabbing 1`] = `
exports[`FixedSizeGrid overscanColumnCount and overscanRowCount should require a minimum of 1 overscan to support tabbing 1`] = `
Array [
Array [
Object {
+15 -7
View File
@@ -69,9 +69,11 @@ export type Props<T> = {|
outerRef?: any,
outerElementType?: React$ElementType,
outerTagName?: string, // deprecated
overscanColumnsCount?: number,
overscanColumnCount?: number,
overscanColumnsCount?: number, // deprecated
overscanCount?: number, // deprecated
overscanRowsCount?: number,
overscanRowCount?: number,
overscanRowsCount?: number, // deprecated
rowCount: number,
rowHeight: itemSize,
style?: Object,
@@ -586,6 +588,7 @@ export default function createGridComponent({
_getHorizontalRangeToRender(): [number, number, number, number] {
const {
columnCount,
overscanColumnCount,
overscanColumnsCount,
overscanCount,
rowCount,
@@ -593,7 +596,7 @@ export default function createGridComponent({
const { horizontalScrollDirection, isScrolling, scrollLeft } = this.state;
const overscanCountResolved: number =
overscanColumnsCount || overscanCount || 1;
overscanColumnCount || overscanColumnsCount || overscanCount || 1;
if (columnCount === 0 || rowCount === 0) {
return [0, 0, 0, 0];
@@ -634,13 +637,14 @@ export default function createGridComponent({
const {
columnCount,
overscanCount,
overscanRowCount,
overscanRowsCount,
rowCount,
} = this.props;
const { isScrolling, verticalScrollDirection, scrollTop } = this.state;
const overscanCountResolved: number =
overscanRowsCount || overscanCount || 1;
overscanRowCount || overscanRowsCount || overscanCount || 1;
if (columnCount === 0 || rowCount === 0) {
return [0, 0, 0, 0];
@@ -774,12 +778,16 @@ const validateSharedProps = (
{ instance }: State
): void => {
if (process.env.NODE_ENV !== 'production') {
if (typeof overscanCount === 'number') {
if (
typeof overscanCount === 'number' ||
typeof overscanColumnsCount === 'number' ||
typeof overscanRowsCount === 'number'
) {
if (devWarningsOverscanCount && !devWarningsOverscanCount.has(instance)) {
devWarningsOverscanCount.add(instance);
console.warn(
'The overscanCount prop has been deprecated. ' +
'Please use the overscanColumnsCount and overscanRowsCount props instead.'
'The overscanCount, overscanColumnsCount and overscanRowsCount props have been deprecated. ' +
'Please use the overscanColumnCount and overscanRowCount props instead.'
);
}
}
+27 -3
View File
@@ -267,6 +267,18 @@ const PROPS = [
name: 'outerTagName',
type: 'string',
},
{
description: (
<p>
<strong className={styles.DeprecatedProp}>
This property has been deprecated.
</strong>{' '}
Please use the <code>overscanColumnCount</code> property instead.
</p>
),
name: 'overscanColumnsCount',
type: 'number',
},
{
defaultValue: 1,
description: (
@@ -291,7 +303,7 @@ const PROPS = [
</p>
</Fragment>
),
name: 'overscanColumnsCount',
name: 'overscanColumnCount',
type: 'number',
},
{
@@ -300,13 +312,25 @@ const PROPS = [
<strong className={styles.DeprecatedProp}>
This property has been deprecated.
</strong>{' '}
Please use the <code>overscanColumnsCount</code> and{' '}
<code>overscanRowsCount</code> properties instead.
Please use the <code>overscanColumnCount</code> and{' '}
<code>overscanRowCount</code> properties instead.
</p>
),
name: 'overscanCount',
type: 'number',
},
{
description: (
<p>
<strong className={styles.DeprecatedProp}>
This property has been deprecated.
</strong>{' '}
Please use the <code>overscanRowCount</code> property instead.
</p>
),
name: 'overscanRowsCount',
type: 'number',
},
{
defaultValue: 1,
description: (