enzymejs / enzyme-matchers

Jasmine/Jest assertions for enzyme
MIT License
892 stars 115 forks source link

Better messaging for component selectors #306

Closed GreenGremlin closed 5 years ago

GreenGremlin commented 5 years ago

This change improves the messaging when a component is passed as a selector. I also noticed the "were" / "was" selection was off for toContainMatchingElements, so I fixed that in this PR as well.

Using this test:

function Song({id, title, lyrics}) {
    return (
        <dl id={`song-${id}`}>
            {title && <dt className="title">{title}</dt>}
            {lyrics && <dd className="lyrics">{lyrics}</dd>}
        </dl>
    );
}
expect(
    <SongList>{songs.map(song => <Song {...song} /></SongList>
).toContainMatchingElements(3, Song);

Output before this change:

Expected <SongList> to contain 3 elements matching function Song(_ref) {
    var id = _ref.id,
        title = _ref.title,
        lyrics = _ref.lyrics;

    return _get__('React').createElement(
        'dl',
        { id: 'song-' + id },
        title && _get__('React').createElement(
            'dt',
            { className: 'title' },
            title
        ),
        lyrics && _get__('React').createElement(
            'dd',
            { className: 'lyrics' },
            lyrics
        )
    );
} but 1 were found.
HTML Output of <SongList>:
<SongList><Song title="I\'m a Little Teapot" lyrics="I\'m a Little Teapot, short and stout." /></SongList>

Output with this change

Expected <SongList> to contain 3 elements matching "Song" but 1 was found.
HTML Output of <SongList>:
<SongList><Song title="I\'m a Little Teapot" lyrics="I\'m a Little Teapot, short and stout." /></SongList>
GreenGremlin commented 5 years ago

Please, give https://github.com/FormidableLabs/enzyme-matchers/pull/305 prescedence in merging over this PR, since https://github.com/FormidableLabs/enzyme-matchers/pull/305 addresses a functional issue.