Testing an ember component that uses another component with separate template

Question

I'm trying to test an emberjs component that uses another component. I'm using ember-qunit with the moduleForComponent method. In there I define that my component needs another component, needs: ['component:my-kitten'].

But it seems that if you use a component with a separate template, then the template of that component is not loaded.

I altered the jsbin example from the emberjs guides.

Working example with template defined in the component as layout

Not working example where I moved the layout to a separate template

Answer 1

The needs property must also include any nested component templates:

...
needs: ['component:my-kitten', 'template:components/my-kitten'],
...

Look for "If you are using nested components with templates" on https://github.com/rwjblue/ember-qunit.

Answer 2

As an update, I'm running into a similar issue and the ember-qunit guides now expressly state

"You do not require dependencies through needs:. Doing so will force the test into unit mode."

Adding needs to my component integration test causes them all to fail, so the above answer is not relevant for current versions of ember-qunit (0.4.17).