Refactor tests to use ESM imports and update component and application setup for improved compatibility

Author: NullVoxPopuli

smoke-tests/node-template/tests/node/component-rendering.test.mjs

@@ -28,7 +28,7 @@ describe('Components can be rendered without a DOM dependency', () => {
   test('Ensure undefined attributes requiring protocol sanitization do not error', () => {
     ctx.owner.register(
       'component:fake-link',
-      class extends ctx.Ember.Component {
+      class extends ctx.Component {
         tagName = 'link';
         attributeBindings = ['href', 'rel'];
         rel = 'canonical';

smoke-tests/node-template/tests/node/fastboot-sandbox.test.mjs

@@ -6,13 +6,23 @@
  * we test that Ember can be dynamically imported and used to boot an app
  * with SimpleDOM, which is the ESM equivalent of the FastBoot sandbox pattern.
  */
-import { describe, test, beforeEach, afterEach } from 'node:test';
+import { describe, test } from 'node:test';
 import assert from 'node:assert/strict';
 import SimpleDOM from 'simple-dom';
-import { loadEmber, clearEmber } from './helpers/load-ember.mjs';
+import Application from 'ember-source/@ember/application/index.js';
+import EmberObject from 'ember-source/@ember/object/index.js';
+import EmberRouter from 'ember-source/@ember/routing/router.js';
+import { run } from 'ember-source/@ember/runloop/index.js';
+import { precompile } from 'ember-source/ember-template-compiler/index.js';
+import { createTemplateFactory } from 'ember-source/@ember/template-factory/index.js';
 
 const HTMLSerializer = new SimpleDOM.HTMLSerializer(SimpleDOM.voidMap);
 
+function compile(templateString, options) {
+  let templateSpec = precompile(templateString, options);
+  return createTemplateFactory(JSON.parse(templateSpec));
+}
+
 async function fastbootVisit(app, url) {
   let doc = new SimpleDOM.Document();
   let rootElement = doc.body;
@@ -37,23 +47,8 @@ async function fastbootVisit(app, url) {
 }
 
 describe('FastBoot sandbox ESM equivalent', () => {
-  let Ember;
-  let precompile;
-
-  beforeEach(async () => {
-    const loaded = await loadEmber();
-    Ember = loaded.Ember;
-    precompile = loaded.precompile;
-  });
-
-  afterEach(() => {
-    clearEmber();
-  });
-
   test('FastBoot: basic', async () => {
-    let { compile } = await loadEmber();
-
-    let Router = class extends Ember.Router {};
+    let Router = class extends EmberRouter {};
     Router.map(function () {
       this.route('a');
       this.route('b');
@@ -64,13 +59,13 @@ describe('FastBoot sandbox ESM equivalent', () => {
       'template:application': compile('<h1>Hello world!</h1>\n{{outlet}}'),
     };
 
-    class Resolver extends Ember.Object {
+    class Resolver extends EmberObject {
       resolve(specifier) {
         return registry[specifier];
       }
     }
 
-    let app = class extends Ember.Application {}.create({
+    let app = class extends Application {}.create({
       autoboot: false,
       Resolver,
     });
@@ -84,6 +79,6 @@ describe('FastBoot sandbox ESM equivalent', () => {
       'results in expected HTML'
     );
 
-    Ember.run(app, 'destroy');
+    run(app, 'destroy');
   });
 });

smoke-tests/node-template/tests/node/helpers/build-owner.mjs

@@ -1,23 +1,30 @@
 /**
  * ESM port of tests/node/helpers/build-owner.js
  */
-export function buildOwner(Ember, resolver) {
-  let Owner = Ember.Object.extend(Ember._RegistryProxyMixin, Ember._ContainerProxyMixin);
+import EmberObject from 'ember-source/@ember/object/index.js';
+import Application from 'ember-source/@ember/application/index.js';
+import ApplicationInstance from 'ember-source/@ember/application/instance.js';
+import { Registry } from 'ember-source/@ember/-internals/container/index.js';
+import RegistryProxyMixin from 'ember-source/@ember/-internals/runtime/lib/mixins/registry_proxy.js';
+import ContainerProxyMixin from 'ember-source/@ember/-internals/runtime/lib/mixins/container_proxy.js';
 
-  let namespace = Ember.Object.create({
+export function buildOwner(resolver) {
+  let Owner = EmberObject.extend(RegistryProxyMixin, ContainerProxyMixin);
+
+  let namespace = EmberObject.create({
     Resolver: {
       create: function () {
         return resolver;
       },
     },
   });
 
-  let fallbackRegistry = Ember.Application.buildRegistry(namespace);
-  let registry = new Ember.Registry({
+  let fallbackRegistry = Application.buildRegistry(namespace);
+  let registry = new Registry({
     fallback: fallbackRegistry,
   });
 
-  Ember.ApplicationInstance.setupRegistry(registry);
+  ApplicationInstance.setupRegistry(registry);
 
   let owner = Owner.create({
     __registry__: registry,

smoke-tests/node-template/tests/node/helpers/load-ember.mjs

@@ -5,20 +5,35 @@
  * and renderToHTML support for server-side rendering tests.
  */
 import SimpleDOM from 'simple-dom';
-import { loadEmber, clearEmber } from './load-ember.mjs';
+import Application from 'ember-source/@ember/application/index.js';
+import Component from 'ember-source/@ember/component/index.js';
+import { setComponentTemplate } from 'ember-source/@ember/component/index.js';
+import templateOnly from 'ember-source/@ember/component/template-only.js';
+import Controller from 'ember-source/@ember/controller/index.js';
+import EmberObject from 'ember-source/@ember/object/index.js';
+import Route from 'ember-source/@ember/routing/route.js';
+import EmberRouter from 'ember-source/@ember/routing/router.js';
+import { service } from 'ember-source/@ember/service/index.js';
+import { run } from 'ember-source/@ember/runloop/index.js';
+import RSVP from 'ember-source/@ember/-internals/runtime/lib/ext/rsvp.js';
+import { setTesting } from 'ember-source/@ember/debug/lib/testing.js';
+import { precompile } from 'ember-source/ember-template-compiler/index.js';
+import { createTemplateFactory } from 'ember-source/@ember/template-factory/index.js';
+
+function compile(templateString, options) {
+  let templateSpec = precompile(templateString, options);
+  return createTemplateFactory(JSON.parse(templateSpec));
+}
 
 export async function createAppContext() {
-  const { Ember, compile } = await loadEmber();
-
-  Ember.testing = true;
+  setTesting(true);
 
   const ctx = {
-    Ember,
     compile,
-    setComponentTemplate: Ember._setComponentTemplate,
-    templateOnlyComponent: Ember._templateOnlyComponent,
-    run: Ember.run,
-    all: Ember.RSVP.all,
+    setComponentTemplate,
+    templateOnlyComponent: templateOnly,
+    run,
+    all: RSVP.all.bind(RSVP),
     registry: {},
     routesCallback: null,
     app: null,
@@ -36,27 +51,27 @@ export async function createAppContext() {
     let component = ctx.setComponentTemplate(
       ctx.compile(templateContents),
       componentProps
-        ? ctx.Ember.Component.extend(componentProps)
+        ? Component.extend(componentProps)
         : ctx.templateOnlyComponent()
     );
     ctx.register('component:' + name, component);
   };
 
   ctx.controller = function (name, controllerProps) {
-    let controller = ctx.Ember.Controller.extend(controllerProps);
+    let controller = Controller.extend(controllerProps);
     ctx.register('controller:' + name, controller);
   };
 
   ctx.route = function (name, routeProps) {
-    let route = ctx.Ember.Route.extend({
-      router: ctx.Ember.inject.service('router'),
+    let route = Route.extend({
+      router: service('router'),
       ...routeProps,
     });
     ctx.register('route:' + name, route);
   };
 
   ctx.service = function (name, serviceProps) {
-    let service = ctx.Ember.Object.extend(serviceProps);
+    let service = EmberObject.extend(serviceProps);
     ctx.register('service:' + name, service);
   };
 
@@ -67,20 +82,16 @@ export async function createAppContext() {
   ctx.createApplication = function () {
     if (ctx.app) return ctx.app;
 
-    let app = class extends ctx.Ember.Application {}.create({
+    let app = class extends Application {}.create({
       autoboot: false,
       Resolver: {
         create: () => {
-          // Return an object without a resolve() method.
-          // Ember's registry checks `if (registry.resolver)` before calling
-          // resolver.resolve(), so returning null makes it skip the resolver
-          // path entirely. All lookups go through app.register() instead.
           return null;
         },
       },
     });
 
-    let Router = class extends ctx.Ember.Router {
+    let Router = class extends EmberRouter {
       location = 'none';
     };
 
@@ -100,7 +111,7 @@ export async function createAppContext() {
       },
     });
 
-    ctx.run(app, 'boot');
+    run(app, 'boot');
     ctx.app = app;
 
     return app;
@@ -110,7 +121,7 @@ export async function createAppContext() {
     let app = ctx.createApplication();
     let dom = new SimpleDOM.Document();
 
-    return ctx.run(app, 'visit', url, {
+    return run(app, 'visit', url, {
       isBrowser: false,
       document: dom,
       rootElement: dom.body,
@@ -124,7 +135,7 @@ export async function createAppContext() {
     let dom = new SimpleDOM.Document();
     let root = dom.body;
 
-    return ctx.run(app, 'visit', url, {
+    return run(app, 'visit', url, {
       isBrowser: false,
       document: dom,
       rootElement: root,
@@ -136,9 +147,9 @@ export async function createAppContext() {
 
   ctx.destroy = function () {
     if (ctx.app) {
-      ctx.run(ctx.app, 'destroy');
+      run(ctx.app, 'destroy');
     }
-    clearEmber();
+    setTesting(false);
   };
 
   return ctx;