diff --git a/packages/@ember/-internals/environment/lib/env.ts b/packages/@ember/-internals/environment/lib/env.ts index 64e9c51766d..ae161ca5a39 100644 --- a/packages/@ember/-internals/environment/lib/env.ts +++ b/packages/@ember/-internals/environment/lib/env.ts @@ -66,21 +66,6 @@ export const ENV = { STRUCTURED_PROFILE: false, - /** - Whether to use Glimmer Component semantics (as opposed to the classic "Curly" - components semantics) for template-only components. See RFC #278. - - This is not intended to be set directly, as the implementation may change in - the future. Use `@ember/optional-features` instead. - - @property _TEMPLATE_ONLY_GLIMMER_COMPONENTS - @for EmberENV - @type Boolean - @default false - @private - */ - _TEMPLATE_ONLY_GLIMMER_COMPONENTS: false, - /** Whether to perform extra bookkeeping needed to make the `captureRenderTree` API work. diff --git a/packages/@ember/-internals/glimmer/lib/resolver.ts b/packages/@ember/-internals/glimmer/lib/resolver.ts index 5ad07efc0c4..26530594b4c 100644 --- a/packages/@ember/-internals/glimmer/lib/resolver.ts +++ b/packages/@ember/-internals/glimmer/lib/resolver.ts @@ -1,5 +1,3 @@ -import { privatize as P } from '@ember/-internals/container'; -import { ENV } from '@ember/-internals/environment'; import type { InternalFactory, InternalOwner, RegisterOptions } from '@ember/-internals/owner'; import { isFactory } from '@ember/-internals/owner'; import { assert } from '@ember/debug'; @@ -274,22 +272,11 @@ export default class ResolverImpl let definition: Nullable = null; if (pair.component === null) { - if (ENV._TEMPLATE_ONLY_GLIMMER_COMPONENTS) { - definition = { - state: templateOnlyComponent(undefined, name), - manager: TEMPLATE_ONLY_COMPONENT_MANAGER, - template, - }; - } else { - let factory = owner.factoryFor(P`component:-default`)!; - let manager = getInternalComponentManager(factory.class as object); - - definition = { - state: factory, - manager, - template, - }; - } + definition = { + state: templateOnlyComponent(undefined, name), + manager: TEMPLATE_ONLY_COMPONENT_MANAGER, + template, + }; } else { let factory = pair.component; assert(`missing component class ${name}`, factory.class !== undefined); diff --git a/packages/@ember/-internals/glimmer/lib/setup-registry.ts b/packages/@ember/-internals/glimmer/lib/setup-registry.ts index 19d6053ac96..1608fe1f185 100644 --- a/packages/@ember/-internals/glimmer/lib/setup-registry.ts +++ b/packages/@ember/-internals/glimmer/lib/setup-registry.ts @@ -1,9 +1,7 @@ import type { Registry } from '@ember/-internals/container'; import { privatize as P } from '@ember/-internals/container'; -import { ENV } from '@ember/-internals/environment'; import { getOwner } from '@ember/-internals/owner'; import { assert } from '@ember/debug'; -import Component from './component'; import Input from './components/input'; import LinkTo from './components/link-to'; import Textarea from './components/textarea'; @@ -53,8 +51,4 @@ export function setupEngineRegistry(registry: Registry): void { registry.register('component:link-to', LinkTo); registry.register('component:textarea', Textarea); - - if (!ENV._TEMPLATE_ONLY_GLIMMER_COMPONENTS) { - registry.register(P`component:-default`, Component); - } } diff --git a/packages/@ember/-internals/glimmer/tests/integration/application/debug-render-tree-test.ts b/packages/@ember/-internals/glimmer/tests/integration/application/debug-render-tree-test.ts index c233e605dfb..8be91a4e555 100644 --- a/packages/@ember/-internals/glimmer/tests/integration/application/debug-render-tree-test.ts +++ b/packages/@ember/-internals/glimmer/tests/integration/application/debug-render-tree-test.ts @@ -55,19 +55,6 @@ if (ENV._DEBUG_RENDER_TREE) { moduleFor( 'Application test: debug render tree', class extends ApplicationTestCase { - _TEMPLATE_ONLY_GLIMMER_COMPONENTS: boolean; - - constructor(assert: QUnit['assert']) { - super(assert); - this._TEMPLATE_ONLY_GLIMMER_COMPONENTS = ENV._TEMPLATE_ONLY_GLIMMER_COMPONENTS; - ENV._TEMPLATE_ONLY_GLIMMER_COMPONENTS = true; - } - - teardown() { - super.teardown(); - ENV._TEMPLATE_ONLY_GLIMMER_COMPONENTS = this._TEMPLATE_ONLY_GLIMMER_COMPONENTS; - } - async '@test routes'() { this.addTemplate('index', 'Index'); this.addTemplate('foo', 'Foo {{outlet}}'); diff --git a/packages/@ember/-internals/glimmer/tests/integration/application/hot-reload-test.js b/packages/@ember/-internals/glimmer/tests/integration/application/hot-reload-test.js index d004d314e60..bedadc7e03e 100644 --- a/packages/@ember/-internals/glimmer/tests/integration/application/hot-reload-test.js +++ b/packages/@ember/-internals/glimmer/tests/integration/application/hot-reload-test.js @@ -1,6 +1,5 @@ import { moduleFor, ApplicationTestCase, strip, runTask } from 'internal-test-helpers'; -import { ENV } from '@ember/-internals/environment'; import Service, { service } from '@ember/service'; import { Component, Helper } from '@ember/-internals/glimmer'; import { expect } from '@glimmer/util'; @@ -13,9 +12,6 @@ moduleFor( class extends ApplicationTestCase { constructor() { super(...arguments); - this._TEMPLATE_ONLY_GLIMMER_COMPONENTS = ENV._TEMPLATE_ONLY_GLIMMER_COMPONENTS; - - ENV._TEMPLATE_ONLY_GLIMMER_COMPONENTS = true; let didCreateReloader = (reloader) => { this.reloader = reloader; @@ -77,11 +73,6 @@ moduleFor( ); } - teardown() { - super.teardown(); - ENV._TEMPLATE_ONLY_GLIMMER_COMPONENTS = this._TEMPLATE_ONLY_GLIMMER_COMPONENTS; - } - hotReload(name, template) { let reloader = expect(this.reloader); let revision = (reloader.revisionFor(name) || 0) + 1; diff --git a/packages/@ember/-internals/glimmer/tests/integration/components/angle-bracket-invocation-test.js b/packages/@ember/-internals/glimmer/tests/integration/components/angle-bracket-invocation-test.js index 5003545500f..b1fca1415e8 100644 --- a/packages/@ember/-internals/glimmer/tests/integration/components/angle-bracket-invocation-test.js +++ b/packages/@ember/-internals/glimmer/tests/integration/components/angle-bracket-invocation-test.js @@ -1,6 +1,5 @@ import { moduleFor, RenderingTestCase, strip, classes, runTask } from 'internal-test-helpers'; import { setModifierManager, modifierCapabilities } from '@glimmer/manager'; -import { ENV } from '@ember/-internals/environment'; import EmberObject from '@ember/object'; import { set, setProperties } from '@ember/object'; @@ -1166,17 +1165,6 @@ moduleFor( moduleFor( 'AngleBracket Invocation (splattributes)', class extends RenderingTestCase { - constructor() { - super(...arguments); - this._TEMPLATE_ONLY_GLIMMER_COMPONENTS = ENV._TEMPLATE_ONLY_GLIMMER_COMPONENTS; - ENV._TEMPLATE_ONLY_GLIMMER_COMPONENTS = true; - } - - teardown() { - super.teardown(); - ENV._TEMPLATE_ONLY_GLIMMER_COMPONENTS = this._TEMPLATE_ONLY_GLIMMER_COMPONENTS; - } - registerComponent(name, template) { super.registerComponent(name, { template, ComponentClass: null }); } diff --git a/packages/@ember/-internals/glimmer/tests/integration/components/template-only-components-test.js b/packages/@ember/-internals/glimmer/tests/integration/components/template-only-components-test.js index b938e76fd1f..e555f5a511a 100644 --- a/packages/@ember/-internals/glimmer/tests/integration/components/template-only-components-test.js +++ b/packages/@ember/-internals/glimmer/tests/integration/components/template-only-components-test.js @@ -1,5 +1,4 @@ -import { moduleFor, RenderingTestCase, classes, runTask } from 'internal-test-helpers'; -import { ENV } from '@ember/-internals/environment'; +import { moduleFor, RenderingTestCase, runTask } from 'internal-test-helpers'; import { setComponentTemplate } from '@glimmer/manager'; import { templateOnlyComponent } from '@glimmer/runtime'; import { compile } from 'ember-template-compiler'; @@ -13,256 +12,149 @@ class TemplateOnlyComponentsTest extends RenderingTestCase { } } -if (ENV._TEMPLATE_ONLY_GLIMMER_COMPONENTS) { - moduleFor( - 'Components test: template-only components (glimmer components)', - class extends TemplateOnlyComponentsTest { - ['@test it can render a template-only component']() { - this.registerTemplateOnlyComponent('foo-bar', 'hello'); - - this.render('{{foo-bar}}'); - - this.assertInnerHTML('hello'); - - this.assertStableRerender(); - } - - ['@test it can render named arguments']() { - this.registerTemplateOnlyComponent('foo-bar', '|{{@foo}}|{{@bar}}|'); - - this.render('{{foo-bar foo=this.foo bar=this.bar}}', { - foo: 'foo', - bar: 'bar', - }); - - this.assertInnerHTML('|foo|bar|'); - - this.assertStableRerender(); - - runTask(() => this.context.set('foo', 'FOO')); - - this.assertInnerHTML('|FOO|bar|'); - - runTask(() => this.context.set('bar', 'BAR')); - - this.assertInnerHTML('|FOO|BAR|'); - - runTask(() => this.context.setProperties({ foo: 'foo', bar: 'bar' })); - - this.assertInnerHTML('|foo|bar|'); - } - - ['@test it does not reflected arguments as properties']() { - this.registerTemplateOnlyComponent('foo-bar', '|{{this.foo}}|{{this.bar}}|'); - - this.render('{{foo-bar foo=foo bar=bar}}', { - foo: 'foo', - bar: 'bar', - }); - - this.assertInnerHTML('|||'); - - this.assertStableRerender(); - - runTask(() => this.context.set('foo', 'FOO')); - - this.assertInnerHTML('|||'); - - runTask(() => this.context.set('bar', null)); - - this.assertInnerHTML('|||'); - - runTask(() => this.context.setProperties({ foo: 'foo', bar: 'bar' })); - - this.assertInnerHTML('|||'); - } - - ['@test it does not have curly component features']() { - this.registerTemplateOnlyComponent('foo-bar', 'hello'); - - this.render('{{foo-bar tagName="p" class=class}}', { - class: 'foo bar', - }); +moduleFor( + 'Components test: template-only components (glimmer components)', + class extends TemplateOnlyComponentsTest { + ['@test it can render a template-only component']() { + this.registerTemplateOnlyComponent('foo-bar', 'hello'); - this.assertInnerHTML('hello'); + this.render('{{foo-bar}}'); - this.assertStableRerender(); + this.assertInnerHTML('hello'); - runTask(() => this.context.set('class', 'foo')); + this.assertStableRerender(); + } - this.assertInnerHTML('hello'); + ['@test it can render named arguments']() { + this.registerTemplateOnlyComponent('foo-bar', '|{{@foo}}|{{@bar}}|'); - runTask(() => this.context.set('class', null)); + this.render('{{foo-bar foo=this.foo bar=this.bar}}', { + foo: 'foo', + bar: 'bar', + }); - this.assertInnerHTML('hello'); + this.assertInnerHTML('|foo|bar|'); - runTask(() => this.context.set('class', 'foo bar')); + this.assertStableRerender(); - this.assertInnerHTML('hello'); - } + runTask(() => this.context.set('foo', 'FOO')); - ['@test it has the correct bounds']() { - this.registerTemplateOnlyComponent('foo-bar', 'hello'); + this.assertInnerHTML('|FOO|bar|'); - this.render('outside {{#if this.isShowing}}before {{foo-bar}} after{{/if}} outside', { - isShowing: true, - }); + runTask(() => this.context.set('bar', 'BAR')); - this.assertInnerHTML('outside before hello after outside'); + this.assertInnerHTML('|FOO|BAR|'); - this.assertStableRerender(); + runTask(() => this.context.setProperties({ foo: 'foo', bar: 'bar' })); - runTask(() => this.context.set('isShowing', false)); + this.assertInnerHTML('|foo|bar|'); + } - this.assertInnerHTML('outside outside'); + ['@test it does not reflected arguments as properties']() { + this.registerTemplateOnlyComponent('foo-bar', '|{{this.foo}}|{{this.bar}}|'); - runTask(() => this.context.set('isShowing', null)); + this.render('{{foo-bar foo=foo bar=bar}}', { + foo: 'foo', + bar: 'bar', + }); - this.assertInnerHTML('outside outside'); + this.assertInnerHTML('|||'); - runTask(() => this.context.set('isShowing', true)); + this.assertStableRerender(); - this.assertInnerHTML('outside before hello after outside'); - } + runTask(() => this.context.set('foo', 'FOO')); - ['@test asserts when a shared dependency is changed during rendering, and keeps original context']() { - this.registerComponent('x-outer', { - ComponentClass: Component.extend({ - value: 1, - wrapper: EmberObject.create({ content: null }), - }), - template: - '
{{x-inner-template-only value=this.wrapper.content wrapper=this.wrapper}}
{{x-inner value=this.value wrapper=this.wrapper}}', - }); + this.assertInnerHTML('|||'); - this.registerComponent('x-inner', { - ComponentClass: Component.extend({ - didReceiveAttrs() { - this.get('wrapper').set('content', this.get('value')); - }, - value: null, - }), - template: '
{{this.wrapper.content}}
', - }); + runTask(() => this.context.set('bar', null)); - this.registerTemplateOnlyComponent('x-inner-template-only', '{{@value}}'); + this.assertInnerHTML('|||'); - let expectedBacktrackingMessage = backtrackingMessageFor('content', '<.+?>', { - renderTree: ['x-outer', 'x-inner-template-only', 'this.wrapper.content'], - }); + runTask(() => this.context.setProperties({ foo: 'foo', bar: 'bar' })); - expectAssertion(() => { - this.render('{{x-outer}}'); - }, expectedBacktrackingMessage); - } + this.assertInnerHTML('|||'); } - ); -} else { - moduleFor( - 'Components test: template-only components (curly components)', - class extends TemplateOnlyComponentsTest { - ['@test it can render a template-only component']() { - this.registerTemplateOnlyComponent('foo-bar', 'hello'); - - this.render('{{foo-bar}}'); - - this.assertComponentElement(this.firstChild, { content: 'hello' }); - - this.assertStableRerender(); - } - ['@test it can render named arguments']() { - this.registerTemplateOnlyComponent('foo-bar', '|{{@foo}}|{{@bar}}|'); + ['@test it does not have curly component features']() { + this.registerTemplateOnlyComponent('foo-bar', 'hello'); - this.render('{{foo-bar foo=this.foo bar=this.bar}}', { - foo: 'foo', - bar: 'bar', - }); - - this.assertComponentElement(this.firstChild, { content: '|foo|bar|' }); - - this.assertStableRerender(); - - runTask(() => this.context.set('foo', 'FOO')); - - this.assertComponentElement(this.firstChild, { content: '|FOO|bar|' }); - - runTask(() => this.context.set('bar', 'BAR')); + this.render('{{foo-bar tagName="p" class=class}}', { + class: 'foo bar', + }); - this.assertComponentElement(this.firstChild, { content: '|FOO|BAR|' }); + this.assertInnerHTML('hello'); - runTask(() => this.context.setProperties({ foo: 'foo', bar: 'bar' })); + this.assertStableRerender(); - this.assertComponentElement(this.firstChild, { content: '|foo|bar|' }); - } + runTask(() => this.context.set('class', 'foo')); - ['@test it renders named arguments as reflected properties']() { - this.registerTemplateOnlyComponent('foo-bar', '|{{this.foo}}|{{this.bar}}|'); + this.assertInnerHTML('hello'); - this.render('{{foo-bar foo=this.foo bar=this.bar}}', { - foo: 'foo', - bar: 'bar', - }); + runTask(() => this.context.set('class', null)); - this.assertComponentElement(this.firstChild, { content: '|foo|bar|' }); + this.assertInnerHTML('hello'); - this.assertStableRerender(); + runTask(() => this.context.set('class', 'foo bar')); - runTask(() => this.context.set('foo', 'FOO')); + this.assertInnerHTML('hello'); + } - this.assertComponentElement(this.firstChild, { content: '|FOO|bar|' }); + ['@test it has the correct bounds']() { + this.registerTemplateOnlyComponent('foo-bar', 'hello'); - runTask(() => this.context.set('bar', null)); + this.render('outside {{#if this.isShowing}}before {{foo-bar}} after{{/if}} outside', { + isShowing: true, + }); - this.assertComponentElement(this.firstChild, { content: '|FOO||' }); + this.assertInnerHTML('outside before hello after outside'); - runTask(() => this.context.setProperties({ foo: 'foo', bar: 'bar' })); + this.assertStableRerender(); - this.assertComponentElement(this.firstChild, { content: '|foo|bar|' }); - } + runTask(() => this.context.set('isShowing', false)); - ['@test it has curly component features']() { - this.registerTemplateOnlyComponent('foo-bar', 'hello'); + this.assertInnerHTML('outside outside'); - this.render('{{foo-bar tagName="p" class=this.class}}', { - class: 'foo bar', - }); + runTask(() => this.context.set('isShowing', null)); - this.assertComponentElement(this.firstChild, { - tagName: 'p', - attrs: { class: classes('foo bar ember-view') }, - content: 'hello', - }); + this.assertInnerHTML('outside outside'); - this.assertStableRerender(); + runTask(() => this.context.set('isShowing', true)); - runTask(() => this.context.set('class', 'foo')); + this.assertInnerHTML('outside before hello after outside'); + } - this.assertComponentElement(this.firstChild, { - tagName: 'p', - attrs: { class: classes('foo ember-view') }, - content: 'hello', - }); + ['@test asserts when a shared dependency is changed during rendering, and keeps original context']() { + this.registerComponent('x-outer', { + ComponentClass: Component.extend({ + value: 1, + wrapper: EmberObject.create({ content: null }), + }), + template: + '
{{x-inner-template-only value=this.wrapper.content wrapper=this.wrapper}}
{{x-inner value=this.value wrapper=this.wrapper}}', + }); - runTask(() => this.context.set('class', null)); + this.registerComponent('x-inner', { + ComponentClass: Component.extend({ + didReceiveAttrs() { + this.get('wrapper').set('content', this.get('value')); + }, + value: null, + }), + template: '
{{this.wrapper.content}}
', + }); - this.assertComponentElement(this.firstChild, { - tagName: 'p', - attrs: { class: classes('ember-view') }, - content: 'hello', - }); + this.registerTemplateOnlyComponent('x-inner-template-only', '{{@value}}'); - runTask(() => this.context.set('class', 'foo bar')); + let expectedBacktrackingMessage = backtrackingMessageFor('content', '<.+?>', { + renderTree: ['x-outer', 'x-inner-template-only', 'this.wrapper.content'], + }); - this.assertComponentElement(this.firstChild, { - tagName: 'p', - attrs: { class: classes('foo bar ember-view') }, - content: 'hello', - }); - } + expectAssertion(() => { + this.render('{{x-outer}}'); + }, expectedBacktrackingMessage); } - ); -} + } +); moduleFor( 'Components test: template-only components (using `templateOnlyComponent()`)', diff --git a/packages/ember/tests/component_registration_test.js b/packages/ember/tests/component_registration_test.js index 1495ad74d95..bb7dacb694a 100644 --- a/packages/ember/tests/component_registration_test.js +++ b/packages/ember/tests/component_registration_test.js @@ -3,7 +3,6 @@ import Controller from '@ember/controller'; import { Component } from '@ember/-internals/glimmer'; import { compile } from 'ember-template-compiler'; import { moduleFor, ApplicationTestCase } from 'internal-test-helpers'; -import { ENV } from '@ember/-internals/environment'; import { DEBUG } from '@glimmer/env'; moduleFor( @@ -14,38 +13,12 @@ moduleFor( return super.createApplication(options, Application.extend()); } - ['@test The helper becomes the body of the component'](assert) { - if (ENV._TEMPLATE_ONLY_GLIMMER_COMPONENTS) { - assert.expect(0); - return; - } - - this.addTemplate('components/expand-it', '

hello {{yield}}

'); - this.addTemplate('application', 'Hello world {{#expand-it}}world{{/expand-it}}'); - - return this.visit('/').then(() => { - this.assertText('Hello world hello world'); - this.assertComponentElement(this.element.firstElementChild, { - tagName: 'div', - content: '

hello world

', - }); - }); - } - - ['@test The helper becomes the body of the component (ENV._TEMPLATE_ONLY_GLIMMER_COMPONENTS = true;)']( - assert - ) { - if (!ENV._TEMPLATE_ONLY_GLIMMER_COMPONENTS) { - assert.expect(0); - return; - } - + ['@test The helper becomes the body of the component']() { this.addTemplate('components/expand-it', '

hello {{yield}}

'); this.addTemplate('application', 'Hello world {{#expand-it}}world{{/expand-it}}'); return this.visit('/').then(() => { this.assertInnerHTML('Hello world

hello world

'); - ENV._TEMPLATE_ONLY_GLIMMER_COMPONENTS = false; }); } diff --git a/tests/docs/expected.js b/tests/docs/expected.js index fa28446307c..550fc9d4772 100644 --- a/tests/docs/expected.js +++ b/tests/docs/expected.js @@ -11,7 +11,6 @@ module.exports = { '_DEFAULT_ASYNC_OBSERVERS', '_NO_IMPLICIT_ROUTE_MODEL', '_RERENDER_LOOP_LIMIT', - '_TEMPLATE_ONLY_GLIMMER_COMPONENTS', '_ALL_DEPRECATIONS_ENABLED', '_OVERRIDE_DEPRECATION_VERSION', 'Input', diff --git a/tests/index.html b/tests/index.html index ed768814b5e..3d3260da19f 100644 --- a/tests/index.html +++ b/tests/index.html @@ -27,7 +27,6 @@ var edition = QUnit.urlParams.edition || 'octane'; if (edition === 'octane') { - EmberENV._TEMPLATE_ONLY_GLIMMER_COMPONENTS = true; EmberENV._DEFAULT_ASYNC_OBSERVERS = true; } diff --git a/tests/node/app-boot-test.js b/tests/node/app-boot-test.js index 92ce303be90..f1bbe0bfaec 100644 --- a/tests/node/app-boot-test.js +++ b/tests/node/app-boot-test.js @@ -36,7 +36,7 @@ QUnit.module('App Boot', function (hooks) { return this.renderToHTML('/').then(function (html) { assert.htmlMatches( html, - '

Hello World

The files are *inside* the computer?!

' + '

Hello World

The files are *inside* the computer?!

' ); }); }); diff --git a/tests/node/fastboot-sandbox-test.js b/tests/node/fastboot-sandbox-test.js index 1ca6af7df26..5f239351f04 100644 --- a/tests/node/fastboot-sandbox-test.js +++ b/tests/node/fastboot-sandbox-test.js @@ -55,7 +55,6 @@ function buildSandboxContext(precompile) { let environmentSetupScript = new vm.Script( ` var EmberENV = { - _TEMPLATE_ONLY_GLIMMER_COMPONENTS: true, _DEFAULT_ASYNC_OBSERVERS: true, _JQUERY_INTEGRATION: false, };`,