ember-source 6.3.0-alpha.2 → 6.3.0-alpha.3

package/build-metadata.json

@@ -1,6 +1,6 @@
 {
-  "version": "6.3.0-alpha.2",
+  "version": "6.3.0-alpha.3",
   "buildType": "tag",
-  "SHA": "7c742a2195dbb9014bc1b134a4dba52b8cbc1ecc",
-  "assetPath": "/tag/shas/7c742a2195dbb9014bc1b134a4dba52b8cbc1ecc.tgz"
+  "SHA": "77200c1aea9b214d4027b0734d9198f20ca2587d",
+  "assetPath": "/tag/shas/77200c1aea9b214d4027b0734d9198f20ca2587d.tgz"
 }

package/dist/ember-template-compiler.js

@@ -5,7 +5,7 @@
  *            Portions Copyright 2008-2011 Apple Inc. All rights reserved.
  * @license   Licensed under MIT license
  *            See https://raw.github.com/emberjs/ember.js/master/LICENSE
- * @version   6.3.0-alpha.2
+ * @version   6.3.0-alpha.3
  */
 /* eslint-disable no-var */
 /* globals global globalThis self */
@@ -15651,7 +15651,7 @@ var define, require;
           }, Symbol.toStringTag, { value: 'Module' });
 
           // this file gets replaced with the real value during the build
-          const version = '6.3.0-alpha.2';
+          const version = '6.3.0-alpha.3';
 
           const emberVersion = /*#__PURE__*/Object.defineProperty({
                     __proto__: null,

package/dist/ember-testing.js

@@ -5,7 +5,7 @@
  *            Portions Copyright 2008-2011 Apple Inc. All rights reserved.
  * @license   Licensed under MIT license
  *            See https://raw.github.com/emberjs/ember.js/master/LICENSE
- * @version   6.3.0-alpha.2
+ * @version   6.3.0-alpha.3
  */
 /* eslint-disable no-var */
 /* globals global globalThis self */

package/dist/ember.debug.js

@@ -5,7 +5,7 @@
  *            Portions Copyright 2008-2011 Apple Inc. All rights reserved.
  * @license   Licensed under MIT license
  *            See https://raw.github.com/emberjs/ember.js/master/LICENSE
- * @version   6.3.0-alpha.2
+ * @version   6.3.0-alpha.3
  */
 /* eslint-disable no-var */
 /* globals global globalThis self */
@@ -3379,7 +3379,7 @@ var define, require;
           }, Symbol.toStringTag, { value: 'Module' });
 
           // this file gets replaced with the real value during the build
-          const Version = '6.3.0-alpha.2';
+          const Version = '6.3.0-alpha.3';
 
           const emberVersion = /*#__PURE__*/Object.defineProperty({
                     __proto__: null,
@@ -5301,7 +5301,7 @@ var define, require;
           function hasInternalModifierManager(definition) {
             return void 0 !== getManager(MODIFIER_MANAGERS, definition);
           }
-          const CAPABILITIES$4 = {
+          const CAPABILITIES$5 = {
             dynamicLayout: !1,
             dynamicTag: !1,
             prepareArgs: !1,
@@ -5436,7 +5436,7 @@ var define, require;
               return null;
             }
             getCapabilities() {
-              return CAPABILITIES$4;
+              return CAPABILITIES$5;
             }
           }
 
@@ -19750,7 +19750,7 @@ var define, require;
             let item = vm.stack.peek().next();
             null !== item ? vm.registerItem(vm.enterItem(item)) : vm.goto(breaks);
           });
-          const CAPABILITIES$3 = {
+          const CAPABILITIES$4 = {
             dynamicLayout: !1,
             dynamicTag: !1,
             prepareArgs: !1,
@@ -19767,7 +19767,7 @@ var define, require;
           };
           class TemplateOnlyComponentManager {
             getCapabilities() {
-              return CAPABILITIES$3;
+              return CAPABILITIES$4;
             }
             getDebugName({
               name: name
@@ -21899,7 +21899,7 @@ var define, require;
             (!(constructor) && assert$1(`[BUG] Invalid internal component constructor: ${opaque}`, constructor));
             return constructor;
           }
-          const CAPABILITIES$2 = {
+          const CAPABILITIES$3 = {
             dynamicLayout: false,
             dynamicTag: false,
             prepareArgs: false,
@@ -21916,7 +21916,7 @@ var define, require;
           };
           class InternalManager {
             getCapabilities() {
-              return CAPABILITIES$2;
+              return CAPABILITIES$3;
             }
             create(owner, definition, args, _env, _dynamicScope, caller) {
               (!(isConstRef(caller)) && assert$1('caller must be const', isConstRef(caller)));
@@ -27406,7 +27406,7 @@ var define, require;
               object: `${def.name}:main`
             };
           }
-          const CAPABILITIES$1 = {
+          const CAPABILITIES$2 = {
             dynamicLayout: false,
             dynamicTag: false,
             prepareArgs: false,
@@ -27421,27 +27421,34 @@ var define, require;
             willDestroy: false,
             hasSubOwner: false
           };
+          const CAPABILITIES_MASK$1 = capabilityFlagsFrom(CAPABILITIES$2);
           class OutletComponentManager {
             create(_owner, definition, _args, env, dynamicScope) {
               let parentStateRef = dynamicScope.get('outletState');
               let currentStateRef = definition.ref;
+
+              // This is the actual primary responsibility of the outlet component –
+              // it represents the switching from one route component/template into
+              // the next. The rest only exists to support the debug render tree and
+              // the old-school (and unreliable) instrumentation.
               dynamicScope.set('outletState', currentStateRef);
               let state = {
-                self: createConstRef(definition.controller, 'this'),
                 finalize: _instrumentStart('render.outlet', instrumentationPayload$1, definition)
               };
               if (env.debugRenderTree !== undefined) {
-                state.outletBucket = {};
                 let parentState = valueForRef(parentStateRef);
-                let parentOwner = parentState && parentState.render && parentState.render.owner;
-                let currentOwner = valueForRef(currentStateRef).render.owner;
+                let parentOwner = parentState?.render?.owner;
+                let currentState = valueForRef(currentStateRef);
+                let currentOwner = currentState?.render?.owner;
                 if (parentOwner && parentOwner !== currentOwner) {
                   (!(currentOwner instanceof EngineInstance) && assert$1('Expected currentOwner to be an EngineInstance', currentOwner instanceof EngineInstance));
-                  let mountPoint = currentOwner.mountPoint;
-                  state.engine = currentOwner;
+                  let {
+                    mountPoint
+                  } = currentOwner;
                   if (mountPoint) {
-                    state.engineBucket = {
-                      mountPoint
+                    state.engine = {
+                      mountPoint,
+                      instance: currentOwner
                     };
                   }
                 }
@@ -27451,13 +27458,12 @@ var define, require;
             getDebugName({
               name
             }) {
-              return name;
+              return `{{outlet}} for ${name}`;
             }
-            getDebugCustomRenderTree(definition, state, args) {
+            getDebugCustomRenderTree(_definition, state) {
               let nodes = [];
-              (!(state.outletBucket) && assert$1('[BUG] outletBucket must be set', state.outletBucket));
               nodes.push({
-                bucket: state.outletBucket,
+                bucket: state,
                 type: 'outlet',
                 // "main" used to be the outlet name, keeping it around for compatibility
                 name: 'main',
@@ -27465,33 +27471,23 @@ var define, require;
                 instance: undefined,
                 template: undefined
               });
-              if (state.engineBucket) {
+              if (state.engine) {
                 nodes.push({
-                  bucket: state.engineBucket,
+                  bucket: state.engine,
                   type: 'engine',
-                  name: state.engineBucket.mountPoint,
+                  name: state.engine.mountPoint,
                   args: EMPTY_ARGS,
-                  instance: state.engine,
+                  instance: state.engine.instance,
                   template: undefined
                 });
               }
-              nodes.push({
-                bucket: state,
-                type: 'route-template',
-                name: definition.name,
-                args: args,
-                instance: definition.controller,
-                template: unwrapTemplate(definition.template).moduleName
-              });
               return nodes;
             }
             getCapabilities() {
-              return CAPABILITIES$1;
+              return CAPABILITIES$2;
             }
-            getSelf({
-              self
-            }) {
-              return self;
+            getSelf() {
+              return UNDEFINED_REFERENCE;
             }
             didCreate() {}
             didUpdate() {}
@@ -27504,23 +27500,30 @@ var define, require;
             }
           }
           const OUTLET_MANAGER = new OutletComponentManager();
-          class OutletComponentDefinition {
+          const OUTLET_COMPONENT_TEMPLATE = templateFactory(
+          /*
+            <@Component @controller={{@controller}} @model={{@model}} />
+          */
+          {
+            "id": "tiv/fOHO",
+            "block": "[[[8,[30,1],null,[[\"@controller\",\"@model\"],[[30,2],[30,3]]],null]],[\"@Component\",\"@controller\",\"@model\"],false,[]]",
+            "moduleName": "/home/runner/work/ember.js/ember.js/packages/@ember/-internals/glimmer/lib/component-managers/outlet.ts",
+            "isStrictMode": true
+          });
+          class OutletComponent {
             // handle is not used by this custom definition
             handle = -1;
-            resolvedName;
+            resolvedName = null;
+            manager = OUTLET_MANAGER;
+            capabilities = CAPABILITIES_MASK$1;
             compilable;
-            capabilities;
-            constructor(state, manager = OUTLET_MANAGER) {
+            constructor(owner, state) {
               this.state = state;
-              this.manager = manager;
-              let capabilities = manager.getCapabilities();
-              this.capabilities = capabilityFlagsFrom(capabilities);
-              this.compilable = capabilities.wrapped ? unwrapTemplate(state.template).asWrappedLayout() : unwrapTemplate(state.template).asLayout();
-              this.resolvedName = state.name;
+              this.compilable = unwrapTemplate(OUTLET_COMPONENT_TEMPLATE(owner)).asLayout();
             }
           }
           function createRootOutlet(outletView) {
-            return new OutletComponentDefinition(outletView.state);
+            return new OutletComponent(outletView.owner, outletView.state);
           }
 
           class RootComponentManager extends CurlyComponentManager {
@@ -37079,17 +37082,59 @@ var define, require;
             let controller = owner.lookup(`controller:${route.controllerName || name}`);
             (!(controller instanceof Controller) && assert$1('Expected an instance of controller', controller instanceof Controller));
             let model = route.currentModel;
-            let template = owner.lookup(`template:${route.templateName || name}`);
+            let templateFactoryOrComponent = owner.lookup(`template:${route.templateName || name}`);
+
+            // Now we support either a component or a template to be returned by this
+            // resolver call, but if it's a `TemplateFactory`, we need to instantiate
+            // it into a `Template`, since that's what `RenderState` wants. We can't
+            // easily change it, it's intimate API used by @ember/test-helpers and the
+            // like. We could compatibly allow `Template` | `TemplateFactory`, and that's
+            // what it used to do but we _just_ went through deprecations to get that
+            // removed. It's also not ideal since once you mix the two types, they are
+            // not exactly easy to tell apart.
+            //
+            // It may also be tempting to just normalize `Template` into `RouteTemplate`
+            // here, and we could. However, this is not the only entrypoint where this
+            // `RenderState` is made – @ember/test-helpers punches through an impressive
+            // amount of private API to set it directly, and this feature would also be
+            // useful for them. So, even if we had normalized here, we'd still have to
+            // check and do that again during render anyway.
+            let template;
+            if (templateFactoryOrComponent) {
+              if (hasInternalComponentManager(templateFactoryOrComponent)) {
+                template = templateFactoryOrComponent;
+              } else {
+                if (typeof templateFactoryOrComponent !== 'function') {
+                  let label;
+                  try {
+                    label = `\`${String(templateFactoryOrComponent)}\``;
+                  } catch {
+                    label = 'an unknown object';
+                  }
+                  (assert$1(`Failed to render the ${name} route, expected ` + `\`template:${route.templateName || name}\` to resolve into ` + `a component or a \`TemplateFactory\`, got: ${label}. ` + `Most likely an improperly defined class or an invalid module export.`));
+                }
+                template = templateFactoryOrComponent(owner);
+              }
+            } else {
+              // default `{{outlet}}`
+              template = route._topLevelViewTemplate(owner);
+            }
             let render = {
               owner,
               name,
               controller,
               model,
-              template: template?.(owner) ?? route._topLevelViewTemplate(owner)
+              template
             };
             {
               let LOG_VIEW_LOOKUPS = get$2(route._router, 'namespace.LOG_VIEW_LOOKUPS');
-              if (LOG_VIEW_LOOKUPS && !template) {
+              // This is covered by tests and the existing code was deliberately
+              // targeting the value prior to normalization, but is this message actually
+              // accurate? It seems like we will always default the `{{outlet}}` template
+              // so I'm not sure about "Nothing will be rendered?" (who consumes these
+              // logs anyway? as lookups happen more infrequently now I doubt this is all
+              // that useful)
+              if (LOG_VIEW_LOOKUPS && !templateFactoryOrComponent) {
                 info(`Could not find "${name}" template. Nothing will be rendered`, {
                   fullName: `template:${name}`
                 });
@@ -39588,7 +39633,7 @@ var define, require;
                     prefixRouteNameArg
           }, Symbol.toStringTag, { value: 'Module' });
 
-          const CAPABILITIES = {
+          const CAPABILITIES$1 = {
             dynamicLayout: true,
             dynamicTag: false,
             prepareArgs: false,
@@ -39609,7 +39654,7 @@ var define, require;
               return unwrapTemplate(templateFactory(state.engine)).asLayout();
             }
             getCapabilities() {
-              return CAPABILITIES;
+              return CAPABILITIES$1;
             }
             getOwner(state) {
               return state.engine;
@@ -39710,7 +39755,7 @@ var define, require;
             state;
             manager = MOUNT_MANAGER;
             compilable = null;
-            capabilities = capabilityFlagsFrom(CAPABILITIES);
+            capabilities = capabilityFlagsFrom(CAPABILITIES$1);
             constructor(resolvedName) {
               this.resolvedName = resolvedName;
               this.state = {
@@ -39795,6 +39840,110 @@ var define, require;
             });
           });
 
+          const CAPABILITIES = {
+            dynamicLayout: false,
+            dynamicTag: false,
+            prepareArgs: false,
+            createArgs: true,
+            attributeHook: false,
+            elementHook: false,
+            createCaller: false,
+            dynamicScope: false,
+            updateHook: false,
+            createInstance: true,
+            wrapped: false,
+            willDestroy: false,
+            hasSubOwner: false
+          };
+          const CAPABILITIES_MASK = capabilityFlagsFrom(CAPABILITIES);
+          class RouteTemplateManager {
+            create(_owner, _definition, args) {
+              let self = args.named.get('controller');
+              {
+                self = createDebugAliasRef('this', self);
+              }
+              let controller = valueForRef(self);
+              return {
+                self,
+                controller
+              };
+            }
+            getSelf({
+              self
+            }) {
+              return self;
+            }
+            getDebugName({
+              name
+            }) {
+              return `route-template (${name})`;
+            }
+            getDebugCustomRenderTree({
+              name,
+              templateName
+            }, state, args) {
+              return [{
+                bucket: state,
+                type: 'route-template',
+                name,
+                args,
+                instance: state.controller,
+                template: templateName
+              }];
+            }
+            getCapabilities() {
+              return CAPABILITIES;
+            }
+            didRenderLayout() {}
+            didUpdateLayout() {}
+            didCreate() {}
+            didUpdate() {}
+            getDestroyable() {
+              return null;
+            }
+          }
+          const ROUTE_TEMPLATE_MANAGER = new RouteTemplateManager();
+
+          /**
+           * This "upgrades" a route template into a invocable component. Conceptually
+           * it can be 1:1 for each unique `Template`, but it's also cheap to construct,
+           * so unless the stability is desirable for other reasons, it's probably not
+           * worth caching this.
+           */
+          class RouteTemplate {
+            // handle is not used by this custom definition
+            handle = -1;
+            resolvedName;
+            state;
+            manager = ROUTE_TEMPLATE_MANAGER;
+            capabilities = CAPABILITIES_MASK;
+            compilable;
+            constructor(name, template) {
+              let unwrapped = unwrapTemplate(template);
+              // TODO This actually seems inaccurate – it ultimately came from the
+              // outlet's name. Also, setting this overrides `getDebugName()` in that
+              // message. Is that desirable?
+              this.resolvedName = name;
+              this.state = {
+                name,
+                templateName: unwrapped.moduleName
+              };
+              this.compilable = unwrapped.asLayout();
+            }
+          }
+
+          // TODO a lot these fields are copied from the adjacent existing components
+          // implementation, haven't looked into who cares about `ComponentDefinition`
+          // and if it is appropriate here. It seems like this version is intended to
+          // be used with `curry` which probably isn't necessary here. It could be the
+          // case that we just want to do something more similar to `InternalComponent`
+          // (the one we used to implement `Input` and `LinkTo`). For now it follows
+          // the same pattern to get things going.
+          function makeRouteTemplate(owner, name, template) {
+            let routeTemplate = new RouteTemplate(name, template);
+            return curry(CurriedTypes.Component, routeTemplate, owner, null, true);
+          }
+
           /**
             The `{{outlet}}` helper lets you specify where a child route will render in
             your template. An important use of the `{{outlet}}` helper is in your
@@ -39827,15 +39976,77 @@ var define, require;
               return state?.outlets?.main;
             });
             let lastState = null;
-            let definition = null;
+            let outlet = null;
             return createComputeRef(() => {
               let outletState = valueForRef(outletRef);
               let state = stateFor(outletRef, outletState);
-              if (!validate(state, lastState)) {
+
+              // This code is deliberately using the behavior in glimmer-vm where in
+              // <@Component />, the component is considered stabled via `===`, and
+              // will continue to re-render in-place as long as the `===` holds, but
+              // when it changes to a different object, it teardown the old component
+              // (running destructors, etc), and render the component in its place (or
+              // nothing if the new value is nullish. Here we are carefully exploiting
+              // that fact, and returns the same stable object so long as it is the
+              // same route, but return a different one when the route changes. On the
+              // other hand, changing the model only intentionally do not teardown the
+              // component and instead re-render in-place.
+              if (!isStable(state, lastState)) {
                 lastState = state;
                 if (state !== null) {
+                  // If we are crossing an engine mount point, this is how the owner
+                  // gets switched.
+                  let outletOwner = outletState?.render?.owner ?? owner;
                   let named = dict();
 
+                  // Here we either have a raw template that needs to be normalized,
+                  // or a component that we can render as-is. `RouteTemplate` upgrades
+                  // the template into a component so we can have a unified code path.
+                  // We still store the original `template` value, because we rely on
+                  // its identity for the stability check, and the `RouteTemplate`
+                  // wrapper doesn't dedup for us.
+                  let template = state.template;
+                  let component;
+                  if (hasInternalComponentManager(template)) {
+                    component = template;
+                  } else {
+                    {
+                      // We don't appear to have a standard way or a brand to check, but for the
+                      // purpose of avoiding obvious user errors, this probably gets you close
+                      // enough.
+                      let isTemplate = template => {
+                        if (template === null || typeof template !== 'object') {
+                          return false;
+                        } else {
+                          let t = template;
+                          return t.result === 'ok' || t.result === 'error';
+                        }
+                      };
+
+                      // We made it past the `TemplateFactory` instantiation before
+                      // getting here, so either we got unlucky where the invalid type
+                      // happens to be a function that didn't mind taking owner as an
+                      // argument, or this was directly set by something like test
+                      // helpers.
+                      if (!isTemplate(template)) {
+                        let label;
+                        try {
+                          label = `\`${String(template)}\``;
+                        } catch {
+                          label = 'an unknown object';
+                        }
+                        (assert$1(`Failed to render the \`${state.name}\` route: expected ` + `a component or Template object, but got ${label}.`));
+                      }
+                    }
+                    component = makeRouteTemplate(outletOwner, state.name, template);
+                  }
+
+                  // Component is stable for the lifetime of the outlet
+                  named['Component'] = createConstRef(component, '@Component');
+
+                  // Controller is stable for the lifetime of the outlet
+                  named['controller'] = createConstRef(state.controller, '@controller');
+
                   // Create a ref for the model
                   let modelRef = childRefFromParts(outletRef, ['render', 'model']);
 
@@ -39858,12 +40069,14 @@ var define, require;
                     named['model'] = createDebugAliasRef('@model', named['model']);
                   }
                   let args = createCapturedArgs(named, EMPTY_POSITIONAL);
-                  definition = curry(CurriedTypes.Component, new OutletComponentDefinition(state), outletState?.render?.owner ?? owner, args, true);
+
+                  // Package up everything
+                  outlet = curry(CurriedTypes.Component, new OutletComponent(owner, state), outletOwner, args, true);
                 } else {
-                  definition = null;
+                  outlet = null;
                 }
               }
-              return definition;
+              return outlet;
             });
           });
           function stateFor(ref, outlet) {
@@ -39871,20 +40084,19 @@ var define, require;
             let render = outlet.render;
             if (render === undefined) return null;
             let template = render.template;
-            if (template === undefined) return null;
+            // The type doesn't actually allow for `null`, but if we make it past this
+            // point it is really important that we have _something_ to render. We could
+            // assert, but that is probably overly strict for very little to gain.
+            if (template === undefined || template === null) return null;
             return {
               ref,
               name: render.name,
               template,
-              controller: render.controller,
-              model: render.model
+              controller: render.controller
             };
           }
-          function validate(state, lastState) {
-            if (state === null) {
-              return lastState === null;
-            }
-            if (lastState === null) {
+          function isStable(state, lastState) {
+            if (state === null || lastState === null) {
               return false;
             }
             return state.template === lastState.template && state.controller === lastState.controller;
@@ -40126,8 +40338,7 @@ var define, require;
                 ref,
                 name: TOP_LEVEL_NAME,
                 template,
-                controller: undefined,
-                model: undefined
+                controller: undefined
               };
             }
             appendTo(selector) {
@@ -40376,8 +40587,31 @@ var define, require;
             // renderer HOOKS
 
             appendOutletView(view, target) {
-              let definition = createRootOutlet(view);
-              this._appendDefinition(view, curry(CurriedTypes.Component, definition, view.owner, null, true), target);
+              // TODO: This bypasses the {{outlet}} syntax so logically duplicates
+              // some of the set up code. Since this is all internal (or is it?),
+              // we can refactor this to do something more direct/less convoluted
+              // and with less setup, but get it working first
+              let outlet = createRootOutlet(view);
+              let {
+                name,
+                /* controller, */template
+              } = view.state;
+              let named = dict();
+              named['Component'] = createConstRef(makeRouteTemplate(view.owner, name, template), '@Component');
+
+              // TODO: is this guaranteed to be undefined? It seems to be the
+              // case in the `OutletView` class. Investigate how much that class
+              // exists as an internal implementation detail only, or if it was
+              // used outside of core. As far as I can tell, test-helpers uses
+              // it but only for `setOutletState`.
+              // named['controller'] = createConstRef(controller, '@controller');
+              // Update: at least according to the debug render tree tests, we
+              // appear to always expect this to be undefined. Not a definitive
+              // source by any means, but is useful evidence
+              named['controller'] = UNDEFINED_REFERENCE;
+              named['model'] = UNDEFINED_REFERENCE;
+              let args = createCapturedArgs(named, EMPTY_POSITIONAL);
+              this._appendDefinition(view, curry(CurriedTypes.Component, outlet, view.owner, args, true), target);
             }
             appendTo(view, target) {
               let definition = new RootComponentDefinition(view);