ember-source 7.1.0-alpha.4 → 7.1.0-beta.1

package/dist/{prod/packages/shared-chunks/on-CersD7PL.js → dev/packages/shared-chunks/untouchable-this-B3DVwpHS.js}

@@ -1,33 +1,21 @@
-import { r as VM_SYSCALL_SIZE, C as CURRIED_COMPONENT, s as VM_CHILD_SCOPE_OP, t as VM_POP_SCOPE_OP, u as VM_PUSH_DYNAMIC_SCOPE_OP, v as VM_POP_DYNAMIC_SCOPE_OP, w as VM_CONSTANT_OP, x as decodeHandle, y as VM_CONSTANT_REFERENCE_OP, z as VM_PRIMITIVE_OP, A as isHandle, B as decodeImmediate, D as VM_PRIMITIVE_REFERENCE_OP, E as VM_DUP_OP, F as VM_POP_OP, G as VM_LOAD_OP, H as VM_FETCH_OP, I as VM_BIND_DYNAMIC_SCOPE_OP, J as VM_ENTER_OP, K as VM_EXIT_OP, L as VM_PUSH_SYMBOL_TABLE_OP, M as VM_PUSH_BLOCK_SCOPE_OP, N as VM_COMPILE_BLOCK_OP, O as VM_INVOKE_YIELD_OP, P as VM_JUMP_IF_OP, Q as VM_JUMP_UNLESS_OP, R as VM_JUMP_EQ_OP, b as VM_ASSERT_SAME_OP, S as VM_TO_BOOLEAN_OP, T as VM_TEXT_OP, U as VM_COMMENT_OP, W as VM_OPEN_ELEMENT_OP, X as VM_OPEN_DYNAMIC_ELEMENT_OP, Y as VM_PUSH_REMOTE_ELEMENT_OP, Z as VM_POP_REMOTE_ELEMENT_OP, _ as VM_FLUSH_ELEMENT_OP, $ as VM_CLOSE_ELEMENT_OP, a0 as VM_MODIFIER_OP, a1 as VM_DYNAMIC_MODIFIER_OP, a2 as VM_STATIC_ATTR_OP, a3 as VM_DYNAMIC_ATTR_OP, a4 as CURRIED_MODIFIER, a5 as VM_PUSH_COMPONENT_DEFINITION_OP, a6 as VM_RESOLVE_DYNAMIC_COMPONENT_OP, f as VM_RESOLVE_CURRIED_COMPONENT_OP, g as VM_PUSH_DYNAMIC_COMPONENT_INSTANCE_OP, a7 as VM_PUSH_ARGS_OP, a8 as VM_PUSH_EMPTY_ARGS_OP, a9 as VM_CAPTURE_ARGS_OP, aa as VM_PREPARE_ARGS_OP, ab as VM_CREATE_COMPONENT_OP, ac as VM_REGISTER_COMPONENT_DESTRUCTOR_OP, ad as VM_BEGIN_COMPONENT_TRANSACTION_OP, ae as VM_PUT_COMPONENT_OPERATIONS_OP, af as VM_COMPONENT_ATTR_OP, ag as VM_STATIC_COMPONENT_ATTR_OP, ah as VM_DID_CREATE_ELEMENT_OP, ai as VM_GET_COMPONENT_SELF_OP, aj as VM_GET_COMPONENT_TAG_NAME_OP, ak as VM_GET_COMPONENT_LAYOUT_OP, V as VM_MAIN_OP, al as VM_POPULATE_LAYOUT_OP, am as VM_VIRTUAL_ROOT_SCOPE_OP, an as VM_SET_NAMED_VARIABLES_OP, ao as VM_SET_BLOCKS_OP, ap as VM_INVOKE_COMPONENT_LAYOUT_OP, aq as VM_DID_RENDER_LAYOUT_OP, ar as VM_COMMIT_COMPONENT_TRANSACTION_OP, as as VM_CURRY_OP, at as VM_DYNAMIC_HELPER_OP, au as CURRIED_HELPER, av as VM_HELPER_OP, aw as VM_GET_VARIABLE_OP, ax as VM_SET_VARIABLE_OP, ay as VM_SET_BLOCK_OP, az as VM_ROOT_SCOPE_OP, aA as VM_GET_PROPERTY_OP, aB as VM_GET_BLOCK_OP, aC as VM_SPREAD_BLOCK_OP, aD as VM_HAS_BLOCK_OP, aE as VM_HAS_BLOCK_PARAMS_OP, aF as VM_CONCAT_OP, aG as VM_IF_INLINE_OP, aH as VM_NOT_OP, aI as VM_GET_DYNAMIC_VAR_OP, aJ as VM_LOG_OP, a as VM_CONTENT_TYPE_OP, aK as VM_DYNAMIC_CONTENT_TYPE_OP, d as VM_APPEND_HTML_OP, h as VM_APPEND_SAFE_HTML_OP, e as VM_APPEND_TEXT_OP, i as VM_APPEND_DOCUMENT_FRAGMENT_OP, j as VM_APPEND_NODE_OP, aL as VM_DEBUGGER_OP, aM as VM_ENTER_LIST_OP, aN as VM_EXIT_LIST_OP, aO as VM_ITERATE_OP } from './fragment-D7nBU9ae.js';
-import { u as unwrap, c as isIndexable$1, e as expect, S as StackImpl, d as dict, i as isDict } from './collections-GpG8lT2g.js';
+import { u as unwrap, e as expect, a as isIndexable, d as dict, S as StackImpl } from './collections-DPkjqeA3.js';
 import { a as assign } from './object-utils-AijlD-JH.js';
-import { toBool, setPath, getPath } from '../@glimmer/global-context/index.js';
-import { CONSTANT_TAG, INITIAL, validateTag, consumeTag, valueForTag, beginTrackFrame, endTrackFrame, CURRENT_TAG, createUpdatableTag } from '../@glimmer/validator/index.js';
-import { c as createComputeRef, v as valueForRef, a as createConstRef, d as createPrimitiveRef, i as isConstRef, U as UNDEFINED_REFERENCE, N as NULL_REFERENCE, T as TRUE_REFERENCE, F as FALSE_REFERENCE, R as REFERENCE, b as childRefFor, e as isInvokableRef, u as updateRef } from './reference-BNqcwZWH.js';
-import { e as $v0, f as $t1, g as $t0, a as $pc, b as $ra, c as $fp, d as $sp, h as $s1, $ as $s0 } from './registers-ylirb0dq.js';
-import { registerDestructor, destroy, associateDestroyableChild, _hasDestroyableChildren } from '../@glimmer/destroyable/index.js';
-import { d as getInternalModifierManager, g as getInternalHelperManager, h as hasInternalComponentManager, f as hasInternalHelperManager, s as setInternalComponentManager, i as setInternalHelperManager, j as setInternalModifierManager } from './api-B5UrgITK.js';
-import { m as managerHasCapability } from './capabilities-DXA-L0iT.js';
-import { ContentType } from '../@glimmer/vm/index.js';
-import { createIteratorRef } from '../@glimmer/reference/index.js';
+import { a as $v0, b as $t1, c as $t0, d as $pc, e as $ra, f as $fp, g as $sp, h as $s1, $ as $s0 } from './registers-C_W2qYHJ.js';
 import { s as setLocalDebugType } from './debug-brand-B1TWjOCH.js';
+import { a as createComputeRef, v as valueForRef, c as createConstRef, e as createPrimitiveRef, i as isConstRef, U as UNDEFINED_REFERENCE, N as NULL_REFERENCE, T as TRUE_REFERENCE, F as FALSE_REFERENCE, R as REFERENCE, h as createDebugAliasRef } from './reference-BoPB2LfI.js';
 import { b as EMPTY_STRING_ARRAY, e as enumerate, c as emptyArray } from './array-utils-CZQxrdD3.js';
-import { a as unwrapTemplate } from './constants-DThhT5fu.js';
+import { b as CONSTANT_TAG, I as INITIAL, y as validateTag, k as consumeTag, z as valueForTag, g as beginTrackFrame, p as endTrackFrame, c as CURRENT_TAG } from './cache-B7dqAS38.js';
+import { C as CURRIED_MODIFIER, a as CURRIED_COMPONENT } from './curried-BZnYakIg.js';
+import { j as VM_SYSCALL_SIZE, k as VM_CHILD_SCOPE_OP, l as VM_POP_SCOPE_OP, m as VM_PUSH_DYNAMIC_SCOPE_OP, n as VM_POP_DYNAMIC_SCOPE_OP, o as VM_CONSTANT_OP, p as decodeHandle, q as VM_CONSTANT_REFERENCE_OP, r as VM_PRIMITIVE_OP, s as isHandle, t as decodeImmediate, u as VM_PRIMITIVE_REFERENCE_OP, v as VM_DUP_OP, w as VM_POP_OP, x as VM_LOAD_OP, y as VM_FETCH_OP, z as VM_BIND_DYNAMIC_SCOPE_OP, A as VM_ENTER_OP, B as VM_EXIT_OP, C as VM_PUSH_SYMBOL_TABLE_OP, D as VM_PUSH_BLOCK_SCOPE_OP, E as VM_COMPILE_BLOCK_OP, F as VM_INVOKE_YIELD_OP, G as VM_JUMP_IF_OP, H as VM_JUMP_UNLESS_OP, I as VM_JUMP_EQ_OP, b as VM_ASSERT_SAME_OP, J as VM_TO_BOOLEAN_OP, K as VM_TEXT_OP, L as VM_COMMENT_OP, M as VM_OPEN_ELEMENT_OP, N as VM_OPEN_DYNAMIC_ELEMENT_OP, O as VM_PUSH_REMOTE_ELEMENT_OP, P as VM_POP_REMOTE_ELEMENT_OP, Q as VM_FLUSH_ELEMENT_OP, R as VM_CLOSE_ELEMENT_OP, S as VM_MODIFIER_OP, T as VM_DYNAMIC_MODIFIER_OP, U as VM_STATIC_ATTR_OP, W as VM_DYNAMIC_ATTR_OP, X as VM_PUSH_COMPONENT_DEFINITION_OP, Y as VM_RESOLVE_DYNAMIC_COMPONENT_OP, e as VM_RESOLVE_CURRIED_COMPONENT_OP, f as VM_PUSH_DYNAMIC_COMPONENT_INSTANCE_OP, Z as VM_PUSH_ARGS_OP, _ as VM_PUSH_EMPTY_ARGS_OP, $ as VM_CAPTURE_ARGS_OP, a0 as VM_PREPARE_ARGS_OP, a1 as VM_CREATE_COMPONENT_OP, a2 as VM_REGISTER_COMPONENT_DESTRUCTOR_OP, a3 as VM_BEGIN_COMPONENT_TRANSACTION_OP, a4 as VM_PUT_COMPONENT_OPERATIONS_OP, a5 as VM_COMPONENT_ATTR_OP, a6 as VM_STATIC_COMPONENT_ATTR_OP, a7 as VM_DID_CREATE_ELEMENT_OP, a8 as VM_GET_COMPONENT_SELF_OP, a9 as VM_GET_COMPONENT_TAG_NAME_OP, aa as VM_GET_COMPONENT_LAYOUT_OP, V as VM_MAIN_OP, ab as VM_POPULATE_LAYOUT_OP, ac as VM_VIRTUAL_ROOT_SCOPE_OP, ad as VM_SET_NAMED_VARIABLES_OP, ae as VM_SET_BLOCKS_OP, af as VM_INVOKE_COMPONENT_LAYOUT_OP, ag as VM_DID_RENDER_LAYOUT_OP, ah as VM_COMMIT_COMPONENT_TRANSACTION_OP } from './syscall-ops-BPFtDquC.js';
+import { d as debugToString } from './debug-to-string-C6LsA_qz.js';
+import { a as assert } from './assert-Zqc4wiAV.js';
+import { u as unwrapTemplate } from './template-BRrQR6KS.js';
+import { registerDestructor, destroy, associateDestroyableChild } from '../@glimmer/destroyable/index.js';
+import { m as managerHasCapability } from './capabilities-CZkuOqqC.js';
 import { I as InternalComponentCapabilities } from './flags-B9qxc-pB.js';
-
-/* eslint-disable @typescript-eslint/no-empty-object-type */
-function buildUntouchableThis(source) {
-  let context = null;
-  return context;
-}
-
-const ELEMENT_NODE = 1;
-const TEXT_NODE = 3;
-const COMMENT_NODE = 8;
-const NS_MATHML = 'http://www.w3.org/1998/Math/MathML';
-const NS_SVG = 'http://www.w3.org/2000/svg';
-const INSERT_BEFORE_BEGIN = 'beforebegin';
-const INSERT_BEFORE_END = 'beforeend';
+import { n as normalizeStringValue, C as ConcreteBounds } from './normalize-CKySQVU7.js';
+import { b as getInternalModifierManager } from './api-BawZUDYD.js';
+import { toBool } from '../@glimmer/global-context/index.js';
 
 function CheckInstanceof(Class) {
 }
@@ -77,8 +65,10 @@ class AppendOpcodes {
   evaluate(vm, opcode, type) {
     let operation = unwrap(this.evaluateOpcode[type]);
     if (operation.syscall) {
+      assert(!opcode.isMachine, `BUG: Mismatch between operation.syscall (${operation.syscall}) and opcode.isMachine (${opcode.isMachine}) for ${opcode.type}`);
       operation.evaluate(vm, opcode);
     } else {
+      assert(opcode.isMachine, `BUG: Mismatch between operation.syscall (${operation.syscall}) and opcode.isMachine (${opcode.isMachine}) for ${opcode.type}`);
       operation.evaluate(vm.lowlevel, opcode);
     }
   }
@@ -163,79 +153,6 @@ function curry(type, spec, owner, args, resolved = false) {
   return new CurriedValue(type, spec, owner, args, resolved);
 }
 
-function createCurryRef(type, inner, owner, args, resolver, isStrict) {
-  let lastValue, curriedDefinition;
-  return createComputeRef(() => {
-    let value = valueForRef(inner);
-    if (value === lastValue) {
-      return curriedDefinition;
-    }
-    if (isCurriedType(value, type)) {
-      curriedDefinition = args ? curry(type, value, owner, args) : args;
-    } else if (type === CURRIED_COMPONENT && typeof value === 'string' && value) {
-      curriedDefinition = curry(type, value, owner, args);
-    } else if (isIndexable$1(value)) {
-      curriedDefinition = curry(type, value, owner, args);
-    } else {
-      curriedDefinition = null;
-    }
-    lastValue = value;
-    return curriedDefinition;
-  });
-}
-
-class CursorImpl {
-  constructor(element, nextSibling) {
-    this.element = element;
-    this.nextSibling = nextSibling;
-    setLocalDebugType('cursor', this);
-  }
-}
-class ConcreteBounds {
-  constructor(parentNode, first, last) {
-    this.parentNode = parentNode;
-    this.first = first;
-    this.last = last;
-  }
-  parentElement() {
-    return this.parentNode;
-  }
-  firstNode() {
-    return this.first;
-  }
-  lastNode() {
-    return this.last;
-  }
-}
-function move(bounds, reference) {
-  let parent = bounds.parentElement();
-  let first = bounds.firstNode();
-  let last = bounds.lastNode();
-  let current = first;
-  while (true) {
-    let next = current.nextSibling;
-    parent.insertBefore(current, reference);
-    if (current === last) {
-      return next;
-    }
-    current = expect(next);
-  }
-}
-function clear(bounds) {
-  let parent = bounds.parentElement();
-  let first = bounds.firstNode();
-  let last = bounds.lastNode();
-  let current = first;
-  while (true) {
-    let next = current.nextSibling;
-    parent.removeChild(current);
-    if (current === last) {
-      return next;
-    }
-    current = expect(next);
-  }
-}
-
 /** @internal */
 function hasCustomDebugRenderTreeLifecycle(manager) {
   return 'getDebugCustomRenderTree' in manager;
@@ -243,190 +160,14 @@ function hasCustomDebugRenderTreeLifecycle(manager) {
 
 function resolveComponent(resolver, constants, name, owner) {
   let definition = resolver?.lookupComponent?.(name, expect(owner)) ?? null;
+  if (!definition) {
+    throw new Error(`Attempted to resolve \`${name}\`, which was expected to be a component, but nothing was found.`);
+  }
 
   // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- @fixme
   return constants.resolvedComponent(definition, name);
 }
 
-let GUID = 0;
-class Ref {
-  id = GUID++;
-  value;
-  constructor(value) {
-    this.value = value;
-  }
-  get() {
-    return this.value;
-  }
-  release() {
-    this.value = null;
-  }
-  toString() {
-    let label = `Ref ${this.id}`;
-    if (this.value === null) {
-      return `${label} (released)`;
-    } else {
-      try {
-        // eslint-disable-next-line @typescript-eslint/no-base-to-string
-        return `${label}: ${this.value}`;
-      } catch {
-        return label;
-      }
-    }
-  }
-}
-class DebugRenderTreeImpl {
-  stack = new StackImpl();
-  refs = new WeakMap();
-  roots = new Set();
-  nodes = new WeakMap();
-  begin() {
-    this.reset();
-  }
-  create(state, node) {
-    let internalNode = assign({}, node, {
-      bounds: null,
-      refs: new Set()
-    });
-    this.nodes.set(state, internalNode);
-    this.appendChild(internalNode, state);
-    this.enter(state);
-  }
-  update(state) {
-    this.enter(state);
-  }
-  didRender(state, bounds) {
-    this.nodeFor(state).bounds = bounds;
-    this.exit();
-  }
-  willDestroy(state) {
-    expect(this.refs.get(state)).release();
-  }
-  commit() {
-    this.reset();
-  }
-  capture() {
-    return this.captureRefs(this.roots);
-  }
-  reset() {
-    if (this.stack.size !== 0) {
-      // We probably encountered an error during the rendering loop. This will
-      // likely trigger undefined behavior and memory leaks as the error left
-      // things in an inconsistent state. It is recommended that the user
-      // refresh the page.
-
-      // TODO: We could warn here? But this happens all the time in our tests?
-
-      // Clean up the root reference to prevent errors from happening if we
-      // attempt to capture the render tree (Ember Inspector may do this)
-      let root = expect(this.stack.toArray()[0]);
-      let ref = this.refs.get(root);
-      if (ref !== undefined) {
-        this.roots.delete(ref);
-      }
-      while (!this.stack.isEmpty()) {
-        this.stack.pop();
-      }
-    }
-  }
-  enter(state) {
-    this.stack.push(state);
-  }
-  exit() {
-    this.stack.pop();
-  }
-  nodeFor(state) {
-    return expect(this.nodes.get(state));
-  }
-  appendChild(node, state) {
-    let parent = this.stack.current;
-    let ref = new Ref(state);
-    this.refs.set(state, ref);
-    if (parent) {
-      let parentNode = this.nodeFor(parent);
-      parentNode.refs.add(ref);
-      node.parent = parentNode;
-    } else {
-      this.roots.add(ref);
-    }
-  }
-  captureRefs(refs) {
-    let captured = [];
-    refs.forEach(ref => {
-      let state = ref.get();
-      if (state) {
-        captured.push(this.captureNode(`render-node:${ref.id}`, state));
-      } else {
-        refs.delete(ref);
-      }
-    });
-    return captured;
-  }
-  captureNode(id, state) {
-    let node = this.nodeFor(state);
-    let {
-      type,
-      name,
-      args,
-      instance,
-      refs
-    } = node;
-    let bounds = this.captureBounds(node);
-    let children = this.captureRefs(refs);
-    return {
-      id,
-      type,
-      name,
-      args: reifyArgsDebug(args),
-      instance,
-      bounds,
-      children
-    };
-  }
-  captureBounds(node) {
-    let bounds = expect(node.bounds);
-    let parentElement = bounds.parentElement();
-    let firstNode = bounds.firstNode();
-    let lastNode = bounds.lastNode();
-    return {
-      parentElement,
-      firstNode,
-      lastNode
-    };
-  }
-}
-function getDebugName(definition, manager = definition.manager) {
-  return definition.resolvedName ?? definition.debugName ?? manager.getDebugName(definition.state);
-}
-
-function normalizeStringValue(value) {
-  if (isEmpty$1(value)) {
-    return '';
-  }
-  return String(value);
-}
-function shouldCoerce(value) {
-  return isString(value) || isEmpty$1(value) || typeof value === 'boolean' || typeof value === 'number';
-}
-function isEmpty$1(value) {
-  return value === null || value === undefined || typeof value.toString !== 'function';
-}
-function isIndexable(value) {
-  return value !== null && typeof value === 'object';
-}
-function isSafeString(value) {
-  return isIndexable(value) && typeof value['toHTML'] === 'function';
-}
-function isNode(value) {
-  return isIndexable(value) && typeof value['nodeType'] === 'number';
-}
-function isFragment(value) {
-  return isIndexable(value) && value['nodeType'] === 11;
-}
-function isString(value) {
-  return typeof value === 'string';
-}
-
 function createClassListRef(list) {
   return createComputeRef(() => {
     let ret = [];
@@ -450,7 +191,7 @@ APPEND_OPCODES.add(VM_CONSTANT_OP, (vm, {
 APPEND_OPCODES.add(VM_CONSTANT_REFERENCE_OP, (vm, {
   op1: other
 }) => {
-  vm.stack.push(createConstRef(vm.constants.getValue(decodeHandle(other))));
+  vm.stack.push(createConstRef(vm.constants.getValue(decodeHandle(other)), false));
 });
 APPEND_OPCODES.add(VM_PRIMITIVE_OP, (vm, {
   op1: primitive
@@ -546,6 +287,7 @@ APPEND_OPCODES.add(VM_INVOKE_YIELD_OP, vm => {
   let table = check(stack.pop());
   let args = check(stack.pop());
   if (table === null || handle === null) {
+    // To balance the pop{Frame,Scope}
     vm.lowlevel.pushFrame();
     vm.pushScope(scope ?? vm.scope());
     return;
@@ -831,7 +573,7 @@ APPEND_OPCODES.add(VM_DYNAMIC_MODIFIER_OP, vm => {
   let instanceRef = createComputeRef(() => {
     let value = valueForRef(ref);
     let owner;
-    if (!isIndexable$1(value)) {
+    if (!isIndexable(value)) {
       return;
     }
     let hostDefinition;
@@ -855,10 +597,10 @@ APPEND_OPCODES.add(VM_DYNAMIC_MODIFIER_OP, vm => {
       hostDefinition = value;
       owner = initialOwner;
     }
-    let manager = getInternalModifierManager(hostDefinition);
+    let manager = getInternalModifierManager(hostDefinition, true);
     if (manager === null) {
       {
-        throw new Error('BUG: modifier manager expected');
+        throw new Error(`Expected a dynamic modifier definition, but received an object or function that did not have a modifier manager associated with it. The dynamic invocation was \`{{${ref.debugLabel}}}\`, and the incorrect definition is the value at the path \`${ref.debugLabel}\`, which was: ${debugToString?.(hostDefinition)}`);
       }
     }
     let definition = {
@@ -1038,11 +780,14 @@ APPEND_OPCODES.add(VM_RESOLVE_DYNAMIC_COMPONENT_OP, (vm, {
   let component = check(valueForRef(ref));
   let constants = vm.constants;
   let owner = vm.getOwner();
-  constants.getValue(_isStrict);
+  let isStrict = constants.getValue(_isStrict);
   vm.loadValue($t1, null); // Clear the temp register
 
   let definition;
   if (typeof component === 'string') {
+    if (isStrict) {
+      throw new Error(`Attempted to resolve a dynamic component with a string definition, \`${component}\` in a strict mode template. In strict mode, using strings to resolve component definitions is prohibited. You can instead import the component definition and use it directly.`);
+    }
     let resolvedDefinition = resolveComponent(vm.context.resolver, constants, component, owner);
     definition = expect(resolvedDefinition);
   } else if (isCurriedValue(component)) {
@@ -1050,6 +795,12 @@ APPEND_OPCODES.add(VM_RESOLVE_DYNAMIC_COMPONENT_OP, (vm, {
   } else {
     definition = constants.component(component, owner);
   }
+  if (!isCurriedValue(definition) && !definition.resolvedName && !definition.debugName) {
+    let debugLabel = ref.debugLabel;
+    if (debugLabel) {
+      definition.debugName = debugLabel;
+    }
+  }
   stack.push(definition);
 });
 APPEND_OPCODES.add(VM_RESOLVE_CURRIED_COMPONENT_OP, vm => {
@@ -1058,10 +809,22 @@ APPEND_OPCODES.add(VM_RESOLVE_CURRIED_COMPONENT_OP, vm => {
   let value = valueForRef(ref);
   let constants = vm.constants;
   let definition;
+  if (!(typeof value === 'function' || typeof value === 'object' && value !== null)) {
+    throw new Error(`Expected a component definition, but received ${value}. You may have accidentally done <${ref.debugLabel}>, where "${ref.debugLabel}" was a string instead of a curried component definition. You must either use the component definition directly, or use the {{component}} helper to create a curried component definition when invoking dynamically.`);
+  }
   if (isCurriedValue(value)) {
     definition = value;
   } else {
     definition = constants.component(value, vm.getOwner(), true);
+    if (definition === null) {
+      throw new Error(`Expected a dynamic component definition, but received an object or function that did not have a component manager associated with it. The dynamic invocation was \`<${ref.debugLabel}>\` or \`{{${ref.debugLabel}}}\`, and the incorrect definition is the value at the path \`${ref.debugLabel}\`, which was: ${debugToString?.(value) ?? value}`);
+    }
+  }
+  if (definition && !isCurriedValue(definition) && !definition.resolvedName && !definition.debugName) {
+    let debugLabel = ref.debugLabel;
+    if (debugLabel) {
+      definition.debugName = debugLabel;
+    }
   }
   stack.push(definition);
 });
@@ -1121,6 +884,7 @@ APPEND_OPCODES.add(VM_PREPARE_ARGS_OP, (vm, {
     definition
   } = instance;
   if (isCurriedType(definition, CURRIED_COMPONENT)) {
+    assert(!definition.manager);
     let constants = vm.constants;
     let {
       definition: resolvedDefinition,
@@ -1236,12 +1000,22 @@ APPEND_OPCODES.add(VM_REGISTER_COMPONENT_DESTRUCTOR_OP, (vm, {
     capabilities
   } = check(vm.fetchValue(check(register, CheckRegister)));
   let d = manager.getDestroyable(state);
+  if (!managerHasCapability(manager, capabilities, InternalComponentCapabilities.willDestroy) && d !== null && "string" in d) {
+    throw new Error('BUG: Destructor has willDestroy, but the willDestroy capability was not enabled for this component. Pre-destruction hooks must be explicitly opted into');
+  }
   if (d) vm.associateDestroyable(d);
 });
 APPEND_OPCODES.add(VM_BEGIN_COMPONENT_TRANSACTION_OP, (vm, {
   op1: register
 }) => {
   let name;
+  {
+    let {
+      definition,
+      manager
+    } = check(vm.fetchValue(check(register, CheckRegister)));
+    name = getDebugName(definition, manager);
+  }
   vm.beginCacheGroup(name);
   vm.tree().pushAppendingBlock();
 });
@@ -1421,6 +1195,7 @@ APPEND_OPCODES.add(VM_GET_COMPONENT_SELF_OP, (vm, {
     }
     let compilable = definition.compilable;
     if (compilable === null) {
+      assert(managerHasCapability(manager, instance.capabilities, InternalComponentCapabilities.dynamicLayout));
       let resolver = vm.context.resolver;
       compilable = resolver === null ? null : manager.getDynamicLayout(state, resolver);
     }
@@ -1491,6 +1266,7 @@ APPEND_OPCODES.add(VM_GET_COMPONENT_LAYOUT_OP, (vm, {
     let {
       capabilities
     } = instance;
+    assert(managerHasCapability(manager, capabilities, InternalComponentCapabilities.dynamicLayout));
     let resolver = vm.context.resolver;
     compilable = resolver === null ? null : manager.getDynamicLayout(instance.state, resolver);
     if (compilable === null) {
@@ -1937,7 +1713,8 @@ class NamedArgumentsImpl {
     }
     let ref = stack.get(idx, base);
     {
-      return ref;
+      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- @fixme
+      return createDebugAliasRef(atNames ? name : `@${name}`, ref);
     }
   }
   capture() {
@@ -1948,7 +1725,8 @@ class NamedArgumentsImpl {
     let map = dict();
     for (const [i, name] of enumerate(names)) {
       {
-        map[name] = unwrap(references[i]);
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- @fixme
+        map[name] = createDebugAliasRef(`@${name}`, unwrap(references[i]));
       }
     }
     return map;
@@ -2154,1153 +1932,193 @@ const EMPTY_NAMED = Object.freeze(Object.create(null));
 const EMPTY_POSITIONAL = EMPTY_REFERENCES;
 const EMPTY_ARGS = createCapturedArgs(EMPTY_NAMED, EMPTY_POSITIONAL);
 
-function createConcatRef(partsRefs) {
-  return createComputeRef(() => {
-    const parts = [];
-    for (const ref of partsRefs) {
-      const value = valueForRef(ref);
-      if (value !== null && value !== undefined) {
-        parts.push(castToString(value));
-      }
+let GUID = 0;
+class Ref {
+  id = GUID++;
+  value;
+  constructor(value) {
+    this.value = value;
+  }
+  get() {
+    return this.value;
+  }
+  release() {
+    if (this.value === null) {
+      throw new Error('BUG: double release?');
     }
-    if (parts.length > 0) {
-      return parts.join('');
+    this.value = null;
+  }
+  toString() {
+    let label = `Ref ${this.id}`;
+    if (this.value === null) {
+      return `${label} (released)`;
+    } else {
+      try {
+        // eslint-disable-next-line @typescript-eslint/no-base-to-string
+        return `${label}: ${this.value}`;
+      } catch {
+        return label;
+      }
     }
-    return null;
-  });
-}
-function castToString(value) {
-  if (typeof value === 'string') {
-    return value;
-  } else if (typeof value.toString !== 'function') {
-    return '';
   }
-
-  // eslint-disable-next-line @typescript-eslint/no-base-to-string -- @fixme
-  return String(value);
 }
-
-APPEND_OPCODES.add(VM_CURRY_OP, (vm, {
-  op1: type,
-  op2: _isStrict
-}) => {
-  let stack = vm.stack;
-  let definition = check(stack.pop());
-  let capturedArgs = check(stack.pop());
-  let owner = vm.getOwner();
-  vm.context.resolver;
-  vm.loadValue($v0, createCurryRef(type, definition, owner, capturedArgs));
-});
-APPEND_OPCODES.add(VM_DYNAMIC_HELPER_OP, vm => {
-  let stack = vm.stack;
-  let ref = check(stack.pop());
-  let args = check(stack.pop()).capture();
-  let helperRef;
-  let initialOwner = vm.getOwner();
-  let helperInstanceRef = createComputeRef(() => {
-    if (helperRef !== undefined) {
-      destroy(helperRef);
-    }
-    let definition = valueForRef(ref);
-    if (isCurriedType(definition, CURRIED_HELPER)) {
-      let {
-        definition: resolvedDef,
-        owner,
-        positional,
-        named
-      } = resolveCurriedValue(definition);
-      let helper = resolveHelper(resolvedDef);
-      if (named !== undefined) {
-        // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
-        args.named = assign({}, ...named, args.named);
-      }
-      if (positional !== undefined) {
-        args.positional = positional.concat(args.positional);
-      }
-      helperRef = helper(args, owner);
-      associateDestroyableChild(helperInstanceRef, helperRef);
-    } else if (isIndexable$1(definition)) {
-      let helper = resolveHelper(definition);
-      helperRef = helper(args, initialOwner);
-      if (_hasDestroyableChildren(helperRef)) {
-        associateDestroyableChild(helperInstanceRef, helperRef);
-      }
-    } else {
-      helperRef = UNDEFINED_REFERENCE;
-    }
-  });
-  let helperValueRef = createComputeRef(() => {
-    valueForRef(helperInstanceRef);
-    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- @fixme
-    return valueForRef(helperRef);
-  });
-  vm.associateDestroyable(helperInstanceRef);
-  vm.loadValue($v0, helperValueRef);
-});
-function resolveHelper(definition, ref) {
-  let managerOrHelper = getInternalHelperManager(definition, true);
-  let helper;
-  if (managerOrHelper === null) {
-    helper = null;
-  } else {
-    helper = typeof managerOrHelper === 'function' ? managerOrHelper : managerOrHelper.getHelper(definition);
-  }
-  return helper;
-}
-APPEND_OPCODES.add(VM_HELPER_OP, (vm, {
-  op1: handle
-}) => {
-  let stack = vm.stack;
-  let helper = check(vm.constants.getValue(handle));
-  let args = check(stack.pop());
-  let value = helper(args.capture(), vm.getOwner(), vm.dynamicScope());
-  if (_hasDestroyableChildren(value)) {
-    vm.associateDestroyable(value);
-  }
-  vm.loadValue($v0, value);
-});
-APPEND_OPCODES.add(VM_GET_VARIABLE_OP, (vm, {
-  op1: symbol
-}) => {
-  let expr = vm.referenceForSymbol(symbol);
-  vm.stack.push(expr);
-});
-APPEND_OPCODES.add(VM_SET_VARIABLE_OP, (vm, {
-  op1: symbol
-}) => {
-  let expr = check(vm.stack.pop());
-  vm.scope().bindSymbol(symbol, expr);
-});
-APPEND_OPCODES.add(VM_SET_BLOCK_OP, (vm, {
-  op1: symbol
-}) => {
-  let handle = check(vm.stack.pop());
-  let scope = check(vm.stack.pop());
-  let table = check(vm.stack.pop());
-  vm.scope().bindBlock(symbol, [handle, scope, table]);
-});
-APPEND_OPCODES.add(VM_ROOT_SCOPE_OP, (vm, {
-  op1: size
-}) => {
-  vm.pushRootScope(size, vm.getOwner());
-});
-APPEND_OPCODES.add(VM_GET_PROPERTY_OP, (vm, {
-  op1: _key
-}) => {
-  let key = vm.constants.getValue(_key);
-  let expr = check(vm.stack.pop());
-  vm.stack.push(childRefFor(expr, key));
-});
-APPEND_OPCODES.add(VM_GET_BLOCK_OP, (vm, {
-  op1: _block
-}) => {
-  let {
-    stack
-  } = vm;
-  let block = vm.scope().getBlock(_block);
-  stack.push(block);
-});
-APPEND_OPCODES.add(VM_SPREAD_BLOCK_OP, vm => {
-  let {
-    stack
-  } = vm;
-  let block = check(stack.pop());
-  if (block && !isUndefinedReference(block)) {
-    let [handleOrCompilable, scope, table] = block;
-    stack.push(table);
-    stack.push(scope);
-    stack.push(handleOrCompilable);
-  } else {
-    stack.push(null);
-    stack.push(null);
-    stack.push(null);
-  }
-});
-function isUndefinedReference(input) {
-  return input === UNDEFINED_REFERENCE;
-}
-APPEND_OPCODES.add(VM_HAS_BLOCK_OP, vm => {
-  let {
-    stack
-  } = vm;
-  let block = check(stack.pop());
-  if (block && !isUndefinedReference(block)) {
-    stack.push(TRUE_REFERENCE);
-  } else {
-    stack.push(FALSE_REFERENCE);
-  }
-});
-APPEND_OPCODES.add(VM_HAS_BLOCK_PARAMS_OP, vm => {
-  // FIXME(mmun): should only need to push the symbol table
-  vm.stack.pop();
-  vm.stack.pop();
-  let table = check(vm.stack.pop());
-  let hasBlockParams = table && table.parameters.length;
-  vm.stack.push(hasBlockParams ? TRUE_REFERENCE : FALSE_REFERENCE);
-});
-APPEND_OPCODES.add(VM_CONCAT_OP, (vm, {
-  op1: count
-}) => {
-  let out = new Array(count);
-  for (let i = count; i > 0; i--) {
-    let offset = i - 1;
-    out[offset] = check(vm.stack.pop());
-  }
-  vm.stack.push(createConcatRef(out));
-});
-APPEND_OPCODES.add(VM_IF_INLINE_OP, vm => {
-  let condition = check(vm.stack.pop());
-  let truthy = check(vm.stack.pop());
-  let falsy = check(vm.stack.pop());
-  vm.stack.push(createComputeRef(() => {
-    if (toBool(valueForRef(condition))) {
-      return valueForRef(truthy);
-    } else {
-      return valueForRef(falsy);
-    }
-  }));
-});
-APPEND_OPCODES.add(VM_NOT_OP, vm => {
-  let ref = check(vm.stack.pop());
-  vm.stack.push(createComputeRef(() => {
-    return !toBool(valueForRef(ref));
-  }));
-});
-APPEND_OPCODES.add(VM_GET_DYNAMIC_VAR_OP, vm => {
-  let scope = vm.dynamicScope();
-  let stack = vm.stack;
-  let nameRef = check(stack.pop());
-  stack.push(createComputeRef(() => {
-    let name = String(valueForRef(nameRef));
-    return valueForRef(scope.get(name));
-  }));
-});
-APPEND_OPCODES.add(VM_LOG_OP, vm => {
-  let {
-    positional
-  } = check(vm.stack.pop()).capture();
-  vm.loadValue($v0, createComputeRef(() => {
-    // eslint-disable-next-line no-console
-    console.log(...reifyPositional(positional));
-  }));
-});
-
-class DynamicTextContent {
-  constructor(node, reference, lastValue) {
-    this.node = node;
-    this.reference = reference;
-    this.lastValue = lastValue;
-  }
-  evaluate() {
-    let value = valueForRef(this.reference);
-    let {
-      lastValue
-    } = this;
-    if (value === lastValue) return;
-    let normalized;
-    if (isEmpty$1(value)) {
-      normalized = '';
-    } else if (isString(value)) {
-      normalized = value;
-    } else {
-      normalized = String(value);
-    }
-    if (normalized !== lastValue) {
-      let textNode = this.node;
-      textNode.nodeValue = this.lastValue = normalized;
-    }
-  }
-}
-
-function toContentType(value) {
-  if (shouldCoerce(value)) {
-    return ContentType.String;
-  } else if (isCurriedType(value, CURRIED_COMPONENT) || hasInternalComponentManager(value)) {
-    return ContentType.Component;
-  } else if (isCurriedType(value, CURRIED_HELPER) || hasInternalHelperManager(value)) {
-    return ContentType.Helper;
-  } else if (isSafeString(value)) {
-    return ContentType.SafeString;
-  } else if (isFragment(value)) {
-    return ContentType.Fragment;
-  } else if (isNode(value)) {
-    return ContentType.Node;
-  } else {
-    return ContentType.String;
-  }
-}
-function toDynamicContentType(value) {
-  if (!isIndexable$1(value)) {
-    return ContentType.String;
-  }
-  if (isCurriedType(value, CURRIED_COMPONENT) || hasInternalComponentManager(value)) {
-    return ContentType.Component;
-  } else {
-    return ContentType.Helper;
-  }
-}
-APPEND_OPCODES.add(VM_CONTENT_TYPE_OP, vm => {
-  let reference = check(vm.stack.peek());
-  vm.stack.push(toContentType(valueForRef(reference)));
-  if (!isConstRef(reference)) {
-    vm.updateWith(new AssertFilter(reference, toContentType));
-  }
-});
-APPEND_OPCODES.add(VM_DYNAMIC_CONTENT_TYPE_OP, vm => {
-  let reference = check(vm.stack.peek());
-  vm.stack.push(toDynamicContentType(valueForRef(reference)));
-  if (!isConstRef(reference)) {
-    vm.updateWith(new AssertFilter(reference, toDynamicContentType));
+class DebugRenderTreeImpl {
+  stack = new StackImpl();
+  refs = new WeakMap();
+  roots = new Set();
+  nodes = new WeakMap();
+  begin() {
+    this.reset();
   }
-});
-APPEND_OPCODES.add(VM_APPEND_HTML_OP, vm => {
-  let reference = check(vm.stack.pop());
-  let rawValue = valueForRef(reference);
-  let value = isEmpty$1(rawValue) ? '' : String(rawValue);
-  vm.tree().appendDynamicHTML(value);
-});
-APPEND_OPCODES.add(VM_APPEND_SAFE_HTML_OP, vm => {
-  let reference = check(vm.stack.pop());
-  let rawValue = check(valueForRef(reference)).toHTML();
-  let value = isEmpty$1(rawValue) ? '' : check(rawValue);
-  vm.tree().appendDynamicHTML(value);
-});
-APPEND_OPCODES.add(VM_APPEND_TEXT_OP, vm => {
-  let reference = check(vm.stack.pop());
-  let rawValue = valueForRef(reference);
-  let value = isEmpty$1(rawValue) ? '' : String(rawValue);
-  let node = vm.tree().appendDynamicText(value);
-  if (!isConstRef(reference)) {
-    vm.updateWith(new DynamicTextContent(node, reference, value));
+  create(state, node) {
+    let internalNode = assign({}, node, {
+      bounds: null,
+      refs: new Set()
+    });
+    this.nodes.set(state, internalNode);
+    this.appendChild(internalNode, state);
+    this.enter(state);
   }
-});
-APPEND_OPCODES.add(VM_APPEND_DOCUMENT_FRAGMENT_OP, vm => {
-  let reference = check(vm.stack.pop());
-  let value = check(valueForRef(reference));
-  vm.tree().appendDynamicFragment(value);
-});
-APPEND_OPCODES.add(VM_APPEND_NODE_OP, vm => {
-  let reference = check(vm.stack.pop());
-  let value = check(valueForRef(reference));
-  vm.tree().appendDynamicNode(value);
-});
-
-// Allow the contents of `debugCallback` without extra annotations
-/* eslint-disable @typescript-eslint/no-unused-expressions */
-
-function debugCallback(context, get) {
-  // eslint-disable-next-line no-console
-  console.info('Use `context`, and `get(<path>)` to debug this template.');
-
-  // for example...
-  context === get('this');
-
-  // eslint-disable-next-line no-debugger
-  debugger;
-}
-let callback = debugCallback;
-
-// For testing purposes
-function setDebuggerCallback(cb) {
-  callback = cb;
-}
-function resetDebuggerCallback() {
-  callback = debugCallback;
-}
-class ScopeInspector {
-  #symbols;
-  constructor(scope, symbols) {
-    this.scope = scope;
-    this.#symbols = symbols;
+  update(state) {
+    this.enter(state);
   }
-  get(path) {
-    let {
-      scope
-    } = this;
-    let symbols = this.#symbols;
-    let parts = path.split('.');
-    let [head, ...tail] = path.split('.');
-    let ref;
-    if (head === 'this') {
-      ref = scope.getSelf();
-    } else if (symbols.locals[head]) {
-      ref = unwrap(scope.getSymbol(symbols.locals[head]));
-    } else {
-      ref = this.scope.getSelf();
-      tail = parts;
+  didRender(state, bounds) {
+    if (this.stack.current !== state) {
+      // eslint-disable-next-line @typescript-eslint/no-base-to-string
+      throw new Error(`BUG: expecting ${this.stack.current}, got ${state}`);
     }
-    return tail.reduce((r, part) => childRefFor(r, part), ref);
-  }
-}
-APPEND_OPCODES.add(VM_DEBUGGER_OP, (vm, {
-  op1: _debugInfo
-}) => {
-  let debuggerInfo = vm.constants.getValue(decodeHandle(_debugInfo));
-  let inspector = new ScopeInspector(vm.scope(), debuggerInfo);
-  callback(valueForRef(vm.getSelf()), path => valueForRef(inspector.get(path)));
-});
-
-APPEND_OPCODES.add(VM_ENTER_LIST_OP, (vm, {
-  op1: relativeStart,
-  op2: elseTarget
-}) => {
-  let stack = vm.stack;
-  let listRef = check(stack.pop());
-  let keyRef = check(stack.pop());
-  let keyValue = valueForRef(keyRef);
-  // eslint-disable-next-line @typescript-eslint/no-base-to-string -- @fixme
-  let key = keyValue === null ? '@identity' : String(keyValue);
-  let iteratorRef = createIteratorRef(listRef, key);
-  let iterator = valueForRef(iteratorRef);
-  vm.updateWith(new AssertFilter(iteratorRef, iterator => iterator.isEmpty()));
-  if (iterator.isEmpty()) {
-    // TODO: Fix this offset, should be accurate
-    vm.lowlevel.goto(elseTarget + 1);
-  } else {
-    vm.enterList(iteratorRef, relativeStart);
-    vm.stack.push(iterator);
-  }
-});
-APPEND_OPCODES.add(VM_EXIT_LIST_OP, vm => {
-  vm.exitList();
-});
-APPEND_OPCODES.add(VM_ITERATE_OP, (vm, {
-  op1: breaks
-}) => {
-  let stack = vm.stack;
-  let iterator = check(stack.peek());
-  let item = iterator.next();
-  if (item !== null) {
-    vm.registerItem(vm.enterItem(item));
-  } else {
-    vm.lowlevel.goto(breaks);
+    this.nodeFor(state).bounds = bounds;
+    this.exit();
   }
-});
-
-const CAPABILITIES = {
-  dynamicLayout: false,
-  dynamicTag: false,
-  prepareArgs: false,
-  createArgs: false,
-  attributeHook: false,
-  elementHook: false,
-  createCaller: false,
-  dynamicScope: false,
-  updateHook: false,
-  createInstance: false,
-  wrapped: false,
-  willDestroy: false,
-  hasSubOwner: false
-};
-class TemplateOnlyComponentManager {
-  getCapabilities() {
-    return CAPABILITIES;
-  }
-  getDebugName({
-    name
-  }) {
-    return name;
-  }
-  getSelf() {
-    return NULL_REFERENCE;
-  }
-  getDestroyable() {
-    return null;
+  willDestroy(state) {
+    expect(this.refs.get(state)).release();
   }
-}
-const TEMPLATE_ONLY_COMPONENT_MANAGER = new TemplateOnlyComponentManager();
-
-// This is only exported for types, don't use this class directly
-class TemplateOnlyComponentDefinition {
-  constructor(moduleName = '@glimmer/component/template-only', name = '(unknown template-only component)') {
-    this.moduleName = moduleName;
-    this.name = name;
+  commit() {
+    this.reset();
   }
-  toString() {
-    return this.moduleName;
+  capture() {
+    return this.captureRefs(this.roots);
   }
-}
-setInternalComponentManager(TEMPLATE_ONLY_COMPONENT_MANAGER, TemplateOnlyComponentDefinition.prototype);
-
-/**
-  This utility function is used to declare a given component has no backing class. When the rendering engine detects this it
-  is able to perform a number of optimizations. Templates that are associated with `templateOnly()` will be rendered _as is_
-  without adding a wrapping `<div>` (or any of the other element customization behaviors of [@ember/component](/ember/release/classes/Component)).
-  Specifically, this means that the template will be rendered as "outer HTML".
-
-  In general, this method will be used by build time tooling and would not be directly written in an application. However,
-  at times it may be useful to use directly to leverage the "outer HTML" semantics mentioned above. For example, if an addon would like
-  to use these semantics for its templates but cannot be certain it will only be consumed by applications that have enabled the
-  `template-only-glimmer-components` optional feature.
-
-  @example
-
-  ```js
-  import { templateOnlyComponent } from '@glimmer/runtime';
-
-  export default templateOnlyComponent();
-  ```
-
-  @public
-  @method templateOnly
-  @param {String} moduleName the module name that the template only component represents, this will be used for debugging purposes
-  @category EMBER_GLIMMER_SET_COMPONENT_TEMPLATE
-*/
-
-function templateOnlyComponent(moduleName, name) {
-  return new TemplateOnlyComponentDefinition(moduleName, name);
-}
-
-// http://www.w3.org/TR/html/syntax.html#html-integration-point
-const SVG_INTEGRATION_POINTS = {
-  foreignObject: 1,
-  desc: 1,
-  title: 1
-};
-
-// http://www.w3.org/TR/html/syntax.html#adjust-svg-attributes
-// TODO: Adjust SVG attributes
-
-// http://www.w3.org/TR/html/syntax.html#parsing-main-inforeign
-// TODO: Adjust SVG elements
-
-// http://www.w3.org/TR/html/syntax.html#parsing-main-inforeign
-const BLACKLIST_TABLE = Object.create(null);
-class DOMOperations {
-  // Set by this.setupUselessElement() in constructor
+  reset() {
+    if (this.stack.size !== 0) {
+      // We probably encountered an error during the rendering loop. This will
+      // likely trigger undefined behavior and memory leaks as the error left
+      // things in an inconsistent state. It is recommended that the user
+      // refresh the page.
 
-  constructor(document) {
-    this.document = document;
-    this.setupUselessElement();
-  }
+      // TODO: We could warn here? But this happens all the time in our tests?
 
-  // split into separate method so that NodeDOMTreeConstruction
-  // can override it.
-  setupUselessElement() {
-    this.uselessElement = this.document.createElement('div');
-  }
-  createElement(tag, context) {
-    let isElementInSVGNamespace, isHTMLIntegrationPoint, isElementInMathMlNamespace, ns;
-    if (context) {
-      isElementInSVGNamespace = context.namespaceURI === NS_SVG || tag === 'svg';
-      isElementInMathMlNamespace = context.namespaceURI === NS_MATHML || tag === 'math';
-      isHTMLIntegrationPoint = !!SVG_INTEGRATION_POINTS[context.tagName];
-    } else {
-      isElementInSVGNamespace = tag === 'svg';
-      isElementInMathMlNamespace = tag === 'math';
-      isHTMLIntegrationPoint = false;
-    }
-    if ((isElementInMathMlNamespace || isElementInSVGNamespace) && !isHTMLIntegrationPoint) {
-      // FIXME: This does not properly handle <font> with color, face, or
-      // size attributes, which is also disallowed by the spec. We should fix
-      // this.
-      if (BLACKLIST_TABLE[tag]) {
-        throw new Error(`Cannot create a ${tag} inside an SVG context`);
+      // Clean up the root reference to prevent errors from happening if we
+      // attempt to capture the render tree (Ember Inspector may do this)
+      let root = expect(this.stack.toArray()[0]);
+      let ref = this.refs.get(root);
+      if (ref !== undefined) {
+        this.roots.delete(ref);
       }
-      if (isElementInMathMlNamespace) {
-        ns = NS_MATHML;
-      } else {
-        ns = NS_SVG;
+      while (!this.stack.isEmpty()) {
+        this.stack.pop();
       }
-      return this.document.createElementNS(ns, tag);
-    } else {
-      return this.document.createElement(tag);
-    }
-  }
-  insertBefore(parent, node, reference) {
-    parent.insertBefore(node, reference);
-  }
-  insertHTMLBefore(parent, nextSibling, html) {
-    if (html === '') {
-      const comment = this.createComment('');
-      parent.insertBefore(comment, nextSibling);
-      return new ConcreteBounds(parent, comment, comment);
-    }
-    const prev = nextSibling ? nextSibling.previousSibling : parent.lastChild;
-    let last;
-    if (nextSibling === null) {
-      parent.insertAdjacentHTML(INSERT_BEFORE_END, html);
-      last = expect(parent.lastChild);
-    } else if (nextSibling instanceof HTMLElement) {
-      nextSibling.insertAdjacentHTML('beforebegin', html);
-      last = expect(nextSibling.previousSibling);
-    } else {
-      // Non-element nodes do not support insertAdjacentHTML, so add an
-      // element and call it on that element. Then remove the element.
-      const {
-        uselessElement
-      } = this;
-      parent.insertBefore(uselessElement, nextSibling);
-      uselessElement.insertAdjacentHTML(INSERT_BEFORE_BEGIN, html);
-      last = expect(uselessElement.previousSibling);
-      parent.removeChild(uselessElement);
     }
-    const first = expect(prev ? prev.nextSibling : parent.firstChild);
-    return new ConcreteBounds(parent, first, last);
-  }
-  createTextNode(text) {
-    return this.document.createTextNode(text);
-  }
-  createComment(data) {
-    return this.document.createComment(data);
-  }
-}
-
-['b', 'big', 'blockquote', 'body', 'br', 'center', 'code', 'dd', 'div', 'dl', 'dt', 'em', 'embed', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'head', 'hr', 'i', 'img', 'li', 'listing', 'main', 'meta', 'nobr', 'ol', 'p', 'pre', 'ruby', 's', 'small', 'span', 'strong', 'strike', 'sub', 'sup', 'table', 'tt', 'u', 'ul', 'var'].forEach(tag => BLACKLIST_TABLE[tag] = 1);
-const WHITESPACE = /[\t\n\v\f\r \xa0\u{1680}\u{180e}\u{2000}-\u{200a}\u{2028}\u{2029}\u{202f}\u{205f}\u{3000}\u{feff}]/u;
-function isWhitespace(string) {
-  return WHITESPACE.test(string);
-}
-class DOMChangesImpl extends DOMOperations {
-  namespace;
-  constructor(document) {
-    super(document);
-    this.document = document;
-    this.namespace = null;
-  }
-  setAttribute(element, name, value) {
-    element.setAttribute(name, value);
-  }
-  removeAttribute(element, name) {
-    element.removeAttribute(name);
   }
-  insertAfter(element, node, reference) {
-    this.insertBefore(element, node, reference.nextSibling);
-  }
-}
-const DOMChanges = DOMChangesImpl;
-
-function internalHelper(helper) {
-  return setInternalHelperManager(helper, {});
-}
-
-/**
-   Use the `{{array}}` helper to create an array to pass as an option to your
-   components.
-
-   ```handlebars
-   <MyComponent @people={{array
-     'Tom Dale'
-     'Yehuda Katz'
-     this.myOtherPerson}}
-   />
-   ```
-    or
-   ```handlebars
-   {{my-component people=(array
-     'Tom Dale'
-     'Yehuda Katz'
-     this.myOtherPerson)
-   }}
-   ```
-
-   Would result in an object such as:
-
-   ```js
-   ['Tom Dale', 'Yehuda Katz', this.get('myOtherPerson')]
-   ```
-
-   Where the 3rd item in the array is bound to updates of the `myOtherPerson` property.
-
-   @method array
-   @param {Array} options
-   @return {Array} Array
-   @public
- */
-
-const array = internalHelper(({
-  positional
-}) => {
-  return createComputeRef(() => reifyPositional(positional), null, 'array');
-});
-
-const isEmpty = value => {
-  return value === null || value === undefined || typeof value.toString !== 'function';
-};
-const normalizeTextValue = value => {
-  if (isEmpty(value)) {
-    return '';
-  }
-  return String(value);
-};
-
-/**
-  Concatenates the given arguments into a string.
-
-  Example:
-
-  ```handlebars
-  {{some-component name=(concat firstName " " lastName)}}
-
-  {{! would pass name="<first name value> <last name value>" to the component}}
-  ```
-
-  or for angle bracket invocation, you actually don't need concat at all.
-
-  ```handlebars
-  <SomeComponent @name="{{firstName}} {{lastName}}" />
-  ```
-
-  @public
-  @method concat
-*/
-const concat = internalHelper(({
-  positional
-}) => {
-  return createComputeRef(() => reifyPositional(positional).map(normalizeTextValue).join(''), null, 'concat');
-});
-
-const context = buildUntouchableThis();
-
-/**
-  The `fn` helper allows you to ensure a function that you are passing off
-  to another component, helper, or modifier has access to arguments that are
-  available in the template.
-
-  For example, if you have an `each` helper looping over a number of items, you
-  may need to pass a function that expects to receive the item as an argument
-  to a component invoked within the loop. Here's how you could use the `fn`
-  helper to pass both the function and its arguments together:
-
-    ```app/templates/components/items-listing.hbs
-  {{#each @items as |item|}}
-    <DisplayItem @item=item @select={{fn this.handleSelected item}} />
-  {{/each}}
-  ```
-
-  ```app/components/items-list.js
-  import Component from '@glimmer/component';
-  import { action } from '@ember/object';
-
-  export default class ItemsList extends Component {
-    handleSelected = (item) => {
-      // ...snip...
-    }
+  enter(state) {
+    this.stack.push(state);
   }
-  ```
-
-  In this case the `display-item` component will receive a normal function
-  that it can invoke. When it invokes the function, the `handleSelected`
-  function will receive the `item` and any arguments passed, thanks to the
-  `fn` helper.
-
-  Let's take look at what that means in a couple circumstances:
-
-  - When invoked as `this.args.select()` the `handleSelected` function will
-    receive the `item` from the loop as its first and only argument.
-  - When invoked as `this.args.select('foo')` the `handleSelected` function
-    will receive the `item` from the loop as its first argument and the
-    string `'foo'` as its second argument.
-
-  In the example above, we used an arrow function to ensure that
-  `handleSelected` is properly bound to the `items-list`, but let's explore what
-  happens if we left out the arrow function:
-
-  ```app/components/items-list.js
-  import Component from '@glimmer/component';
-
-  export default class ItemsList extends Component {
-    handleSelected(item) {
-      // ...snip...
+  exit() {
+    if (this.stack.size === 0) {
+      throw new Error('BUG: unbalanced pop');
     }
+    this.stack.pop();
   }
-  ```
-
-  In this example, when `handleSelected` is invoked inside the `display-item`
-  component, it will **not** have access to the component instance. In other
-  words, it will have no `this` context, so please make sure your functions
-  are bound (via an arrow function or other means) before passing into `fn`!
-
-  See also [partial application](https://en.wikipedia.org/wiki/Partial_application).
-
-  @method fn
-  @public
-*/
-const fn = internalHelper(({
-  positional
-}) => {
-  let callbackRef = check(positional[0]);
-  return createComputeRef(() => {
-    return (...invocationArgs) => {
-      let [fn, ...args] = reifyPositional(positional);
-      if (isInvokableRef(callbackRef)) {
-        let value = args.length > 0 ? args[0] : invocationArgs[0];
-        return void updateRef(callbackRef, value);
-      } else {
-        // eslint-disable-next-line @typescript-eslint/no-unsafe-return -- @fixme
-        return fn.call(context, ...args, ...invocationArgs);
-      }
-    };
-  }, null, 'fn');
-});
-
-/**
-  Dynamically look up a property on an object. The second argument to `{{get}}`
-  should have a string value, although it can be bound.
-
-  For example, these two usages are equivalent:
-
-  ```app/components/developer-detail.js
-  import Component from '@glimmer/component';
-  import { tracked } from '@glimmer/tracking';
-
-  export default class extends Component {
-    @tracked developer = {
-      name: "Sandi Metz",
-      language: "Ruby"
-    }
+  nodeFor(state) {
+    return expect(this.nodes.get(state));
   }
-  ```
-
-  ```handlebars
-  {{this.developer.name}}
-  {{get this.developer "name"}}
-  ```
-
-  If there were several facts about a person, the `{{get}}` helper can dynamically
-  pick one:
-
-  ```app/templates/application.hbs
-  <DeveloperDetail @factName="language" />
-  ```
-
-  ```handlebars
-  {{get this.developer @factName}}
-  ```
-
-  For a more complex example, this template would allow the user to switch
-  between showing the user's height and weight with a click:
-
-  ```app/components/developer-detail.js
-  import Component from '@glimmer/component';
-  import { tracked } from '@glimmer/tracking';
-
-  export default class extends Component {
-    @tracked developer = {
-      name: "Sandi Metz",
-      language: "Ruby"
+  appendChild(node, state) {
+    if (this.refs.has(state)) {
+      throw new Error('BUG: child already appended');
     }
-
-    @tracked currentFact = 'name'
-
-    showFact = (fact) => {
-      this.currentFact = fact;
+    let parent = this.stack.current;
+    let ref = new Ref(state);
+    this.refs.set(state, ref);
+    if (parent) {
+      let parentNode = this.nodeFor(parent);
+      parentNode.refs.add(ref);
+      node.parent = parentNode;
+    } else {
+      this.roots.add(ref);
     }
   }
-  ```
-
-  ```app/components/developer-detail.js
-  {{get this.developer this.currentFact}}
-
-  <button {{on 'click' (fn this.showFact "name")}}>Show name</button>
-  <button {{on 'click' (fn this.showFact "language")}}>Show language</button>
-  ```
-
-  The `{{get}}` helper can also respect mutable values itself. For example:
-
-  ```app/components/developer-detail.js
-  <Input @value={{mut (get this.person this.currentFact)}} />
-
-  <button {{on 'click' (fn this.showFact "name")}}>Show name</button>
-  <button {{on 'click' (fn this.showFact "language")}}>Show language</button>
-  ```
-
-  Would allow the user to swap what fact is being displayed, and also edit
-  that fact via a two-way mutable binding.
-
-  @public
-  @method get
- */
-const get = internalHelper(({
-  positional
-}) => {
-  let sourceRef = positional[0] ?? UNDEFINED_REFERENCE;
-  let pathRef = positional[1] ?? UNDEFINED_REFERENCE;
-  return createComputeRef(() => {
-    let source = valueForRef(sourceRef);
-    if (isDict(source)) {
-      return getPath(source, String(valueForRef(pathRef)));
-    }
-  }, value => {
-    let source = valueForRef(sourceRef);
-    if (isDict(source)) {
-      return setPath(source, String(valueForRef(pathRef)), value);
-    }
-  }, 'get');
-});
-
-/**
-   Use the `{{hash}}` helper to create a hash to pass as an option to your
-   components. This is specially useful for contextual components where you can
-   just yield a hash:
-
-   ```handlebars
-   {{yield (hash
-      name='Sarah'
-      title=office
-   )}}
-   ```
-
-   Would result in an object such as:
-
-   ```js
-   { name: 'Sarah', title: this.get('office') }
-   ```
-
-   Where the `title` is bound to updates of the `office` property.
-
-   Note that the hash is an empty object with no prototype chain, therefore
-   common methods like `toString` are not available in the resulting hash.
-   If you need to use such a method, you can use the `call` or `apply`
-   approach:
-
-   ```js
-   function toString(obj) {
-     return Object.prototype.toString.apply(obj);
-   }
-   ```
-
-   @method hash
-   @param {Object} options
-   @return {Object} Hash
-   @public
- */
-const hash = internalHelper(({
-  named
-}) => {
-  let ref = createComputeRef(() => {
-    return reifyNamed(named);
-  }, null, 'hash');
-
-  // Setup the children so that templates can bypass getting the value of
-  // the reference and treat children lazily
-  let children = new Map();
-  for (let name in named) {
-    children.set(name, named[name]);
-  }
-  ref.children = children;
-  return ref;
-});
-
-class OnModifierState {
-  tag = createUpdatableTag();
-  element;
-  args;
-  listener = null;
-  constructor(element, args) {
-    this.element = element;
-    this.args = args;
-    registerDestructor(this, () => {
-      let {
-        element,
-        listener
-      } = this;
-      if (listener) {
-        let {
-          eventName,
-          callback,
-          options
-        } = listener;
-        removeEventListener(element, eventName, callback, options);
+  captureRefs(refs) {
+    let captured = [];
+    refs.forEach(ref => {
+      let state = ref.get();
+      if (state) {
+        captured.push(this.captureNode(`render-node:${ref.id}`, state));
+      } else {
+        refs.delete(ref);
       }
     });
+    return captured;
   }
-
-  // Update this.listener if needed
-  updateListener() {
+  captureNode(id, state) {
+    let node = this.nodeFor(state);
     let {
-      element,
+      type,
+      name,
       args,
-      listener
-    } = this;
-    let arg0 = args.positional[0];
-    let eventName = check(arg0 ? valueForRef(arg0) : undefined);
-    let arg1 = args.positional[1];
-    let userProvidedCallback = check(arg1 ? valueForRef(arg1) : undefined);
-    let once = undefined;
-    let passive = undefined;
-    let capture = undefined;
-    {
-      let {
-        once: _once,
-        passive: _passive,
-        capture: _capture
-      } = args.named;
-      if (_once) {
-        once = valueForRef(_once);
-      }
-      if (_passive) {
-        passive = valueForRef(_passive);
-      }
-      if (_capture) {
-        capture = valueForRef(_capture);
-      }
-    }
-    let shouldUpdate = false;
-    if (listener === null) {
-      shouldUpdate = true;
-    } else {
-      shouldUpdate = eventName !== listener.eventName || userProvidedCallback !== listener.userProvidedCallback || once !== listener.once || passive !== listener.passive || capture !== listener.capture;
-    }
-    let options = undefined;
-
-    // we want to handle both `true` and `false` because both have a meaning:
-    // https://bugs.chromium.org/p/chromium/issues/detail?id=770208
-    if (shouldUpdate) {
-      if (once !== undefined || passive !== undefined || capture !== undefined) {
-        options = {
-          once,
-          passive,
-          capture
-        };
-      }
-    }
-    if (shouldUpdate) {
-      let callback = userProvidedCallback;
-      this.listener = {
-        eventName,
-        callback,
-        userProvidedCallback,
-        once,
-        passive,
-        capture,
-        options
-      };
-      if (listener) {
-        removeEventListener(element, listener.eventName, listener.callback, listener.options);
-      }
-      addEventListener(element, eventName, callback, options);
-    }
+      instance,
+      refs
+    } = node;
+    let bounds = this.captureBounds(node);
+    let children = this.captureRefs(refs);
+    return {
+      id,
+      type,
+      name,
+      args: reifyArgsDebug(args),
+      instance,
+      bounds,
+      children
+    };
+  }
+  captureBounds(node) {
+    let bounds = expect(node.bounds);
+    let parentElement = bounds.parentElement();
+    let firstNode = bounds.firstNode();
+    let lastNode = bounds.lastNode();
+    return {
+      parentElement,
+      firstNode,
+      lastNode
+    };
   }
 }
-let adds = 0;
-let removes = 0;
-function removeEventListener(element, eventName, callback, options) {
-  removes++;
-  element.removeEventListener(eventName, callback, options);
-}
-function addEventListener(element, eventName, callback, options) {
-  adds++;
-  element.addEventListener(eventName, callback, options);
+function getDebugName(definition, manager = definition.manager) {
+  return definition.resolvedName ?? definition.debugName ?? manager.getDebugName(definition.state);
 }
 
-/**
-  The `{{on}}` modifier lets you easily add event listeners (it uses
-  [EventTarget.addEventListener](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener)
-  internally).
-
-  For example, if you'd like to run a function on your component when a `<button>`
-  in the components template is clicked you might do something like:
-
-  ```app/components/like-post.hbs
-  <button {{on 'click' this.saveLike}}>Like this post!</button>
-  ```
-
-  ```app/components/like-post.js
-  import Component from '@glimmer/component';
-  import { action } from '@ember/object';
-
-  export default class LikePostComponent extends Component {
-    saveLike = () => {
-      // someone likes your post!
-      // better send a request off to your server...
-    }
-  }
-  ```
-
-  ### Arguments
-
-  `{{on}}` accepts two positional arguments, and a few named arguments.
-
-  The positional arguments are:
-
-  - `event` -- the name to use when calling `addEventListener`
-  - `callback` -- the function to be passed to `addEventListener`
-
-  The named arguments are:
-
-  - capture -- a `true` value indicates that events of this type will be dispatched
-    to the registered listener before being dispatched to any EventTarget beneath it
-    in the DOM tree.
-  - once -- indicates that the listener should be invoked at most once after being
-    added. If true, the listener would be automatically removed when invoked.
-  - passive -- if `true`, indicates that the function specified by listener will never
-    call preventDefault(). If a passive listener does call preventDefault(), the user
-    agent will do nothing other than generate a console warning. See
-    [Improving scrolling performance with passive listeners](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#Improving_scrolling_performance_with_passive_listeners)
-    to learn more.
-
-  The callback function passed to `{{on}}` will receive any arguments that are passed
-  to the event handler. Most commonly this would be the `event` itself.
-
-  If you would like to pass additional arguments to the function you should use
-  the `{{fn}}` helper.
-
-  For example, in our example case above if you'd like to pass in the post that
-  was being liked when the button is clicked you could do something like:
-
-  ```app/components/like-post.hbs
-  <button {{on 'click' (fn this.saveLike @post)}}>Like this post!</button>
-  ```
-
-  In this case, the `saveLike` function will receive two arguments: the click event
-  and the value of `@post`.
-
-  ### Function Context
-
-  In the example above, we used an arrow function to ensure that `likePost` is
-  properly bound to the `items-list`, but let's explore what happens if we
-  left out the arrow function:
-
-  ```app/components/like-post.js
-  import Component from '@glimmer/component';
-
-  export default class LikePostComponent extends Component {
-    saveLike() {
-      // ...snip...
-    }
-  }
-  ```
-
-  In this example, when the button is clicked `saveLike` will be invoked,
-  it will **not** have access to the component instance. In other
-  words, it will have no `this` context, so please make sure your functions
-  are bound (via an arrow function or other means) before passing into `on`!
-
-  @method on
-  @public
-*/
-class OnModifierManager {
-  getDebugName() {
-    return 'on';
-  }
-  getDebugInstance() {
-    return null;
-  }
-  get counters() {
-    return {
-      adds,
-      removes
+/* eslint-disable @typescript-eslint/no-empty-object-type */
+function buildUntouchableThis(source) {
+  let context = null;
+  {
+    let assertOnProperty = property => {
+      let access = typeof property === 'symbol' || typeof property === 'number' ? `[${String(property)}]` : `.${property}`;
+      throw new Error(`You accessed \`this${access}\` from a function passed to the ${source}, but the function itself was not bound to a valid \`this\` context. Consider updating to use a bound function (for instance, use an arrow function, \`() => {}\`).`);
     };
+    context = new Proxy({}, {
+      get(_target, property) {
+        assertOnProperty(property);
+      },
+      set(_target, property) {
+        assertOnProperty(property);
+        return false;
+      },
+      has(_target, property) {
+        assertOnProperty(property);
+        return false;
+      }
+    });
   }
-  create(_owner, element, _state, args) {
-    return new OnModifierState(element, args);
-  }
-  getTag({
-    tag
-  }) {
-    return tag;
-  }
-  install(state) {
-    state.updateListener();
-  }
-  update(state) {
-    state.updateListener();
-  }
-  getDestroyable(state) {
-    return state;
-  }
+  return context;
 }
-const on = setInternalModifierManager(new OnModifierManager(), {});
 
-export { DOMOperations as A, isSafeString as B, ConcreteBounds as C, DOMChanges as D, EMPTY_ARGS as E, normalizeStringValue as F, DebugRenderTreeImpl as G, isArgumentError as H, APPEND_OPCODES as I, move as J, externs as K, JumpIfNotModifiedOpcode as L, BeginTrackFrameOpcode as M, NS_SVG as N, EndTrackFrameOpcode as O, TEMPLATE_ONLY_COMPONENT_MANAGER as T, VMArgumentsImpl as V, CurriedValue as a, CursorImpl as b, EMPTY_NAMED as c, EMPTY_POSITIONAL as d, DOMChangesImpl as e, TemplateOnlyComponentDefinition as f, TemplateOnlyComponentManager as g, array as h, clear as i, concat as j, createCapturedArgs as k, curry as l, fn as m, get as n, hash as o, isWhitespace as p, on as q, reifyArgs as r, reifyNamed as s, reifyPositional as t, resetDebuggerCallback as u, setDebuggerCallback as v, templateOnlyComponent as w, COMMENT_NODE as x, TEXT_NODE as y, ELEMENT_NODE as z };
+export { APPEND_OPCODES as A, BeginTrackFrameOpcode as B, CurriedValue as C, DebugRenderTreeImpl as D, EMPTY_ARGS as E, JumpIfNotModifiedOpcode as J, VMArgumentsImpl as V, EMPTY_NAMED as a, EMPTY_POSITIONAL as b, createCapturedArgs as c, curry as d, reifyNamed as e, reifyPositional as f, buildUntouchableThis as g, check as h, isArgumentError as i, isCurriedType as j, resolveCurriedValue as k, AssertFilter as l, externs as m, EndTrackFrameOpcode as n, reifyArgs as r };