Permalink
Browse files

fix bug: flipped leading/trailing separators.updateProps

Reviewed By: thechefchen

Differential Revision: D4964000

fbshipit-source-id: bd0562e30811d6206cd5441f6a9413c4b503bbfa
  • Loading branch information...
sahrens authored and facebook-github-bot committed Apr 27, 2017
1 parent d5a6152 commit 5c7c65e964f9c8e516ebbd6fc8e812ff915d368c
@@ -867,7 +867,7 @@ class CellRenderer extends React.Component {
},
updateProps: (select: 'leading' | 'trailing', newProps: Object) => {
const {cellKey, prevCellKey} = this.props;
this.props.onUpdateSeparators([select === 'leading' ? cellKey : prevCellKey], newProps);
this.props.onUpdateSeparators([select === 'leading' ? prevCellKey : cellKey], newProps);
},
};
@@ -57,7 +57,6 @@ describe('VirtualizedList', () => {
data={new Array(5).fill().map((_, ii) => ({id: String(ii)}))}
keyExtractor={(item, index) => item.id}
getItemLayout={({index}) => ({length: 50, offset: index * 50})}
numColumns={2}
refreshing={false}
onRefresh={jest.fn()}
renderItem={({item}) => <item value={item.id} />}
@@ -77,4 +76,24 @@ describe('VirtualizedList', () => {
);
expect(component).toMatchSnapshot();
});
it('handles separators correctly', () => {
const infos = [];
const component = ReactTestRenderer.create(
<VirtualizedList
ItemSeparatorComponent={(props) => <separator {...props} />}
data={[{key: 'i0'}, {key: 'i1'}, {key: 'i2'}]}
renderItem={(info) => {
infos.push(info);
return <item title={info.item.key} />;
}}
/>
);
expect(component).toMatchSnapshot();
infos[1].separators.highlight();
expect(component).toMatchSnapshot();
infos[2].separators.updateProps('leading', {press: true});
expect(component).toMatchSnapshot();
infos[1].separators.unhighlight();
});
});
@@ -1,5 +1,243 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`VirtualizedList handles separators correctly 1`] = `
<RCTScrollView
ItemSeparatorComponent={[Function]}
data={
Array [
Object {
"key": "i0",
},
Object {
"key": "i1",
},
Object {
"key": "i2",
},
]
}
disableVirtualization={false}
getItem={[Function]}
getItemCount={[Function]}
horizontal={false}
initialNumToRender={10}
keyExtractor={[Function]}
maxToRenderPerBatch={10}
onContentSizeChange={[Function]}
onEndReachedThreshold={2}
onLayout={[Function]}
onMomentumScrollEnd={[Function]}
onScroll={[Function]}
onScrollBeginDrag={[Function]}
onScrollEndDrag={[Function]}
renderItem={[Function]}
renderScrollComponent={[Function]}
scrollEventThrottle={50}
stickyHeaderIndices={Array []}
updateCellsBatchingPeriod={50}
windowSize={21}
>
<View>
<View
onLayout={[Function]}
>
<item
title="i0"
/>
<separator
highlighted={false}
leadingItem={
Object {
"key": "i0",
}
}
/>
</View>
<View
onLayout={[Function]}
>
<item
title="i1"
/>
<separator
highlighted={false}
leadingItem={
Object {
"key": "i1",
}
}
/>
</View>
<View
onLayout={[Function]}
>
<item
title="i2"
/>
</View>
</View>
</RCTScrollView>
`;
exports[`VirtualizedList handles separators correctly 2`] = `
<RCTScrollView
ItemSeparatorComponent={[Function]}
data={
Array [
Object {
"key": "i0",
},
Object {
"key": "i1",
},
Object {
"key": "i2",
},
]
}
disableVirtualization={false}
getItem={[Function]}
getItemCount={[Function]}
horizontal={false}
initialNumToRender={10}
keyExtractor={[Function]}
maxToRenderPerBatch={10}
onContentSizeChange={[Function]}
onEndReachedThreshold={2}
onLayout={[Function]}
onMomentumScrollEnd={[Function]}
onScroll={[Function]}
onScrollBeginDrag={[Function]}
onScrollEndDrag={[Function]}
renderItem={[Function]}
renderScrollComponent={[Function]}
scrollEventThrottle={50}
stickyHeaderIndices={Array []}
updateCellsBatchingPeriod={50}
windowSize={21}
>
<View>
<View
onLayout={[Function]}
>
<item
title="i0"
/>
<separator
highlighted={true}
leadingItem={
Object {
"key": "i0",
}
}
/>
</View>
<View
onLayout={[Function]}
>
<item
title="i1"
/>
<separator
highlighted={true}
leadingItem={
Object {
"key": "i1",
}
}
/>
</View>
<View
onLayout={[Function]}
>
<item
title="i2"
/>
</View>
</View>
</RCTScrollView>
`;
exports[`VirtualizedList handles separators correctly 3`] = `
<RCTScrollView
ItemSeparatorComponent={[Function]}
data={
Array [
Object {
"key": "i0",
},
Object {
"key": "i1",
},
Object {
"key": "i2",
},
]
}
disableVirtualization={false}
getItem={[Function]}
getItemCount={[Function]}
horizontal={false}
initialNumToRender={10}
keyExtractor={[Function]}
maxToRenderPerBatch={10}
onContentSizeChange={[Function]}
onEndReachedThreshold={2}
onLayout={[Function]}
onMomentumScrollEnd={[Function]}
onScroll={[Function]}
onScrollBeginDrag={[Function]}
onScrollEndDrag={[Function]}
renderItem={[Function]}
renderScrollComponent={[Function]}
scrollEventThrottle={50}
stickyHeaderIndices={Array []}
updateCellsBatchingPeriod={50}
windowSize={21}
>
<View>
<View
onLayout={[Function]}
>
<item
title="i0"
/>
<separator
highlighted={true}
leadingItem={
Object {
"key": "i0",
}
}
/>
</View>
<View
onLayout={[Function]}
>
<item
title="i1"
/>
<separator
highlighted={true}
leadingItem={
Object {
"key": "i1",
}
}
press={true}
/>
</View>
<View
onLayout={[Function]}
>
<item
title="i2"
/>
</View>
</View>
</RCTScrollView>
`;
exports[`VirtualizedList renders all the bells and whistles 1`] = `
<RCTScrollView
ItemSeparatorComponent={[Function]}
@@ -32,7 +270,6 @@ exports[`VirtualizedList renders all the bells and whistles 1`] = `
initialNumToRender={10}
keyExtractor={[Function]}
maxToRenderPerBatch={10}
numColumns={2}
onContentSizeChange={[Function]}
onEndReachedThreshold={2}
onLayout={[Function]}

0 comments on commit 5c7c65e

Please sign in to comment.