diff --git a/addon-test-support/@ember/test-helpers/settled.ts b/addon-test-support/@ember/test-helpers/settled.ts index 963534c8a..e5c87b3b1 100644 --- a/addon-test-support/@ember/test-helpers/settled.ts +++ b/addon-test-support/@ember/test-helpers/settled.ts @@ -216,6 +216,8 @@ export interface SettledState { - `pendingRequestCount` - The count of pending AJAX requests. - `debugInfo` - Debug information that's combined with info return from backburner's getDebugInfo method. + - `isRenderPending` - Checks if there are any pending render operations. This will be true as long + as there are tracked values in the template that have not been rerendered yet. @public @returns {Object} object with properties for each of the metrics used to determine settledness diff --git a/addon-test-support/@ember/test-helpers/setup-rendering-context.ts b/addon-test-support/@ember/test-helpers/setup-rendering-context.ts index aece5ee4b..9e0c36682 100644 --- a/addon-test-support/@ember/test-helpers/setup-rendering-context.ts +++ b/addon-test-support/@ember/test-helpers/setup-rendering-context.ts @@ -26,6 +26,7 @@ import type { ComponentInstance } from '@glimmer/interfaces'; const OUTLET_TEMPLATE = hbs`{{outlet}}`; const EMPTY_TEMPLATE = hbs``; const INVOKE_PROVIDED_COMPONENT = hbs``; +const DYNAMIC_INVOKE_PROVIDED_COMPONENT = hbs`{{component this.ProvidedComponent}}`; export interface RenderingTestContext extends TestContext { render(template: TemplateFactory): Promise; @@ -183,7 +184,7 @@ export function render( ProvidedComponent: name, }; ownerToRenderFrom.register(componentFullName, templateOrComponent); - templateOrComponent = hbs`{{component this.ProvidedComponent}}`; + templateOrComponent = DYNAMIC_INVOKE_PROVIDED_COMPONENT; ownerToRenderFrom.register(templateFullName, templateOrComponent); } } else { diff --git a/package.json b/package.json index 106642ccb..a0ad4646f 100644 --- a/package.json +++ b/package.json @@ -37,7 +37,7 @@ "test:all": "ember try:each" }, "peerDependencies": { - "ember-source": "*" + "ember-source": ">=3.8.0" }, "dependencies": { "@ember/test-waiters": "^3.0.0", diff --git a/tests/integration/rerender-test.js b/tests/integration/rerender-test.js index a71a4c679..a7e03d13c 100644 --- a/tests/integration/rerender-test.js +++ b/tests/integration/rerender-test.js @@ -16,8 +16,13 @@ import GlimmerComponent from '@glimmer/component'; import { tracked } from '@glimmer/tracking'; import { hbs } from 'ember-cli-htmlbars'; import { module, test } from 'qunit'; +import hasEmberVersion from '@ember/test-helpers/has-ember-version'; module('rerender real-world', function (hooks) { + // this test requires Ember 3.25 in order to use lexically scoped values in templates + if (!hasEmberVersion(3, 25)) { + return; + } hooks.beforeEach(async function () { await setupContext(this); await setupRenderingContext(this); @@ -78,7 +83,11 @@ module('rerender real-world', function (hooks) { const renderPromise = render(component); // No actual render - assert.equal(this.element.textContent, '', 'precond - Nothing on the screen yet'); + assert.equal( + this.element.textContent, + '', + 'precond - Nothing on the screen yet' + ); // This lets us wait for rendering to actually occur without resolving the render promise itself. // This way, we can make assertions about the initial state while also keeping the settled state @@ -110,8 +119,16 @@ module('rerender real-world', function (hooks) { // At this point, we've got both render and rerender suspended, so settled state should reflect // that there is a render pending AND that the waiter that got kicked off in the component's // constructor is pending - assert.equal(settledState.isRenderPending, true, 'ensure isRenderPending is true'); - assert.equal(settledState.hasPendingWaiters, true, 'ensure test harness / setup is working -- test waiter is pending'); + assert.equal( + settledState.isRenderPending, + true, + 'ensure isRenderPending is true' + ); + assert.equal( + settledState.hasPendingWaiters, + true, + 'ensure test harness / setup is working -- test waiter is pending' + ); // This should resolve isRenderPending but not affect the waiters at all since rerender only // waits on pending render operations. **The point of this whole test is basically to prove that diff --git a/tests/integration/settled-test.js b/tests/integration/settled-test.js index dffa81f76..f17bc51c4 100644 --- a/tests/integration/settled-test.js +++ b/tests/integration/settled-test.js @@ -167,10 +167,12 @@ module('settled real-world scenarios', function (hooks) { test('rerender - it basically works', async function (assert) { this.owner.register('component:x-test-1', TestComponent1); - await render(hbs`{{x-test-1}}`); + let renderPromise = render(hbs`{{x-test-1}}`); await rerender(); - assert.equal(this.element.textContent, 'async value'); + assert.equal(this.element.textContent, 'initial value'); + + await renderPromise; }); test('does not error for various argument types', async function (assert) {