[CLEANUP] Make visit() fully async (#17958)

[CLEANUP] Make visit() fully async

.eslintrc.js

@@ -109,6 +109,7 @@ module.exports = {
       globals: {
         'expectAssertion': true,
         'expectDeprecation': true,
+        'expectDeprecationAsync': true,
         'expectNoDeprecation': true,
         'expectWarning': true,
         'expectNoWarning': true,

broccoli/test-polyfills.js

@@ -4,7 +4,14 @@ const resolve = require('rollup-plugin-node-resolve');
 const commonjs = require('rollup-plugin-commonjs');
 
 module.exports = function polyfills() {
-  let polyfillEntry = writeFile('polyfill-entry.js', 'require("core-js/modules/es6.symbol");');
+  let polyfillEntry = writeFile(
+    'polyfill-entry.js',
+    `
+      require('core-js/modules/es6.promise');
+      require('core-js/modules/es6.symbol');
+      require('regenerator-runtime/runtime');
+    `
+  );
 
   return new Rollup(polyfillEntry, {
     rollup: {

broccoli/transforms/test-babel-plugins.js

@@ -0,0 +1,13 @@
+const Babel = require('broccoli-babel-transpiler');
+
+module.exports = function(tree) {
+  let options = {
+    sourceMaps: true,
+    plugins: [
+      ['@babel/plugin-transform-async-to-generator'],
+      ['@babel/plugin-transform-regenerator'],
+    ],
+  };
+
+  return new Babel(tree, options);
+};

ember-cli-build.js

@@ -16,6 +16,7 @@ const stripForProd = require('./broccoli/strip-for-prod');
 const debugMacros = require('./broccoli/debug-macros');
 const minify = require('./broccoli/minify');
 const rename = require('./broccoli/rename');
+const testBabelPluginsTransform = require('./broccoli/transforms/test-babel-plugins');
 const {
   routerES,
   jquery,
@@ -240,19 +241,24 @@ function buildBundles(packagesES, dependenciesES, templateCompilerDependenciesES
       bootstrapModule('sideeffects', 'ember'),
     ]);
 
-    emberTestsProdFiles = new MergeTrees([
-      new Funnel(packagesProdES, {
-        include: [
-          '@ember/-internals/*/tests/**' /* internal packages */,
-          'internal-test-helpers/**',
-          '*/*/tests/**' /* scoped packages */,
-          '*/tests/**' /* packages */,
-          'license.js',
-        ],
-        exclude: ['@ember/debug/tests/**', 'ember-testing/tests/**'],
-      }),
-      bootstrapModule('empty'),
-    ]);
+    emberTestsProdFiles = testBabelPluginsTransform(
+      MergeTrees([
+        new Funnel(packagesProdES, {
+          include: [
+            '@ember/-internals/*/tests/**' /* internal packages */,
+            'internal-test-helpers/**',
+            '*/*/tests/**' /* scoped packages */,
+            '*/tests/**' /* packages */,
+            'license.js',
+          ],
+          exclude: ['@ember/debug/tests/**', 'ember-testing/tests/**'],
+        }),
+        bootstrapModule('empty'),
+      ])
+    );
+
+    // apply the babel transforms for legacy tests
+    emberTestsFiles = testBabelPluginsTransform(emberTestsFiles);
 
     // Note:
     // We have to build custom production template compiler

package.json

@@ -80,6 +80,7 @@
     "@babel/plugin-proposal-class-properties": "^7.4.0",
     "@babel/plugin-proposal-decorators": "^7.3.0",
     "@babel/plugin-transform-arrow-functions": "^7.2.0",
+    "@babel/plugin-transform-async-to-generator": "^7.4.0",
     "@babel/plugin-transform-block-scoping": "^7.4.0",
     "@babel/plugin-transform-classes": "^7.4.3",
     "@babel/plugin-transform-computed-properties": "^7.2.0",
@@ -88,6 +89,7 @@
     "@babel/plugin-transform-modules-amd": "^7.2.0",
     "@babel/plugin-transform-object-assign": "^7.2.0",
     "@babel/plugin-transform-parameters": "^7.4.3",
+    "@babel/plugin-transform-regenerator": "^7.4.3",
     "@babel/plugin-transform-shorthand-properties": "^7.2.0",
     "@babel/plugin-transform-spread": "^7.2.2",
     "@babel/plugin-transform-template-literals": "^7.2.0",

packages/@ember/-internals/glimmer/tests/integration/application/rendering-test.js

@@ -469,7 +469,7 @@ moduleFor(
       });
     }
 
-    ['@test it emits a useful backtracking re-render assertion message']() {
+    async ['@test it emits a useful backtracking re-render assertion message'](assert) {
       this.router.map(function() {
         this.route('routeWithError');
       });
@@ -497,11 +497,9 @@ moduleFor(
 
       let expectedBacktrackingMessage = /modified "model\.name" twice on \[object Object\] in a single render\. It was rendered in "template:my-app\/templates\/routeWithError.hbs" and modified in "component:x-foo"/;
 
-      return this.visit('/').then(() => {
-        expectAssertion(() => {
-          this.visit('/routeWithError');
-        }, expectedBacktrackingMessage);
-      });
+      await this.visit('/');
+
+      assert.rejectsAssertion(this.visit('/routeWithError'), expectedBacktrackingMessage);
     }
 
     ['@test route templates with {{{undefined}}} [GH#14924] [GH#16172]']() {

packages/@ember/-internals/glimmer/tests/integration/components/link-to/query-params-curly-test.js

@@ -1,6 +1,7 @@
 import Controller from '@ember/controller';
 import { RSVP } from '@ember/-internals/runtime';
 import { Route } from '@ember/-internals/routing';
+import { DEBUG } from '@glimmer/env';
 import {
   ApplicationTestCase,
   classes as classMatcher,
@@ -51,14 +52,20 @@ moduleFor(
       });
     }
 
-    ['@feature(ember-glimmer-angle-bracket-built-ins) `(query-params)` must be used in conjunction with `{{link-to}}']() {
+    async ['@feature(ember-glimmer-angle-bracket-built-ins) `(query-params)` must be used in conjunction with `{{link-to}}'](
+      assert
+    ) {
       this.addTemplate(
         'index',
         `{{#let (query-params foo='456' bar='NAW') as |qp|}}{{link-to 'Index' 'index' qp}}{{/let}}`
       );
 
-      return expectAssertion(
-        () => this.visit('/'),
+      // TODO If we visit this page at all in production mode, it'll fail for
+      // entirely different reasons than what this test is trying to test.
+      let promise = DEBUG ? this.visit('/') : null;
+
+      await assert.rejectsAssertion(
+        promise,
         /The `\(query-params\)` helper can only be used when invoking the `{{link-to}}` component\./
       );
     }

packages/@ember/-internals/glimmer/tests/integration/components/link-to/rendering-angle-test.js

@@ -9,14 +9,13 @@ if (EMBER_GLIMMER_ANGLE_BRACKET_BUILT_INS) {
   moduleFor(
     '<LinkTo /> component (rendering tests)',
     class extends ApplicationTestCase {
-      [`@test throws a useful error if you invoke it wrong`](assert) {
-        assert.expect(1);
-
+      async [`@test throws a useful error if you invoke it wrong`](assert) {
         this.addTemplate('application', `<LinkTo id='the-link'>Index</LinkTo>`);
 
-        expectAssertion(() => {
-          this.visit('/');
-        }, /You must provide at least one of the `@route`, `@model`, `@models` or `@query` argument to `<LinkTo>`/);
+        await assert.rejectsAssertion(
+          this.visit('/'),
+          /You must provide at least one of the `@route`, `@model`, `@models` or `@query` argument to `<LinkTo>`/
+        );
       }
 
       ['@test should be able to be inserted in DOM when the router is not present']() {

packages/@ember/-internals/glimmer/tests/integration/components/link-to/rendering-curly-test.js

@@ -17,16 +17,17 @@ moduleFor(
       }, /You must provide one or more parameters to the `{{link-to}}` component\. \('my-app\/templates\/application\.hbs' @ L1:C0\)/);
     }
 
-    [`@feature(!ember-glimmer-angle-bracket-built-ins) throws a useful error if you invoke it wrong`](
+    async [`@feature(!ember-glimmer-angle-bracket-built-ins) throws a useful error if you invoke it wrong`](
       assert
     ) {
       assert.expect(1);
 
       this.addTemplate('application', `{{#link-to id='the-link'}}Index{{/link-to}}`);
 
-      expectAssertion(() => {
-        this.visit('/');
-      }, /You must provide one or more parameters to the link-to component/);
+      await assert.rejectsAssertion(
+        this.visit('/'),
+        /You must provide one or more parameters to the link-to component/
+      );
     }
 
     ['@test should be able to be inserted in DOM when the router is not present']() {

packages/@ember/-internals/glimmer/tests/integration/components/link-to/routing-angle-test.js

@@ -1436,7 +1436,9 @@ if (EMBER_GLIMMER_ANGLE_BRACKET_BUILT_INS) {
         });
       }
 
-      [`@test the <LinkTo /> component throws a useful error if you invoke it wrong`](assert) {
+      async [`@test the <LinkTo /> component throws a useful error if you invoke it wrong`](
+        assert
+      ) {
         assert.expect(1);
 
         this.router.map(function() {
@@ -1445,11 +1447,10 @@ if (EMBER_GLIMMER_ANGLE_BRACKET_BUILT_INS) {
 
         this.addTemplate('application', `<LinkTo @route='post'>Post</LinkTo>`);
 
-        assert.throws(() => {
-          this.visit('/');
-        }, /(You attempted to generate a link for the "post" route, but did not pass the models required for generating its dynamic segments.|You must provide param `post_id` to `generate`)/);
-
-        return runLoopSettled();
+        await assert.rejects(
+          this.visit('/'),
+          /(You attempted to generate a link for the "post" route, but did not pass the models required for generating its dynamic segments.|You must provide param `post_id` to `generate`)/
+        );
       }
 
       [`@test the <LinkTo /> component does not throw an error if its route has exited`](assert) {

packages/@ember/-internals/glimmer/tests/integration/components/link-to/routing-curly-test.js

@@ -1656,7 +1656,7 @@ moduleFor(
       });
     }
 
-    [`@test the {{link-to}} component throws a useful error if you invoke it wrong`](assert) {
+    async [`@test the {{link-to}} component throws a useful error if you invoke it wrong`](assert) {
       assert.expect(1);
 
       this.router.map(function() {
@@ -1665,11 +1665,10 @@ moduleFor(
 
       this.addTemplate('application', `{{#link-to 'post'}}Post{{/link-to}}`);
 
-      assert.throws(() => {
-        this.visit('/');
-      }, /(You attempted to define a `\{\{link-to "post"\}\}` but did not pass the parameters required for generating its dynamic segments.|You must provide param `post_id` to `generate`)/);
-
-      return runLoopSettled();
+      await assert.rejects(
+        this.visit('/'),
+        /(You attempted to define a `\{\{link-to "post"\}\}` but did not pass the parameters required for generating its dynamic segments.|You must provide param `post_id` to `generate`)/
+      );
     }
 
     [`@test the {{link-to}} component does not throw an error if its route has exited`](assert) {

packages/@ember/-internals/glimmer/tests/integration/mount-test.js

@@ -101,7 +101,7 @@ moduleFor(
       });
     }
 
-    ['@test it emits a useful backtracking re-render assertion message']() {
+    async ['@test it emits a useful backtracking re-render assertion message'](assert) {
       this.router.map(function() {
         this.route('route-with-mount');
       });
@@ -132,11 +132,9 @@ moduleFor(
 
       let expectedBacktrackingMessage = /modified "person\.name" twice on \[object Object\] in a single render\. It was rendered in "template:my-app\/templates\/route-with-mount.hbs" \(in "engine:chat"\) and modified in "component:component-with-backtracking-set" \(in "engine:chat"\)/;
 
-      return this.visit('/').then(() => {
-        expectAssertion(() => {
-          this.visit('/route-with-mount');
-        }, expectedBacktrackingMessage);
-      });
+      await this.visit('/');
+
+      await assert.rejectsAssertion(this.visit('/route-with-mount'), expectedBacktrackingMessage);
     }
 
     ['@test it renders with a bound engine name']() {

packages/ember/tests/component_registration_test.js

@@ -2,7 +2,7 @@ import Application from '@ember/application';
 import Controller from '@ember/controller';
 import { Component } from '@ember/-internals/glimmer';
 import { compile } from 'ember-template-compiler';
-import { moduleFor, ApplicationTestCase, runLoopSettled } from 'internal-test-helpers';
+import { moduleFor, ApplicationTestCase } from 'internal-test-helpers';
 import { ENV } from '@ember/-internals/environment';
 
 moduleFor(
@@ -238,15 +238,10 @@ moduleFor(
       });
     }
 
-    ['@test Using name of component that does not exist']() {
+    async ['@test Using name of component that does not exist'](assert) {
       this.addTemplate('application', `<div id='wrapper'>{{#no-good}} {{/no-good}}</div>`);
 
-      // TODO: Use the async form of expectAssertion here when it is available
-      expectAssertion(() => {
-        this.visit('/');
-      }, /.* named "no-good" .*/);
-
-      return runLoopSettled();
+      await assert.rejectsAssertion(this.visit('/'), /.* named "no-good" .*/);
     }
   }
 );