Implement emberjs/rfcs#1006

emberjs · Mar 26, 2024 · db0f0d8 · db0f0d8
1 parent aaee9e9
commit db0f0d8
Show file tree

Hide file tree

Showing 29 changed files with 653 additions and 15 deletions.
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -20,6 +20,10 @@ on:
 permissions:
   contents: read
 
+env:
+  OVERRIDE_FEATURES: 'DEPRECATE_TEMPLATE_ACTION'
+
+
 jobs:
   lint:
     name: Linting

diff --git a/packages/@ember/-internals/deprecations/index.ts b/packages/@ember/-internals/deprecations/index.ts
@@ -97,6 +97,15 @@ export const DEPRECATIONS = {
     until: '6.0.0',
     url: 'https://deprecations.emberjs.com/v5.x/#toc_deprecate-implicit-route-model',
   }),
+  DEPRECATE_TEMPLATE_ACTION: deprecation({
+    id: 'template-action',
+    url: 'https://deprecations.emberjs.com/id/template-action',
+    until: '6.0.0',
+    for: 'ember-source',
+    since: {
+      available: '5.9.0',
+    },
+  }),
 };
 
 export function deprecateUntil(message: string, deprecation: DeprecationObject) {

diff --git a/packages/@ember/-internals/glimmer/lib/helpers/action.ts b/packages/@ember/-internals/glimmer/lib/helpers/action.ts
@@ -4,6 +4,7 @@
 import { get } from '@ember/-internals/metal';
 import type { AnyFn } from '@ember/-internals/utility-types';
 import { assert } from '@ember/debug';
+import { DEPRECATIONS, deprecateUntil } from '@ember/-internals/deprecations';
 import { flaggedInstrument } from '@ember/instrumentation';
 import { join } from '@ember/runloop';
 import { DEBUG } from '@glimmer/env';
@@ -278,6 +279,10 @@ export const ACTIONS = new WeakSet();
   @public
 */
 export default internalHelper((args: CapturedArguments): Reference<Function> => {
+  deprecateUntil(
+    `Usage of the \`(action)\` helper is deprecated. Migrate to native functions and function invocation.`,
+    DEPRECATIONS.DEPRECATE_TEMPLATE_ACTION
+  );
   let { named, positional } = args;
   // The first two argument slots are reserved.
   // pos[0] is the context (or `this`)

diff --git a/packages/@ember/-internals/glimmer/lib/modifiers/action.ts b/packages/@ember/-internals/glimmer/lib/modifiers/action.ts
@@ -1,4 +1,5 @@
 import type { InternalOwner } from '@ember/-internals/owner';
+import { DEPRECATIONS, deprecateUntil } from '@ember/-internals/deprecations';
 import { uuid } from '@ember/-internals/utils';
 import { ActionManager, EventDispatcher, isSimpleClick } from '@ember/-internals/views';
 import { assert } from '@ember/debug';
@@ -204,6 +205,10 @@ class ActionModifierManager implements InternalModifierManager<ActionState, obje
   }
 
   install(actionState: ActionState): void {
+    deprecateUntil(
+      `Usage of the \`{{action}}\` modifier is deprecated. Migrate to native functions and function invocation.`,
+      DEPRECATIONS.DEPRECATE_TEMPLATE_ACTION
+    );
     let { element, actionId, positional } = actionState;
 
     let actionName;

diff --git a/packages/@ember/-internals/glimmer/tests/integration/application/actions-test.js b/packages/@ember/-internals/glimmer/tests/integration/application/actions-test.js
@@ -4,6 +4,7 @@ import Controller from '@ember/controller';
 import { getDebugFunction, setDebugFunction } from '@ember/debug';
 
 import { Component } from '../../utils/helpers';
+import { DEPRECATIONS } from '../../../../deprecations';
 
 const originalDebug = getDebugFunction('debug');
 const noop = function () {};
@@ -14,6 +15,11 @@ moduleFor(
     constructor() {
       setDebugFunction('debug', noop);
       super(...arguments);
+
+      expectDeprecation(
+        /Usage of the `\{\{action\}\}` modifier is deprecated./,
+        DEPRECATIONS.DEPRECATE_TEMPLATE_ACTION.isEnabled
+      );
     }
 
     teardown() {
@@ -23,7 +29,7 @@ moduleFor(
     ['@test actions in top level template application template target application controller'](
       assert
     ) {
-      assert.expect(1);
+      assert.expect(2);
 
       this.add(
         'controller:application',
@@ -47,7 +53,7 @@ moduleFor(
     }
 
     ['@test actions in nested outlet template target their controller'](assert) {
-      assert.expect(1);
+      assert.expect(2);
 
       this.add(
         'controller:application',

diff --git a/...ages/@ember/-internals/glimmer/tests/integration/components/contextual-components-test.js b/...ages/@ember/-internals/glimmer/tests/integration/components/contextual-components-test.js
@@ -4,6 +4,7 @@ import { moduleFor, RenderingTestCase, applyMixins, strip, runTask } from 'inter
 import { isEmpty } from '@ember/utils';
 import { A as emberA } from '@ember/array';
 
+import { DEPRECATIONS } from '../../../../deprecations';
 import { Component } from '../../utils/helpers';
 
 moduleFor(
@@ -757,6 +758,11 @@ moduleFor(
     }
 
     ['@test renders with dot path and updates attributes'](assert) {
+      expectDeprecation(
+        /Usage of the `\(action\)` helper is deprecated./,
+        DEPRECATIONS.DEPRECATE_TEMPLATE_ACTION.isEnabled
+      );
+
       this.registerComponent('my-nested-component', {
         ComponentClass: Component.extend({
           didReceiveAttrs() {
@@ -839,6 +845,14 @@ moduleFor(
     ['@test parameters in a contextual component are mutable when value is a param'](assert) {
       // This checks that a `(mut)` is added to parameters and attributes to
       // contextual components when it is a param.
+      expectDeprecation(
+        /Usage of the `\(action\)` helper is deprecated./,
+        DEPRECATIONS.DEPRECATE_TEMPLATE_ACTION.isEnabled
+      );
+      expectDeprecation(
+        /Usage of the `\{\{action\}\}` modifier is deprecated./,
+        DEPRECATIONS.DEPRECATE_TEMPLATE_ACTION.isEnabled
+      );
 
       this.registerComponent('change-button', {
         ComponentClass: Component.extend().reopenClass({
@@ -889,6 +903,10 @@ moduleFor(
     }
 
     ['@test GH#13494 tagless blockless component with property binding'](assert) {
+      expectDeprecation(
+        /Usage of the `\(action\)` helper is deprecated./,
+        DEPRECATIONS.DEPRECATE_TEMPLATE_ACTION.isEnabled
+      );
       this.registerComponent('outer-component', {
         ComponentClass: Component.extend({
           message: 'hello',
@@ -1442,6 +1460,14 @@ class MutableParamTestGenerator {
   generate({ title, setup }) {
     return {
       [`@test parameters in a contextual component are mutable when value is a ${title}`](assert) {
+        expectDeprecation(
+          /Usage of the `\(action\)` helper is deprecated./,
+          DEPRECATIONS.DEPRECATE_TEMPLATE_ACTION.isEnabled
+        );
+        expectDeprecation(
+          /Usage of the `\{\{action\}\}` modifier is deprecated./,
+          DEPRECATIONS.DEPRECATE_TEMPLATE_ACTION.isEnabled
+        );
         this.registerComponent('change-button', {
           ComponentClass: Component.extend().reopenClass({
             positionalParams: ['val'],

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
@@ -20,6 +20,7 @@ import { A as emberA } from '@ember/array';
 
 import { Component, compile, htmlSafe } from '../../utils/helpers';
 import { backtrackingMessageFor } from '../../utils/debug-stack';
+import { DEPRECATIONS } from '../../../../deprecations';
 
 moduleFor(
   'Components test: curly components',
@@ -1428,6 +1429,11 @@ moduleFor(
     ) {
       let componentInstance = null;
 
+      expectDeprecation(
+        /Usage of the `\{\{action\}\}` modifier is deprecated./,
+        DEPRECATIONS.DEPRECATE_TEMPLATE_ACTION.isEnabled
+      );
+
       this.registerComponent('non-block', {
         ComponentClass: Component.extend({
           counter: computed({
@@ -3149,6 +3155,11 @@ moduleFor(
     ['@test returning `true` from an action does not bubble if `target` is not specified (GH#14275)'](
       assert
     ) {
+      expectDeprecation(
+        /Usage of the `\{\{action\}\}` modifier is deprecated./,
+        DEPRECATIONS.DEPRECATE_TEMPLATE_ACTION.isEnabled
+      );
+
       this.registerComponent('display-toggle', {
         ComponentClass: Component.extend({
           actions: {
@@ -3174,7 +3185,12 @@ moduleFor(
     }
 
     ['@test returning `true` from an action bubbles to the `target` if specified'](assert) {
-      assert.expect(4);
+      assert.expect(5);
+
+      expectDeprecation(
+        /Usage of the `\{\{action\}\}` modifier is deprecated./,
+        DEPRECATIONS.DEPRECATE_TEMPLATE_ACTION.isEnabled
+      );
 
       this.registerComponent('display-toggle', {
         ComponentClass: Component.extend({

diff --git a/packages/@ember/-internals/glimmer/tests/integration/components/dynamic-components-test.js b/packages/@ember/-internals/glimmer/tests/integration/components/dynamic-components-test.js
@@ -5,6 +5,7 @@ import { set, computed } from '@ember/object';
 
 import { Component } from '../../utils/helpers';
 import { backtrackingMessageFor } from '../../utils/debug-stack';
+import { DEPRECATIONS } from '../../../../deprecations';
 
 moduleFor(
   'Components test: dynamic components',
@@ -449,6 +450,11 @@ moduleFor(
         }),
       });
 
+      expectDeprecation(
+        /Usage of the `\(action\)` helper is deprecated./,
+        DEPRECATIONS.DEPRECATE_TEMPLATE_ACTION.isEnabled
+      );
+
       let actionTriggered = 0;
       this.registerComponent('outer-component', {
         template:

diff --git a/packages/@ember/-internals/glimmer/tests/integration/components/input-angle-test.js b/packages/@ember/-internals/glimmer/tests/integration/components/input-angle-test.js
@@ -1,5 +1,6 @@
 import { moduleFor, RenderingTestCase, runDestroy, runTask } from 'internal-test-helpers';
 import { set } from '@ember/object';
+import { DEPRECATIONS } from '../../../../deprecations';
 
 class InputRenderingTest extends RenderingTestCase {
   $input() {
@@ -283,7 +284,11 @@ moduleFor(
     ['@test sends an action with `<Input @enter={{action "foo"}} />` when <enter> is pressed'](
       assert
     ) {
-      assert.expect(2);
+      assert.expect(3);
+      expectDeprecation(
+        /Usage of the `\(action\)` helper is deprecated./,
+        DEPRECATIONS.DEPRECATE_TEMPLATE_ACTION.isEnabled
+      );
 
       this.render(`<Input @enter={{action 'foo'}} />`, {
         actions: {
@@ -300,7 +305,11 @@ moduleFor(
     }
 
     ['@test sends `insert-newline` when <enter> is pressed'](assert) {
-      assert.expect(2);
+      assert.expect(3);
+      expectDeprecation(
+        /Usage of the `\(action\)` helper is deprecated./,
+        DEPRECATIONS.DEPRECATE_TEMPLATE_ACTION.isEnabled
+      );
 
       this.render(`<Input @insert-newline={{action 'foo'}} />`, {
         actions: {
@@ -319,7 +328,11 @@ moduleFor(
     ['@test sends an action with `<Input @escape-press={{action "foo"}} />` when <escape> is pressed'](
       assert
     ) {
-      assert.expect(2);
+      assert.expect(3);
+      expectDeprecation(
+        /Usage of the `\(action\)` helper is deprecated./,
+        DEPRECATIONS.DEPRECATE_TEMPLATE_ACTION.isEnabled
+      );
 
       this.render(`<Input @escape-press={{action 'foo'}} />`, {
         actions: {

diff --git a/packages/@ember/-internals/glimmer/tests/integration/components/input-curly-test.js b/packages/@ember/-internals/glimmer/tests/integration/components/input-curly-test.js
@@ -1,6 +1,7 @@
 import { RenderingTestCase, moduleFor, runDestroy, runTask } from 'internal-test-helpers';
 
 import { set } from '@ember/object';
+import { DEPRECATIONS } from '../../../../deprecations';
 
 class InputRenderingTest extends RenderingTestCase {
   $input() {
@@ -152,7 +153,11 @@ moduleFor(
     ['@test sends an action with `{{input enter=(action "foo")}}` when <enter> is pressed'](
       assert
     ) {
-      assert.expect(2);
+      assert.expect(3);
+      expectDeprecation(
+        /Usage of the `\(action\)` helper is deprecated./,
+        DEPRECATIONS.DEPRECATE_TEMPLATE_ACTION.isEnabled
+      );
 
       this.render(`{{input enter=(action 'foo')}}`, {
         actions: {
@@ -169,7 +174,11 @@ moduleFor(
     }
 
     ['@test sends `insert-newline` when <enter> is pressed'](assert) {
-      assert.expect(2);
+      assert.expect(3);
+      expectDeprecation(
+        /Usage of the `\(action\)` helper is deprecated./,
+        DEPRECATIONS.DEPRECATE_TEMPLATE_ACTION.isEnabled
+      );
 
       this.render(`{{input insert-newline=(action 'foo')}}`, {
         actions: {
@@ -188,7 +197,11 @@ moduleFor(
     ['@test sends an action with `{{input escape-press=(action "foo")}}` when <escape> is pressed'](
       assert
     ) {
-      assert.expect(2);
+      assert.expect(3);
+      expectDeprecation(
+        /Usage of the `\(action\)` helper is deprecated./,
+        DEPRECATIONS.DEPRECATE_TEMPLATE_ACTION.isEnabled
+      );
 
       this.render(`{{input escape-press=(action 'foo')}}`, {
         actions: {

diff --git a/...ages/@ember/-internals/glimmer/tests/integration/components/link-to/routing-angle-test.js b/...ages/@ember/-internals/glimmer/tests/integration/components/link-to/routing-angle-test.js
@@ -13,6 +13,7 @@ import { service } from '@ember/service';
 import Engine from '@ember/engine';
 import { DEBUG } from '@glimmer/env';
 import { compile } from '../../../utils/helpers';
+import { DEPRECATIONS } from '../../../../../deprecations';
 
 // IE includes the host name
 function normalizeUrl(url) {
@@ -1027,6 +1028,10 @@ moduleFor(
     }
 
     async ['@test it defaults to bubbling'](assert) {
+      expectDeprecation(
+        /Usage of the `\{\{action\}\}` modifier is deprecated./,
+        DEPRECATIONS.DEPRECATE_TEMPLATE_ACTION.isEnabled
+      );
       this.addTemplate(
         'about',
         `

diff --git a/...ages/@ember/-internals/glimmer/tests/integration/components/link-to/routing-curly-test.js b/...ages/@ember/-internals/glimmer/tests/integration/components/link-to/routing-curly-test.js
@@ -13,6 +13,7 @@ import { service } from '@ember/service';
 import Engine from '@ember/engine';
 import { DEBUG } from '@glimmer/env';
 import { compile } from '../../../utils/helpers';
+import { DEPRECATIONS } from '../../../../../deprecations';
 
 // IE includes the host name
 function normalizeUrl(url) {
@@ -1097,6 +1098,11 @@ moduleFor(
     }
 
     async ['@test it defaults to bubbling'](assert) {
+      expectDeprecation(
+        /Usage of the `\{\{action\}\}` modifier is deprecated./,
+        DEPRECATIONS.DEPRECATE_TEMPLATE_ACTION.isEnabled
+      );
+
       this.addTemplate(
         'about',
         `