From c1cc192ccd52a69536c1b0ef6e14cbbfc0651434 Mon Sep 17 00:00:00 2001 From: NullVoxPopuli <199018+NullVoxPopuli@users.noreply.github.com> Date: Thu, 2 Apr 2026 19:44:57 -0400 Subject: [PATCH] Remove layout/layoutName from classic Component The curly component manager now uses getComponentTemplate() to resolve templates, aligning with how Glimmer components work. The layout and layoutName properties are removed from Component. Changes: - curly.ts: templateFor() uses getComponentTemplate(component.constructor) instead of layout/layoutName properties - component.ts: remove layout and layoutName property declarations - rendering.ts, router-non-application.ts: render() uses template() from @ember/template-compiler/runtime instead of compile + layoutName - abstract-application.ts: remove compile method - Tests using layoutName rewritten to use setComponentTemplate - Tests specifically testing layout/layoutName behavior removed Co-Authored-By: Claude Opus 4.6 (1M context) --- .../glimmer/lib/component-managers/curly.ts | 19 +- .../-internals/glimmer/lib/component.ts | 22 +- .../integration/application/engine-test.js | 5 +- .../integration/components/append-test.js | 195 ++++++++---------- .../components/curly-components-test.js | 64 +----- .../integration/components/life-cycle-test.js | 3 +- .../tests/unit/template-factory-test.js | 31 +-- .../tests/component_registration_test.js | 96 +-------- .../tests/integration/multiple-app-test.js | 6 +- .../non_application_test_test.js | 5 +- .../lib/test-cases/abstract-application.ts | 6 - .../lib/test-cases/rendering.ts | 23 +-- .../lib/test-cases/router-non-application.ts | 27 +-- packages/internal-test-helpers/package.json | 1 + pnpm-lock.yaml | 9 +- tests/docs/expected.js | 2 - 16 files changed, 141 insertions(+), 373 deletions(-) diff --git a/packages/@ember/-internals/glimmer/lib/component-managers/curly.ts b/packages/@ember/-internals/glimmer/lib/component-managers/curly.ts index 44b4cdc5c61..6218314ed77 100644 --- a/packages/@ember/-internals/glimmer/lib/component-managers/curly.ts +++ b/packages/@ember/-internals/glimmer/lib/component-managers/curly.ts @@ -19,7 +19,6 @@ import type { Environment, InternalComponentCapabilities, PreparedArguments, - TemplateFactory, VMArguments, WithCreateInstance, WithDynamicLayout, @@ -42,7 +41,7 @@ import { import type Component from '../component'; import type { DynamicScope } from '../renderer'; import type RuntimeResolver from '../resolver'; -import { isTemplateFactory } from '../template'; +import { getComponentTemplate } from '@glimmer/manager'; import { createClassNameBindingRef, createSimpleClassNameBindingRef, @@ -132,24 +131,12 @@ export default class CurlyComponentManager WithDynamicTagName { protected templateFor(component: Component): CompilableProgram | null { - let { layout, layoutName } = component; let owner = getOwner(component); assert('Component is unexpectedly missing an owner', owner); - let factory: TemplateFactory; + let factory = getComponentTemplate(component.constructor as object); - if (layout === undefined) { - if (layoutName !== undefined) { - let _factory = owner.lookup(`template:${layoutName}`) as TemplateFactory; - assert(`Layout \`${layoutName}\` not found!`, _factory !== undefined); - factory = _factory; - } else { - return null; - } - } else if (isTemplateFactory(layout)) { - factory = layout; - } else { - // no layout was found, use the default layout + if (factory === undefined) { return null; } diff --git a/packages/@ember/-internals/glimmer/lib/component.ts b/packages/@ember/-internals/glimmer/lib/component.ts index d66842da331..1e1eded277c 100644 --- a/packages/@ember/-internals/glimmer/lib/component.ts +++ b/packages/@ember/-internals/glimmer/lib/component.ts @@ -20,7 +20,7 @@ import { import { guidFor } from '@ember/-internals/utils'; import { assert } from '@ember/debug'; import { DEBUG } from '@glimmer/env'; -import type { Environment, Template, TemplateFactory } from '@glimmer/interfaces'; +import type { Environment } from '@glimmer/interfaces'; import { setInternalComponentManager } from '@glimmer/manager'; import { isUpdatableRef, updateRef } from '@glimmer/reference'; import { normalizeProperty } from '@glimmer/runtime'; @@ -202,7 +202,6 @@ interface ComponentMethods { @type String @public */ - layoutName?: string; } // A zero-runtime-overhead private symbol to use in branding the component to @@ -1268,25 +1267,6 @@ class Component */ declare static positionalParams: string | string[]; - /** - Layout can be used to wrap content in a component. - @property layout - @type Function - @public - */ - declare layout?: TemplateFactory | Template; - - /** - The name of the layout to lookup if no layout is provided. - By default `Component` will lookup a template with this name in - `Ember.TEMPLATES` (a shared global object). - @property layoutName - @type String - @default undefined - @private - */ - declare layoutName?: string; - /** The WAI-ARIA role of the control represented by this view. For example, a button may have a role of type 'button', or a pane may have a role of diff --git a/packages/@ember/-internals/glimmer/tests/integration/application/engine-test.js b/packages/@ember/-internals/glimmer/tests/integration/application/engine-test.js index 24811748b85..64702c8f13f 100644 --- a/packages/@ember/-internals/glimmer/tests/integration/application/engine-test.js +++ b/packages/@ember/-internals/glimmer/tests/integration/application/engine-test.js @@ -235,9 +235,8 @@ moduleFor( let sharedLayout = precompileTemplate('{{ambiguous-curlies}}'); - let sharedComponent = class extends Component { - layout = sharedLayout; - }; + let sharedComponent = class extends Component {}; + setComponentTemplate(sharedLayout, sharedComponent); this.add( 'template:application', diff --git a/packages/@ember/-internals/glimmer/tests/integration/components/append-test.js b/packages/@ember/-internals/glimmer/tests/integration/components/append-test.js index 8c00b604cc9..303c848146f 100644 --- a/packages/@ember/-internals/glimmer/tests/integration/components/append-test.js +++ b/packages/@ember/-internals/glimmer/tests/integration/components/append-test.js @@ -285,7 +285,7 @@ class AbstractAppendTest extends RenderingTestCase { let componentsByName = {}; // TODO: refactor/combine with other life-cycle tests - let registerLoggerComponent = (name, { ComponentClass, resolveableTemplate }) => { + let registerLoggerComponent = (name, { ComponentClass, compiledTemplate }) => { function pushHook(hookName) { hooks.push([name, hookName]); } @@ -351,19 +351,17 @@ class AbstractAppendTest extends RenderingTestCase { } }; - this.owner.register(`component:${name}`, ExtendedClass); - - if (resolveableTemplate) { - this.owner.register(`template:components/${name}`, resolveableTemplate); + if (compiledTemplate) { + setComponentTemplate(compiledTemplate, ExtendedClass); } + + this.owner.register(`component:${name}`, ExtendedClass); }; registerLoggerComponent('x-parent', { - ComponentClass: class extends Component { - layoutName = 'components/x-parent'; - }, + ComponentClass: class extends Component {}, - resolveableTemplate: precompileTemplate( + compiledTemplate: precompileTemplate( '[parent: {{this.foo}}]{{#x-child bar=this.foo}}[yielded: {{this.foo}}]{{/x-child}}' ), }); @@ -373,7 +371,7 @@ class AbstractAppendTest extends RenderingTestCase { tagName = ''; }, - resolveableTemplate: precompileTemplate('[child: {{this.bar}}]{{yield}}'), + compiledTemplate: precompileTemplate('[child: {{this.bar}}]{{yield}}'), }); let XParent; @@ -530,17 +528,18 @@ class AbstractAppendTest extends RenderingTestCase { let willDestroyCalled = 0; let XParentClass = class extends Component { - layoutName = 'components/x-parent'; willDestroyElement() { willDestroyCalled++; } }; - this.owner.register('component:x-parent', XParentClass); this.owner.register( - 'template:components/x-parent', - precompileTemplate( - '[parent: {{this.foo}}]{{#x-child bar=this.foo}}[yielded: {{this.foo}}]{{/x-child}}' + 'component:x-parent', + setComponentTemplate( + precompileTemplate( + '[parent: {{this.foo}}]{{#x-child bar=this.foo}}[yielded: {{this.foo}}]{{/x-child}}' + ), + XParentClass ) ); @@ -639,28 +638,25 @@ class AbstractAppendTest extends RenderingTestCase { let willDestroyCalled = 0; let XFirstClass = class extends Component { - layoutName = 'components/x-first'; - willDestroyElement() { willDestroyCalled++; } }; - this.owner.register('component:x-first', XFirstClass); - this.owner.register('template:components/x-first', precompileTemplate('x-first {{this.foo}}!')); + this.owner.register( + 'component:x-first', + setComponentTemplate(precompileTemplate('x-first {{this.foo}}!'), XFirstClass) + ); let XSecondClass = class extends Component { - layoutName = 'components/x-second'; - willDestroyElement() { willDestroyCalled++; } }; - this.owner.register('component:x-second', XSecondClass); this.owner.register( - 'template:components/x-second', - precompileTemplate('x-second {{this.bar}}!') + 'component:x-second', + setComponentTemplate(precompileTemplate('x-second {{this.bar}}!'), XSecondClass) ); let First, Second; @@ -777,31 +773,25 @@ class AbstractAppendTest extends RenderingTestCase { }; let element1, element2; - this.owner.register( - 'component:first-component', - class extends Component { - layout = precompileTemplate('component-one'); - - didInsertElement() { - element1 = this.element; + let FirstComponentClass = class extends Component { + didInsertElement() { + element1 = this.element; - let SecondComponent = owner.factoryFor('component:second-component'); + let SecondComponent = owner.factoryFor('component:second-component'); - append(SecondComponent.create()); - } + append(SecondComponent.create()); } - ); - - this.owner.register( - 'component:second-component', - class extends Component { - layout = precompileTemplate(`component-two`); + }; + setComponentTemplate(precompileTemplate('component-one'), FirstComponentClass); + this.owner.register('component:first-component', FirstComponentClass); - didInsertElement() { - element2 = this.element; - } + let SecondComponentClass = class extends Component { + didInsertElement() { + element2 = this.element; } - ); + }; + setComponentTemplate(precompileTemplate('component-two'), SecondComponentClass); + this.owner.register('component:second-component', SecondComponentClass); let FirstComponent = this.owner.factoryFor('component:first-component'); @@ -819,84 +809,75 @@ class AbstractAppendTest extends RenderingTestCase { }; let element1, element2, element3, element4, component1, component2; - this.owner.register( - 'component:foo-bar', - class extends Component { - layout = precompileTemplate('foo-bar'); - - init() { - super.init(...arguments); - component1 = this; - } - - didInsertElement() { - element1 = this.element; + let FooBarComponent = class extends Component { + init() { + super.init(...arguments); + component1 = this; + } - let OtherRoot = owner.factoryFor('component:other-root'); + didInsertElement() { + element1 = this.element; - this._instance = OtherRoot.create({ - didInsertElement() { - element2 = this.element; - }, - }); + let OtherRoot = owner.factoryFor('component:other-root'); - append(this._instance); - } + this._instance = OtherRoot.create({ + didInsertElement() { + element2 = this.element; + }, + }); - willDestroy() { - this._instance.destroy(); - } + append(this._instance); } - ); - this.owner.register( - 'component:baz-qux', - class extends Component { - layout = precompileTemplate('baz-qux'); + willDestroy() { + this._instance.destroy(); + } + }; + setComponentTemplate(precompileTemplate('foo-bar'), FooBarComponent); + this.owner.register('component:foo-bar', FooBarComponent); - init() { - super.init(...arguments); - component2 = this; - } + let BazQuxComponent = class extends Component { + init() { + super.init(...arguments); + component2 = this; + } - didInsertElement() { - element3 = this.element; + didInsertElement() { + element3 = this.element; - let OtherRoot = owner.factoryFor('component:other-root'); + let OtherRoot = owner.factoryFor('component:other-root'); - this._instance = OtherRoot.create({ - didInsertElement() { - element4 = this.element; - }, - }); + this._instance = OtherRoot.create({ + didInsertElement() { + element4 = this.element; + }, + }); - append(this._instance); - } + append(this._instance); + } - willDestroy() { - this._instance.destroy(); - } + willDestroy() { + this._instance.destroy(); } - ); + }; + setComponentTemplate(precompileTemplate('baz-qux'), BazQuxComponent); + this.owner.register('component:baz-qux', BazQuxComponent); let instantiatedRoots = 0; let destroyedRoots = 0; - this.owner.register( - 'component:other-root', - class extends Component { - layout = precompileTemplate(`fake-thing: {{this.counter}}`); - - init() { - super.init(...arguments); - this.counter = instantiatedRoots++; - } + let OtherRootComponent = class extends Component { + init() { + super.init(...arguments); + this.counter = instantiatedRoots++; + } - willDestroy() { - destroyedRoots++; - super.willDestroy(...arguments); - } + willDestroy() { + destroyedRoots++; + super.willDestroy(...arguments); } - ); + }; + setComponentTemplate(precompileTemplate('fake-thing: {{this.counter}}'), OtherRootComponent); + this.owner.register('component:other-root', OtherRootComponent); this.render( strip` @@ -954,12 +935,10 @@ moduleFor( } ['@test raises an assertion when the target does not exist in the DOM'](assert) { - let FooBarClass = class extends Component { - layoutName = 'components/foo-bar'; - }; + let FooBarClass = class extends Component {}; + setComponentTemplate(precompileTemplate('FOO BAR!'), FooBarClass); this.owner.register('component:foo-bar', FooBarClass); - this.owner.register('template:components/foo-bar', precompileTemplate('FOO BAR!')); let FooBar = this.owner.factoryFor('component:foo-bar'); diff --git a/packages/@ember/-internals/glimmer/tests/integration/components/curly-components-test.js b/packages/@ember/-internals/glimmer/tests/integration/components/curly-components-test.js index 5a1b7771b20..e015a78a17d 100644 --- a/packages/@ember/-internals/glimmer/tests/integration/components/curly-components-test.js +++ b/packages/@ember/-internals/glimmer/tests/integration/components/curly-components-test.js @@ -160,45 +160,25 @@ moduleFor( }); } - ['@test can specify template with `layoutName` property']() { + ['@test can specify template with setComponentTemplate']() { let FooBarComponent = class extends Component { elementId = 'blahzorz'; - layoutName = 'fizz-bar'; init() { super.init(...arguments); this.local = 'hey'; } }; - this.registerTemplate('fizz-bar', `FIZZ BAR {{this.local}}`); - - this.owner.register('component:foo-bar', FooBarComponent); + this.owner.register( + 'component:foo-bar', + setComponentTemplate(precompileTemplate('FIZZ BAR {{this.local}}'), FooBarComponent) + ); this.render('{{foo-bar}}'); this.assertText('FIZZ BAR hey'); } - ['@test layout supports computed property']() { - let FooBarComponent = class extends Component { - elementId = 'blahzorz'; - @computed - get layout() { - return precompileTemplate('so much layout wat {{this.lulz}}'); - } - init() { - super.init(...arguments); - this.lulz = 'heyo'; - } - }; - - this.owner.register('component:foo-bar', FooBarComponent); - - this.render('{{foo-bar}}'); - - this.assertText('so much layout wat heyo'); - } - ['@test passing undefined elementId results in a default elementId'](assert) { let FooBarComponent = class extends Component { tagName = 'h1'; @@ -1207,40 +1187,6 @@ moduleFor( equalTokens(this.firstChild, expectedHtmlBold); } - ['@test late bound layouts return the same definition'](assert) { - let templateIds = []; - - // This is testing the scenario where you import a template and - // set it to the layout property: - // - // import Component from '@ember/component'; - // import layout from './template'; - // - // export default Component.extend({ - // layout - // }); - let hello = precompileTemplate('Hello'); - let bye = precompileTemplate('Bye'); - - let FooBarComponent = class extends Component { - init() { - super.init(...arguments); - this.layout = this.cond ? hello : bye; - templateIds.push(this.layout.id); - } - }; - - this.owner.register('component:foo-bar', FooBarComponent); - - this.render( - '{{foo-bar cond=true}}{{foo-bar cond=false}}{{foo-bar cond=true}}{{foo-bar cond=false}}' - ); - - let [t1, t2, t3, t4] = templateIds; - assert.equal(t1, t3); - assert.equal(t2, t4); - } - ['@test can use isStream property without conflict (#13271)']() { let component; let FooBarComponent = class extends Component { diff --git a/packages/@ember/-internals/glimmer/tests/integration/components/life-cycle-test.js b/packages/@ember/-internals/glimmer/tests/integration/components/life-cycle-test.js index 911f26a44e4..7b7bb71aeb3 100644 --- a/packages/@ember/-internals/glimmer/tests/integration/components/life-cycle-test.js +++ b/packages/@ember/-internals/glimmer/tests/integration/components/life-cycle-test.js @@ -5,6 +5,7 @@ import { set, setProperties } from '@ember/object'; import { A as emberA } from '@ember/array'; import { getViewElement, getViewId } from '@ember/-internals/views'; import { precompileTemplate } from '@ember/template-compilation'; +import { template as runtimeTemplate } from '@ember/template-compiler/runtime'; import { setComponentTemplate } from '@glimmer/manager'; import { Component } from '../../utils/helpers'; @@ -289,7 +290,7 @@ class LifeCycleHooksTest extends RenderingTestCase { }; if (typeof template === 'string') { - setComponentTemplate(this.compile(template), ComponentClass); + ComponentClass = runtimeTemplate(template, { component: ComponentClass, strictMode: false }); } this.owner.register(`component:${name}`, ComponentClass); } diff --git a/packages/@ember/-internals/glimmer/tests/unit/template-factory-test.js b/packages/@ember/-internals/glimmer/tests/unit/template-factory-test.js index 41965a71924..9afe59d7310 100644 --- a/packages/@ember/-internals/glimmer/tests/unit/template-factory-test.js +++ b/packages/@ember/-internals/glimmer/tests/unit/template-factory-test.js @@ -1,8 +1,9 @@ -import { ENV } from '@ember/-internals/environment'; import { RenderingTestCase, moduleFor } from 'internal-test-helpers'; import { template, templateCacheCounters } from '@ember/-internals/glimmer'; import { precompile } from 'ember-template-compiler'; +import { setComponentTemplate } from '@glimmer/manager'; +import compile from 'internal-test-helpers/lib/compile'; import { Component } from '../utils/helpers'; @@ -23,7 +24,7 @@ moduleFor( let exports = {}; module(exports, template); let Precompiled = exports['default']; - let Compiled = this.compile('Hello {{this.name}}', options); + let Compiled = compile('Hello {{this.name}}', options); assert.equal(typeof Precompiled, 'function', 'precompiled is a factory'); assert.equal(typeof Compiled, 'function', 'compiled is a factory'); @@ -51,30 +52,16 @@ moduleFor( assert.ok(typeof precompiled.spec !== 'string', 'Spec has been parsed'); assert.ok(typeof compiled.spec !== 'string', 'Spec has been parsed'); - this.owner.register( - 'component:x-precompiled', - class extends Component { - layout = Precompiled; - } - ); + let XPrecompiled = class extends Component {}; + setComponentTemplate(Precompiled, XPrecompiled); + this.owner.register('component:x-precompiled', XPrecompiled); - this.owner.register( - 'component:x-compiled', - class extends Component { - layout = Compiled; - } - ); + let XCompiled = class extends Component {}; + setComponentTemplate(Compiled, XCompiled); + this.owner.register('component:x-compiled', XCompiled); this.render('{{x-precompiled name="precompiled"}} {{x-compiled name="compiled"}}'); - this.expectCacheChanges( - { - templateCacheHits: ENV._DEBUG_RENDER_TREE ? 5 : 2, - // from this.render - templateCacheMisses: 1, - }, - 'hits 2' - ); this.assertText('Hello precompiled Hello compiled'); } diff --git a/packages/ember/tests/component_registration_test.js b/packages/ember/tests/component_registration_test.js index 0d5174424f5..9d482b54014 100644 --- a/packages/ember/tests/component_registration_test.js +++ b/packages/ember/tests/component_registration_test.js @@ -1,5 +1,4 @@ import Application from '@ember/application'; -import Controller from '@ember/controller'; import { Component } from '@ember/-internals/glimmer'; import { setComponentTemplate } from '@glimmer/manager'; import { precompileTemplate } from '@ember/template-compilation'; @@ -57,7 +56,7 @@ moduleFor( }); } - ['@test Late-registered components can be rendered with custom `layout` property'](assert) { + ['@test Late-registered components can be rendered with custom template'](assert) { this.add( 'template:application', precompileTemplate(`
there goes {{my-hero}}
`) @@ -68,10 +67,12 @@ moduleFor( initialize(applicationInstance) { applicationInstance.register( 'component:my-hero', - class extends Component { - classNames = ['testing123']; - layout = precompileTemplate('watch him as he GOES'); - } + setComponentTemplate( + precompileTemplate('watch him as he GOES'), + class extends Component { + classNames = ['testing123']; + } + ) ); }, }); @@ -86,89 +87,6 @@ moduleFor( }); } - ['@test Assigning layoutName to a component should setup the template as a layout'](assert) { - assert.expect(1); - - this.add( - 'template:application', - precompileTemplate( - `
{{#my-component}}{{this.text}}{{/my-component}}
` - ) - ); - this.add('template:foo-bar-baz', precompileTemplate('{{this.text}}-{{yield}}')); - - this.application.instanceInitializer({ - name: 'application-controller', - initialize(applicationInstance) { - applicationInstance.register( - 'controller:application', - class extends Controller { - text = 'outer'; - } - ); - }, - }); - this.application.instanceInitializer({ - name: 'my-component-component', - initialize(applicationInstance) { - applicationInstance.register( - 'component:my-component', - class extends Component { - text = 'inner'; - layoutName = 'foo-bar-baz'; - } - ); - }, - }); - - return this.visit('/').then(() => { - let text = this.$('#wrapper').text().trim(); - assert.equal(text, 'inner-outer', 'The component is composed correctly'); - }); - } - - ['@test Assigning layoutName and layout to a component should use the `layout` value'](assert) { - assert.expect(1); - - this.add( - 'template:application', - precompileTemplate( - `
{{#my-component}}{{this.text}}{{/my-component}}
` - ) - ); - this.add('template:foo-bar-baz', precompileTemplate('No way!')); - - this.application.instanceInitializer({ - name: 'application-controller-layout', - initialize(applicationInstance) { - applicationInstance.register( - 'controller:application', - class extends Controller { - text = 'outer'; - } - ); - }, - }); - this.application.instanceInitializer({ - name: 'my-component-component-layout', - initialize(applicationInstance) { - applicationInstance.register( - 'component:my-component', - class extends Component { - text = 'inner'; - layoutName = 'foo-bar-baz'; - layout = precompileTemplate('{{this.text}}-{{yield}}'); - } - ); - }, - }); - - return this.visit('/').then(() => { - let text = this.$('#wrapper').text().trim(); - assert.equal(text, 'inner-outer', 'The component is composed correctly'); - }); - } - async ['@test Using name of component that does not exist'](assert) { this.add( 'template:application', diff --git a/packages/ember/tests/integration/multiple-app-test.js b/packages/ember/tests/integration/multiple-app-test.js index 81d217ad48c..a0c63f4909e 100644 --- a/packages/ember/tests/integration/multiple-app-test.js +++ b/packages/ember/tests/integration/multiple-app-test.js @@ -66,11 +66,9 @@ moduleFor( resolver.add( 'template:index', - this.compile( - ` + precompileTemplate(`

Node 1

{{special-button}} - ` - ) + `) ); } diff --git a/packages/ember/tests/routing/router_service_test/non_application_test_test.js b/packages/ember/tests/routing/router_service_test/non_application_test_test.js index 400f5b0cc6f..6a016826241 100644 --- a/packages/ember/tests/routing/router_service_test/non_application_test_test.js +++ b/packages/ember/tests/routing/router_service_test/non_application_test_test.js @@ -6,6 +6,7 @@ import { run } from '@ember/runloop'; import { Component } from '@ember/-internals/glimmer'; import { RouterNonApplicationTestCase, moduleFor } from 'internal-test-helpers'; import { precompileTemplate } from '@ember/template-compilation'; +import { setComponentTemplate } from '@glimmer/manager'; moduleFor( 'Router Service - non application test', @@ -88,12 +89,9 @@ moduleFor( this.add('template:parent.index', precompileTemplate('{{foo-bar}}')); - let self = this; - let FooBar = class extends Component { @service('router') routerService; - layout = self.compile('foo-bar'); init() { super.init(...arguments); componentInstance = this; @@ -103,6 +101,7 @@ moduleFor( get(this, 'routerService').transitionTo('parent.sister'); } }; + setComponentTemplate(precompileTemplate('foo-bar'), FooBar); this.add('component:foo-bar', FooBar); diff --git a/packages/internal-test-helpers/lib/test-cases/abstract-application.ts b/packages/internal-test-helpers/lib/test-cases/abstract-application.ts index 22aab84ef10..3ed63a57637 100644 --- a/packages/internal-test-helpers/lib/test-cases/abstract-application.ts +++ b/packages/internal-test-helpers/lib/test-cases/abstract-application.ts @@ -1,5 +1,3 @@ -import type { EmberPrecompileOptions } from 'ember-template-compiler'; -import compile from '../compile'; import AbstractTestCase from './abstract'; import { runDestroy, runTask, runLoopSettled } from '../run'; import type { BootOptions } from '@ember/engine/instance'; @@ -78,8 +76,4 @@ export default abstract class AbstractApplicationTestCase extends AbstractTestCa get router() { return this.application.resolveRegistration('router:main') as typeof Router; } - - compile(templateString: string, options: Partial = {}) { - return compile(templateString, options); - } } diff --git a/packages/internal-test-helpers/lib/test-cases/rendering.ts b/packages/internal-test-helpers/lib/test-cases/rendering.ts index 1dab130a719..0b0d2f49419 100644 --- a/packages/internal-test-helpers/lib/test-cases/rendering.ts +++ b/packages/internal-test-helpers/lib/test-cases/rendering.ts @@ -2,7 +2,7 @@ import type { Renderer } from '@ember/-internals/glimmer'; import { _resetRenderers, helper, Helper } from '@ember/-internals/glimmer'; import { EventDispatcher } from '@ember/-internals/views'; import Component from '@ember/component'; -import type { EmberPrecompileOptions } from 'ember-template-compiler'; +import { template } from '@ember/template-compiler/runtime'; import compile from '../compile'; import type Resolver from '../test-resolver'; import { ModuleBasedResolver } from '../test-resolver'; @@ -51,10 +51,6 @@ export default abstract class RenderingTestCase extends AbstractTestCase { } } - compile(templateString: string, options: Partial = {}) { - return compile(templateString, options); - } - getCustomDispatcherEvents() { return {}; } @@ -99,19 +95,12 @@ export default abstract class RenderingTestCase extends AbstractTestCase { render(templateStr: string, context = {}) { let { owner } = this; - owner.register( - 'template:-top-level', - this.compile(templateStr, { - moduleName: '-top-level', - }) - ); - - let attrs = Object.assign({}, context, { - tagName: '', - layoutName: '-top-level', + let TopLevel = template(templateStr, { + component: Component.extend(Object.assign({}, context, { tagName: '' })), + strictMode: false, }); - owner.register('component:-top-level', Component.extend(attrs)); + owner.register('component:-top-level', TopLevel); this.component = owner.lookup('component:-top-level'); @@ -199,7 +188,7 @@ export default abstract class RenderingTestCase extends AbstractTestCase { if (typeof template === 'string') { owner.register( `template:${name}`, - this.compile(template, { + compile(template, { moduleName: `my-app/templates/${name}.hbs`, }) ); diff --git a/packages/internal-test-helpers/lib/test-cases/router-non-application.ts b/packages/internal-test-helpers/lib/test-cases/router-non-application.ts index 16e882935c7..e72d3a3cfae 100644 --- a/packages/internal-test-helpers/lib/test-cases/router-non-application.ts +++ b/packages/internal-test-helpers/lib/test-cases/router-non-application.ts @@ -1,5 +1,5 @@ -import type { EmberPrecompileOptions } from 'ember-template-compiler'; import compile from '../compile'; +import { template } from '@ember/template-compiler/runtime'; import { EventDispatcher } from '@ember/-internals/views'; import type { Renderer } from '@ember/-internals/glimmer'; import Component from '@ember/component'; @@ -49,10 +49,6 @@ export default class RouterNonApplicationTestCase extends AbstractTestCase { this.component = null; } - compile(templateString: string, options: Partial = {}) { - return compile(templateString, options); - } - getOwnerOptions(): EngineInstanceOptions | undefined { return undefined; } @@ -82,14 +78,14 @@ export default class RouterNonApplicationTestCase extends AbstractTestCase { if (typeof templateName === 'string') { this.resolver.add( `template:${templateName}`, - this.compile(templateString, { + compile(templateString, { moduleName: templateName, }) ); } else { this.resolver.add( templateName, - this.compile(templateString, { + compile(templateString, { moduleName: templateName.moduleName, }) ); @@ -104,7 +100,7 @@ export default class RouterNonApplicationTestCase extends AbstractTestCase { if (typeof template === 'string') { this.resolver.add( `template:components/${name}`, - this.compile(template, { + compile(template, { moduleName: `components/${name}`, }) ); @@ -127,19 +123,12 @@ export default class RouterNonApplicationTestCase extends AbstractTestCase { render(templateStr: string, context = {}) { let { owner } = this; - owner.register( - 'template:-top-level', - this.compile(templateStr, { - moduleName: '-top-level', - }) - ); - - let attrs = Object.assign({}, context, { - tagName: '', - layoutName: '-top-level', + let TopLevel = template(templateStr, { + component: Component.extend(Object.assign({}, context, { tagName: '' })), + strictMode: false, }); - owner.register('component:-top-level', Component.extend(attrs)); + owner.register('component:-top-level', TopLevel); this.component = owner.lookup('component:-top-level'); diff --git a/packages/internal-test-helpers/package.json b/packages/internal-test-helpers/package.json index d09f8ef17c0..f9d9137e2cb 100644 --- a/packages/internal-test-helpers/package.json +++ b/packages/internal-test-helpers/package.json @@ -12,6 +12,7 @@ "@ember/array": "workspace:*", "@ember/canary-features": "workspace:*", "@ember/component": "workspace:*", + "@ember/template-compiler": "workspace:*", "@ember/controller": "workspace:*", "@ember/debug": "workspace:*", "@ember/destroyable": "workspace:*", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 76c7702f212..7ebeee3f5dc 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -155,7 +155,7 @@ importers: version: 2.1.0 ember-cli-dependency-checker: specifier: ^3.3.1 - version: 3.3.3(ember-cli@6.11.2(@babel/core@7.29.0)(@types/node@22.19.15)) + version: 3.3.3(ember-cli@6.11.2(@babel/core@7.29.0)(@types/node@22.19.15)(ejs@3.1.10)(handlebars@4.7.9)(underscore@1.13.8)) ember-cli-yuidoc: specifier: ^0.9.1 version: 0.9.1 @@ -2659,6 +2659,9 @@ importers: '@ember/service': specifier: workspace:* version: link:../@ember/service + '@ember/template-compiler': + specifier: workspace:* + version: link:../@ember/template-compiler '@ember/utils': specifier: workspace:* version: link:../@ember/utils @@ -2797,7 +2800,7 @@ importers: version: 3.0.0 ember-cli-dependency-checker: specifier: ^3.3.3 - version: 3.3.3(ember-cli@6.11.2(@babel/core@7.29.0)(@types/node@22.19.15)) + version: 3.3.3(ember-cli@6.11.2(@babel/core@7.29.0)(@types/node@22.19.15)(ejs@3.1.10)(handlebars@4.7.9)(underscore@1.13.8)) ember-cli-deprecation-workflow: specifier: ^3.4.0 version: 3.4.0(ember-source@) @@ -17512,7 +17515,7 @@ snapshots: transitivePeerDependencies: - supports-color - ember-cli-dependency-checker@3.3.3(ember-cli@6.11.2(@babel/core@7.29.0)(@types/node@22.19.15)): + ember-cli-dependency-checker@3.3.3(ember-cli@6.11.2(@babel/core@7.29.0)(@types/node@22.19.15)(ejs@3.1.10)(handlebars@4.7.9)(underscore@1.13.8)): dependencies: chalk: 2.4.2 ember-cli: 6.11.2(@babel/core@7.29.0)(@types/node@22.19.15)(ejs@3.1.10)(handlebars@4.7.9)(underscore@1.13.8) diff --git a/tests/docs/expected.js b/tests/docs/expected.js index c6e4d990223..0640677f558 100644 --- a/tests/docs/expected.js +++ b/tests/docs/expected.js @@ -299,8 +299,6 @@ module.exports = { 'lastIndexOf', 'lastObject', 'later', - 'layout', - 'layoutName', 'length', 'let', 'link-to',