Here is a basic component / integration test for ember-qunit.
import { moduleForComponent, test } from 'ember-qunit';
import hbs from 'htmlbars-inline-precompile';
moduleForComponent('my-component', 'TODO: put something here', {
integration: true
});
test('it renders', function(assert) {
this.render(hbs`{{my-component}}`);
console.log('This is the rendered element', this.$()[0]);
assert.ok(false);
});
I have an ember-addon with a directory structure like this:
addon/
.. components/
.... my-component/
...... component.js
...... style.less
...... template.hbs
app/
.. components/
.... my-component.js
...... component.js
tests/
.. integration/
.... components/
...... my-component-test.js
How does ember determine where {{my-component}}
is?
This is kind of in the same vein as this:
How does Ember-CLI precompile templates?
Edit 1
As per the comments, I've linked the regular app
component to the addon
component by just importing / exporting it.
app/components/my-component/component.js
export { default } from 'my-application/components/my-component'
However, the console log only shows this:
This is the rendered element <div id="ember234 class="ember-view">
<!---->
</div>
By convention.
Ember try to find a file named
my-component
under yourapp/components
directory orapp/components/templates
directory orapp/helpers
directory.If you define
my-component
under youraddon/components
directory, you need to re-define it under yourapp/components
directory ortests/dummy/app/components
directory such as: