Test class for type testing

I am trying to test a react class that renders several other react classes. They all work great, besides I'm not really sure about the best practice in terms of testing this.

code:

Parent class:

module.exports = function (deps) {

var MixLink = require('views/components/mixLink')(deps);

return React.createClass({

    render: function() {
        return (
            <div class="packshotData mixesPage" data-view="mixlist">
            {
                this.props.mixes.map(function (mix) {
                    return <MixLink mix={mix} />;
                })
            }
            </div>
        );
    }
});

      

        
        
        
      

    

};

Child class:

module.exports = function (deps) {

var Link = require('views/components/link')(deps);

var mixLink = React.createClass({

    render: function() {
        return (
            <div className="packshotData-item packshotData-item-overlay">
                <Link className="packshotData-item-link" href={this.props.mix.href} data-control="mixplay">
                    <img className="packshotData-item-image packshotHeadphones" src={this.props.mix.thumbnailHref} />
                    <div className="packshotData-item-title-overlay">
                        <span className="packshotData-item-title-text">{this.props.mix.name}</span>
                    </div>
                </Link>
            </div>
        );
    }
});

return mixLink;

      

        
        
        
      

    

};

Test:

describe('mixLinkList Component', function () {

var MixLinkList = require('views/components/mixLinkList')({}),
    MixLink = require('views/components/mixLink')({}),
    TestUtils = React.addons.TestUtils;

it('is a function', function () {
    expect(MixLinkList).to.be.a(Function);
});

it('is create a MixLink for every mix', function () {

    var mixes = [
        {
            href: 'http://mixlink.com/One',
            name: "thunderbirds",
            thumbnailHref: 'someUri'
        },
        {
            href: 'http://mixlink.com/Two',
            name: "captain scarlet",
            thumbnailHref: 'someOtherUri'
        }
    ],
        renderedMixLinkList,
        renderedComponents;

    renderedMixLinkList = TestUtils.renderIntoDocument(
        <MixLinkList mixes={mixes} />
    );

    renderedComponents = TestUtils.findAllInRenderedTree(renderedMixLinkList, function (elem) {

        return TestUtils.isCompositeComponentWithType(elem, MixLink);
    });

    expect(renderedComponents.length).to.be(2);
});

      

        
        
        
      

    

});

The test is currently failing.

I can achieve my goals by grabbing the DOM node and checking the actual HTML, which seems messy to me, since the HTML generated by MixLink is the problem of the MixLink class, not the MixLinkList class.

What I would like to do is just ask for a rendered component and check that it has two MixLink children. Is it possible?

Thanks in advance!