UI test issue with

RecyclerListView doesn’t render any rows when used in a a UI test using ‘react-test-renderer’.

The selected row can’t be found when rendering a list using the RecyclerListView, when moved to FlatList it was rendered nicely and found easily: const row = ssf.root.findByProps({testID: 'list-row-0'})

<RecyclerListView
      {...{refreshControl}}
      layoutProvider={this.layoutProvider}
      dataProvider={this.dataProvider}
      rowRenderer={(type, item) => this.renderRow(item)}
      renderAheadOffset={initialNumToRender ? (initialNumToRender * this.rowHeight) : undefined}
      extendedState={extraData}
/>

[mdarke1]

After many hours of trouble shooting on this I found that the issue I was having was that the onLayout event was not being triggered in Jest and the above testing libraries. This meant that the dimensions remained at height and width of 0 and therefore not did not trigger the virtual renderer to update.

I believe that in my case it was because I was using a functional component where the layoutProvider was being updated with useRef below : const _layoutProvider = useRef(layoutProviderMaker()).current

Because it appears that react testing library does not create a specific “current” object related to the ref it therefore did not trigger a layout event.

So my hack was to give the recyclerlistview component a test ID itself “RecyclerListView testID=“recyclerlistview” rowRenderer={rowRenderer} layoutProvider={_layoutProvider} dataProvider={state.dataProvider}”

then once the initial render was set jest needed to capture the recyclerlistview component: const SLCF = getByTestId(“recyclerListView”)

Then the important part was to trigger a layout event: fireEvent(SLCF, “layout”, {nativeEvent: {layout: {height: 781, width: 393, x: 0, y: 0,}}}); and this was enough to get the selected rows to render and pass my tests.

Arguably the above isn’t ideal but I believe it was related to the use of refs in the layout provider but at least it was enough for my purposes.

Hopefully this is applicable to your use case too.

[callmemonky]

@leonardonelson91 @mdarke1 can we somehow test onEndReach callback getting fired too?