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!
@@ -75,14 +76,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 +92,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 +123,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

@@ -38,13 +38,13 @@ module('setupApplicationContext', function (hooks) {
     setResolverRegistry({
       '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) {

tests/unit/setup-context-test.js

@@ -849,10 +849,7 @@ module('setupContext', function (hooks) {
 
     hooks.beforeEach(function () {
       const AppConfig = assign({ autoboot: false }, config.APP);
-      // .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 = App.create(AppConfig);
       let resolver = isolatedApp.Resolver.create({
         namespace: isolatedApp,
         isResolverFromTestHelpers: true,
@@ -862,6 +859,11 @@ module('setupContext', function (hooks) {
       setApplication(isolatedApp);
     });
 
+    hooks.afterEach(function () {
+      delete isolatedApp.constructor.initializers.foo;
+      isolatedApp.destroy();
+    });
+
     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,
@@ -285,7 +284,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');
     });
@@ -384,11 +383,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 +405,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 +416,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 +445,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 +482,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 +516,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();