Fix CI tests

tests/integration/dom/scroll-to-test.js

@@ -70,7 +70,7 @@ module('DOM Helper: scroll-to', function (hooks) {
       <div
         style="height: 200px; overflow-y: auto;"
         class="container"
-        onscroll={{action callback}}
+        onscroll={{this.callback}}
       >
         <ul>
         <li class="item" style="height: 100px;">A</li>
@@ -102,7 +102,7 @@ module('DOM Helper: scroll-to', function (hooks) {
       <div
         style="width: 200px; overflow-x: auto; white-space: nowrap;"
         class="container"
-        onscroll={{action callback}}
+        onscroll={{this.callback}}
       >
         <div class="item" style="width: 100px; height: 100px; display: inline-block">A</div>
         <div class="item" style="width: 100px; height: 100px; display: inline-block">B</div>

tests/integration/settled-test.js

@@ -18,7 +18,7 @@ import Pretender from 'pretender';
 import ajax from '../helpers/ajax';
 
 const TestComponent1 = Component.extend({
-  layout: hbs`{{internalValue}}`,
+  layout: hbs`{{this.internalValue}}`,
 
   internalValue: 'initial value',
 
@@ -30,7 +30,7 @@ const TestComponent1 = Component.extend({
 });
 
 const TestComponent2 = Component.extend({
-  layout: hbs`<div class="test-component">{{internalValue}}</div>`,
+  layout: hbs`<div class="test-component">{{this.internalValue}}</div>`,
 
   internalValue: 'initial value',
 
@@ -40,7 +40,7 @@ const TestComponent2 = Component.extend({
 });
 
 const TestComponent3 = Component.extend({
-  layout: hbs`<div class="test-component">{{internalValue}}</div>`,
+  layout: hbs`<div class="test-component">{{this.internalValue}}</div>`,
 
   internalValue: '',
 
@@ -54,7 +54,7 @@ const TestComponent3 = Component.extend({
 });
 
 const TestComponent4 = Component.extend({
-  layout: hbs`<div class="test-component">{{internalValue}}</div>`,
+  layout: hbs`<div class="test-component">{{this.internalValue}}</div>`,
 
   internalValue: '',
 
@@ -82,7 +82,7 @@ const TestComponent4 = Component.extend({
 });
 
 const TestComponent5 = Component.extend({
-  layout: hbs`{{internalValue}}`,
+  layout: hbs`{{this.internalValue}}`,
 
   internalValue: 'initial value',
 

tests/integration/setup-rendering-context-test.js

@@ -2,6 +2,7 @@ import Ember from 'ember';
 import { module, test } from 'qunit';
 import Component from '@ember/component';
 import { helper } from '@ember/component/helper';
+import { registerWaiter } from '@ember/test';
 import {
   setupContext,
   setupRenderingContext,
@@ -18,8 +19,8 @@ import { precompileTemplate } from '@ember/template-compilation';
 import { defer } from 'rsvp';
 
 const PromiseWrapperTemplate = hbs`
-{{~#if settled~}}
-  {{fulfillmentValue}}
+{{~#if this.settled~}}
+  {{this.fulfillmentValue}}
 {{~else~}}
   <div class="loading">Please wait</div>
 {{~/if}}
@@ -36,7 +37,7 @@ const PromiseWrapper = Component.extend({
 });
 
 const ClickMeButtonTemplate = hbs`
-{{~#if wasClicked~}}
+{{~#if this.wasClicked~}}
   Clicked!
 {{~else~}}
   Click Me!
@@ -56,9 +57,6 @@ const ClickMeButtonComponent = Component.extend({
 });
 
 module('setupRenderingContext "real world"', function (hooks) {
-  if (!hasEmberVersion(2, 4)) {
-    return;
-  }
   hooks.beforeEach(async function () {
     setResolverRegistry({
       'component:promise-wrapper': PromiseWrapper,
@@ -75,14 +73,7 @@ module('setupRenderingContext "real world"', function (hooks) {
       return !this.isWaiterPending;
     };
 
-    // In Ember < 2.8 `registerWaiter` expected to be bound to
-    // `Ember.Test` 😭
-    //
-    // Once we have dropped support for < 2.8 we should swap this to
-    // use:
-    //
-    // import { registerWaiter } from '@ember/test';
-    Ember.Test.registerWaiter(this._waiter);
+    registerWaiter(this._waiter);
   });
 
   hooks.afterEach(async function () {
@@ -98,7 +89,7 @@ module('setupRenderingContext "real world"', function (hooks) {
     this.isWaiterPending = true;
 
     // Does not use `await` intentionally
-    let renderPromise = render(hbs`{{promise-wrapper promise=promise }}`);
+    let renderPromise = render(hbs`{{promise-wrapper promise=this.promise}}`);
 
     await waitFor('.loading');
 
@@ -129,7 +120,7 @@ module('setupRenderingContext "real world"', function (hooks) {
     );
 
     await render(
-      hbs`<div>{{#in-element rootElement insertBefore=null}}{{click-me-button}}{{/in-element}}</div>`
+      hbs`<div>{{#in-element this.rootElement insertBefore=null}}{{click-me-button}}{{/in-element}}</div>`
     );
 
     assert.equal(

tests/unit/setup-application-context-test.js

@@ -35,16 +35,16 @@ module('setupApplicationContext', function (hooks) {
   }
 
   hooks.beforeEach(async function () {
-    setResolverRegistry({
+    let registry = {
       'router:main': Router,
       'template:application': hbs`
-        <div class="nav">{{#link-to "posts"}}posts{{/link-to}} | {{#link-to "widgets"}}widgets{{/link-to}}</div>
+        <div class="nav"><LinkTo @route="posts">posts</LinkTo> | <LinkTo @route="widgets">widgets</LinkTo></div>
         {{outlet}}
       `,
       'template:index': hbs`<h1>Hello World!</h1>`,
-      'template:links-to-slow': hbs`{{#link-to "slow" class="to-slow"}}to slow{{/link-to}}`,
+      'template:links-to-slow': hbs`<LinkTo @route="slow" class="to-slow">to slow</LinkTo>`,
       'template:posts': hbs`<h1>Posts Page</h1>{{outlet}}`,
-      'template:posts/post': hbs`<div class="post-id">{{model.post_id}}</div>`,
+      'template:posts/post': hbs`<div class="post-id">{{this.model.post_id}}</div>`,
       'service:foo': Service.extend({ isFoo: true }),
       'route:posts/post': Route.extend({
         model(params) {
@@ -67,7 +67,22 @@ module('setupApplicationContext', function (hooks) {
           });
         },
       }),
-    });
+    };
+
+    if (!hasEmberVersion(3, 12)) {
+      registry = {
+        ...registry,
+        // overrides for older Ember's
+        'template:application': hbs`
+            <div class="nav">{{#link-to "posts"}}posts{{/link-to}} | {{#link-to "widgets"}}widgets{{/link-to}}</div>
+            {{outlet}}
+          `,
+        'template:links-to-slow': hbs`{{#link-to "slow" class="to-slow"}}to slow{{/link-to}}`,
+        'template:posts/post': hbs`<div class="post-id">{{model.post_id}}</div>`,
+      };
+    }
+
+    setResolverRegistry(registry);
 
     await setupContext(this);
     await setupApplicationContext(this);

tests/unit/setup-context-test.js

@@ -13,6 +13,7 @@ import {
   setApplication,
   setResolver,
   getTestMetadata,
+  settled,
 } from '@ember/test-helpers';
 import { getDeprecationsForContext } from '@ember/test-helpers/-internal/deprecations';
 import { getWarningsForContext } from '@ember/test-helpers/-internal/warnings';
@@ -852,7 +853,7 @@ module('setupContext', function (hooks) {
       // .extend() because initializers are stored in the constructor, and we
       // don't want to pollute other tests using an application created from the
       // same constructor.
-      isolatedApp = App.extend({}).create(AppConfig);
+      isolatedApp = class extends App {}.create(AppConfig);
       let resolver = isolatedApp.Resolver.create({
         namespace: isolatedApp,
         isResolverFromTestHelpers: true,
@@ -862,6 +863,11 @@ module('setupContext', function (hooks) {
       setApplication(isolatedApp);
     });
 
+    hooks.afterEach(async function () {
+      isolatedApp.destroy();
+      await settled();
+    });
+
     test('run once per test run', async function (assert) {
       let initializerCallCount = 0;
       isolatedApp.initializer({

tests/unit/setup-rendering-context-test.js

@@ -2,7 +2,6 @@
 import { module, test } from 'qunit';
 import Service from '@ember/service';
 import Component from '@ember/component';
-import TextField from '@ember/component/text-field';
 import { helper } from '@ember/component/helper';
 import {
   getApplication,
@@ -21,7 +20,6 @@ import {
   click,
   isSettled,
 } from '@ember/test-helpers';
-import hasEmberVersion from '@ember/test-helpers/has-ember-version';
 import {
   setResolverRegistry,
   application,
@@ -61,10 +59,6 @@ async function buildEngineOwner(parentOwner, registry) {
 }
 
 module('setupRenderingContext', function (hooks) {
-  if (!hasEmberVersion(2, 4)) {
-    return;
-  }
-
   hooks.afterEach(function () {
     setApplication(application);
     setResolver(resolver);
@@ -285,7 +279,7 @@ module('setupRenderingContext', function (hooks) {
     test('can pass arguments to helper from context', async function (assert) {
       this.set('name', 'james');
 
-      await render(hbs`{{jax name}}`);
+      await render(hbs`{{jax this.name}}`);
 
       assert.equal(this.element.textContent, 'james-jax');
     });
@@ -314,12 +308,7 @@ module('setupRenderingContext', function (hooks) {
         })
       );
 
-      let subject;
-      if (hasEmberVersion(2, 12)) {
-        subject = this.owner.lookup('component:foo-bar');
-      } else {
-        subject = this.owner._lookupFactory('component:foo-bar').create();
-      }
+      let subject = this.owner.lookup('component:foo-bar');
 
       assert.equal(subject.someMethod(), 'hello thar!');
     });
@@ -384,11 +373,11 @@ module('setupRenderingContext', function (hooks) {
       this.owner.register('component:x-foo', Component.extend());
       this.owner.register(
         'template:components/x-foo',
-        hbs`<button onclick={{action clicked}}>Click me!</button>`
+        hbs`<button onclick={{action @clicked}}>Click me!</button>`
       );
 
       this.set('clicked', () => assert.ok(true, 'action was triggered'));
-      await render(hbs`{{x-foo clicked=clicked}}`);
+      await render(hbs`{{x-foo clicked=this.clicked}}`);
 
       assert.equal(
         this.element.textContent,
@@ -406,7 +395,7 @@ module('setupRenderingContext', function (hooks) {
       this.owner.register('template:components/x-foo', template);
 
       this.set('clicked', () => assert.ok(true, 'action was triggered'));
-      await render(hbs`{{x-foo clicked=clicked}}`);
+      await render(hbs`{{x-foo clicked=this.clicked}}`);
 
       assert.equal(
         this.element.textContent,
@@ -417,9 +406,12 @@ module('setupRenderingContext', function (hooks) {
     });
 
     test('can update a passed in argument with an <input>', async function (assert) {
-      this.owner.register('component:my-input', TextField.extend({}));
+      this.owner.register(
+        'template:components/my-input',
+        hbs`{{input value=@value}}`
+      );
 
-      await render(hbs`{{my-input value=value}}`);
+      await render(hbs`<MyInput @value={{this.value}} />`);
 
       let input = this.element.querySelector('input');
 
@@ -443,31 +435,28 @@ module('setupRenderingContext', function (hooks) {
 
     test('it supports dom triggered focus events', async function (assert) {
       this.owner.register(
-        'component:my-input',
-        TextField.extend({
-          init() {
-            this._super(...arguments);
-
-            this.set('value', 'init');
-          },
-          focusIn() {
-            this.set('value', 'focusin');
-          },
-          focusOut() {
-            this.set('value', 'focusout');
-          },
-        })
+        'template:components/x-input',
+        hbs`<input onblur={{this.onBlur}} onfocusout={{this.onFocus}} />`
       );
-      await this.render(hbs`{{my-input}}`);
+      await render(hbs`<XInput />`);
 
       let input = this.element.querySelector('input');
-      assert.equal(input.value, 'init');
+      function blurIt() {
+        assert.step('blur');
+      }
+      function focusIt() {
+        assert.step('focus');
+      }
+      input.addEventListener('blur', blurIt);
 
-      await focus(input);
-      assert.equal(input.value, 'focusin');
+      input.addEventListener('focus', focusIt);
 
+      await focus(input);
       await blur(input);
-      assert.equal(input.value, 'focusout');
+
+      assert.verifySteps(['focus', 'blur']);
+      input.removeEventListener('blur', blurIt);
+      input.removeEventListener('focus', focusIt);
     });
 
     test('two way bound arguments are updated', async function (assert) {
@@ -483,11 +472,11 @@ module('setupRenderingContext', function (hooks) {
       );
       this.owner.register(
         'template:components/my-component',
-        hbs`<button {{action 'clicked'}}>{{foo}}</button>`
+        hbs`<button {{action 'clicked'}}>{{this.foo}}</button>`
       );
 
       this.set('foo', 'original');
-      await render(hbs`{{my-component foo=foo}}`);
+      await render(hbs`<MyComponent @foo={{this.foo}} />`);
       assert.equal(
         this.element.textContent,
         'original',
@@ -517,13 +506,13 @@ module('setupRenderingContext', function (hooks) {
       );
       this.owner.register(
         'template:components/my-component',
-        hbs`<button {{action 'clicked'}}>{{foo}}</button>`
+        hbs`<button {{action 'clicked'}}>{{this.foo}}</button>`
       );
 
       // using two arguments here to ensure the two way binding
       // works both for things rendered in the component's layout
       // and those only used in the components JS file
-      await render(hbs`{{my-component foo=foo bar=bar}}`);
+      await render(hbs`<MyComponent @foo={{this.foo}} @bar={{this.bar}} />`);
       await click(this.element.querySelector('button'));
 
       await clearRender();