Skip to content

Support react test renderer #185

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 5 commits into
base: master
Choose a base branch
from

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