Skip to content

Conversation

@bseber
Copy link

@bseber bseber commented Jul 25, 2017

refs #163

please note: only tested with my project at work! I'm not sure if this is stable and backwards compatible.

currently I have mocked the react-list in my project to just call the itemsRenderer to render all list items:

import React from 'react';

const ref = () => {}; // NOSONAR

export default class ReactListMock extends React.Component {
    getVisibleRange () {
        return [0, 42];
    }

    render () {
        const {
            items,
            itemsRenderer,
            itemRenderer,
        } = this.props;
        const itemElements = items.map ((item, index) => itemRenderer (index, index));
        return itemsRenderer (itemElements, ref);
    }
}

and I have unit tests to check click behaviour which did not pass anymore since not all list items are rendered by default react-list settings.

it ('calls "onBestellungClick" when a list item is clicked', () => {
    const root = document.createElement ('div');
    const props = setup ();

    renderIntoDocumentWithIntl (
        <BestellungHistoryList {...props} />,
        root
    );

    const listitems = root.querySelectorAll ('li');
    ReactTestUtils.Simulate.click (listitems[1], {});

    expect (props.onBestellungClick).toHaveBeenCalledWith (props.bestellungen[1]);
});

adding minSize property solved this:

<ReactList
    type="uniform"
    useStaticSize
    items={bestellungen}
    length={bestellungen.length}
+    minSize={10}
    itemsRenderer={(items, ref) => renderList (items, ref)}
    itemRenderer={(index) => renderItem (bestellungen[index], onBestellungClick)}
/>

@DrGor
Copy link

DrGor commented Aug 7, 2017

ReactDOM.findDOMNode is not deprecated. It works in React 16 without warnings.
This being said, I totally agree that you should dodge using findDOMNode if it's possible.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants