I am updating an Ember app from 2.18 to 3.11, we have several components tests, and all of them are failing. I have noticed that if try to show on the screen with assert.async(), components are being rendered outside the container.
This test for example it's failing
import { module, test } from 'qunit';
import { setupRenderingTest } from 'ember-qunit';
import { render, find } from '@ember/test-helpers';
import hbs from 'htmlbars-inline-precompile';
module('Integration | Component | loading content', function(hooks) {
setupRenderingTest(hooks);
test('can display content without block form in h2 tags', async function(assert) {
await render(hbs`{{loading-content defaultText='Content'}}`);
assert.dom('h2').exists();
});
});
import { module, test } from 'qunit';
import { setupRenderingTest } from 'ember-qunit';
import { render, find } from '@ember/test-helpers';
import hbs from 'htmlbars-inline-precompile';
module('Integration | Component | loading content', function(hooks) {
setupRenderingTest(hooks);
test('can display content without block form in h2 tags', async function(assert) {
await render(hbs`{{loading-content defaultText='Content'}}`);
assert.async()
});
});
and this is the example when I added assert async, I am assuming that can't find the elements because are rendering in the wrong place, in this case, the component it's just a loading spinner that can be seen just to the right of the container.
I am updating an Ember app from 2.18 to 3.11, we have several components tests, and all of them are failing. I have noticed that if try to show on the screen with assert.async(), components are being rendered outside the container.
This test for example it's failing
and this is the example when I added assert async, I am assuming that can't find the elements because are rendering in the wrong place, in this case, the component it's just a loading spinner that can be seen just to the right of the container.
Dependencies
I appreciate any clarification about this issue, any thoughts?