declare module '@ember/renderer' {
/**
@module @ember/renderer
@public
*/
/**
* @class Renderer
* @public
*/
/**
Returns a promise which will resolve when rendering has completed. In
this context, rendering is completed when all auto-tracked state that is
consumed in the template (including any tracked state in models, services,
etc. that are then used in a template) has been updated in the DOM.
For example, in a test you might want to update some tracked state and
then run some assertions after rendering has completed. You _could_ use
`await settled()` in that location, but in some contexts you don't want to
wait for full settledness (which includes test waiters, pending AJAX/fetch,
run loops, etc) but instead only want to know when that updated value has
been rendered in the DOM. **THAT** is what `await renderSettled()` is
_perfect_ for.
```js
import { renderSettled } from '@ember/renderer';
import { render } from '@ember/test-helpers';
import { tracked } from '@glimmer/tracking';
import { hbs } from 'ember-cli-htmlbars';
import { setupRenderingTest } from 'my-app/tests/helpers';
import { module, test } from 'qunit';
module('Integration | Component | profile-card', function (hooks) {
setupRenderingTest(hooks);
test("it renders the person's name", async function (assert) {
class Person {
@tracked name = '';
}
this.person = new Person();
this.person.name = 'John';
await render(hbs`
`);
assert.dom().hasText('John');
this.person.name = 'Jane';
await renderSettled(); // Wait until rendering has completed.
assert.dom().hasText('Jane');
});
});
```
@method renderSettled
@returns {Promise} a promise which fulfills when rendering has completed
@public
*/
export { renderSettled } from '@ember/-internals/glimmer';
}