Skip to content

Commit

Permalink
Merge pull request #19658 from mixonic/mixonic/remove-sendAction
Browse files Browse the repository at this point in the history 
Remove sendAction and string action passing
  • Loading branch information
@rwjblue
rwjblue authored Jul 21, 2021
2 parents 34544e1 + 52a1384 commit 6233490
Show file tree
Hide file tree
Showing 13 changed files with 12 additions and 1,244 deletions.
84 changes: 2 additions & 82 deletions packages/@ember/-internals/glimmer/lib/components/abstract-input.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,8 @@ import { tracked } from '@ember/-internals/metal';
import { TargetActionSupport } from '@ember/-internals/runtime';
import { TextSupport } from '@ember/-internals/views';
import { EMBER_MODERNIZED_BUILT_IN_COMPONENTS } from '@ember/canary-features';
import { assert, deprecate } from '@ember/debug';
import { JQUERY_INTEGRATION, SEND_ACTION } from '@ember/deprecated-features';
import { assert } from '@ember/debug';
import { JQUERY_INTEGRATION } from '@ember/deprecated-features';
import { action } from '@ember/object';
import { isConstRef, isUpdatableRef, Reference, updateRef, valueForRef } from '@glimmer/reference';
import Component from '../component';
Expand Down Expand Up @@ -207,86 +207,6 @@ export function handleDeprecatedFeatures(
target: InternalComponentConstructor<AbstractInput>,
attributeBindings: Array<string | [attribute: string, argument: string]>
): void {
if (SEND_ACTION) {
let angle = target.toString();
let { prototype } = target;

interface View {
send(action: string, ...args: unknown[]): void;
}

let isView = (target: {}): target is View => {
return typeof (target as Partial<View>).send === 'function';
};

let superListenerFor = prototype['listenerFor'];

Object.defineProperty(prototype, 'listenerFor', {
configurable: true,
enumerable: false,
value: function listenerFor(this: AbstractInput, name: string): EventListener {
const actionName = this.named(name);

if (typeof actionName === 'string') {
deprecate(
`Passing actions to components as strings (like \`<${angle} @${name}="${actionName}" />\`) is deprecated. ` +
`Please use closure actions instead (\`<${angle} @${name}={{action "${actionName}"}} />\`).`,
false,
{
id: 'ember-component.send-action',
for: 'ember-source',
since: {},
until: '4.0.0',
url: 'https://deprecations.emberjs.com/v3.x#toc_ember-component-send-action',
}
);

const { caller } = this;

assert('[BUG] missing caller', caller && typeof caller === 'object');

let listener: Function;

if (isView(caller)) {
listener = (...args: unknown[]) => caller.send(actionName, ...args);
} else {
assert(
`The action '${actionName}' did not exist on ${caller}`,
typeof caller[actionName] === 'function'
);

listener = caller[actionName];
}

let deprecatedListener = (...args: unknown[]) => {
deprecate(
`Passing actions to components as strings (like \`<${angle} @${name}="${actionName}" />\`) is deprecated. ` +
`Please use closure actions instead (\`<${angle} @${name}={{action "${actionName}"}} />\`).`,
false,
{
id: 'ember-component.send-action',
for: 'ember-source',
since: {},
until: '4.0.0',
url: 'https://deprecations.emberjs.com/v3.x#toc_ember-component-send-action',
}
);

return listener(...args);
};

if (this.isVirtualEventListener(name, deprecatedListener)) {
return devirtualize(deprecatedListener);
} else {
return deprecatedListener as EventListener;
}
} else {
return superListenerFor.call(this, name);
}
},
});
}

if (EMBER_MODERNIZED_BUILT_IN_COMPONENTS) {
let { prototype } = target;

Expand Down
10 changes: 5 additions & 5 deletions packages/@ember/-internals/glimmer/lib/helpers/action.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -95,10 +95,10 @@ export const ACTIONS = new _WeakSet();
Closure actions curry both their scope and any arguments. When invoked, any
additional arguments are added to the already curried list.
Actions should be invoked using the [sendAction](/ember/release/classes/Component/methods/sendAction?anchor=sendAction)
method. The first argument to `sendAction` is the action to be called, and
additional arguments are passed to the action function. This has interesting
properties combined with currying of arguments. For example:
Actions are presented in JavaScript as callbacks, and are
invoked like any other JavaScript function.
For example
```app/components/update-name.js
import Component from '@glimmer/component';
Expand Down Expand Up @@ -152,7 +152,7 @@ export const ACTIONS = new _WeakSet();
export default Component.extend({
click() {
// Note that model is not passed, it was curried in the template
this.sendAction('submit', 'bob');
this.submit('bob');
}
});
```
Expand Down
125 changes: 0 additions & 125 deletions packages/@ember/-internals/glimmer/tests/integration/components/input-angle-test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -554,31 +554,6 @@ moduleFor(
// this.assertSelectionRange(8, 8); //NOTE: this fails in IE, the range is 0 -> 0 (TEST_SUITE=sauce)
}

['@test [DEPRECATED] sends an action with `<Input @enter="foo" />` when <enter> is pressed'](
assert
) {
assert.expect(4);

expectDeprecation(() => {
this.render(`<Input @enter="foo" />`, {
actions: {
foo(value, event) {
assert.ok(true, 'action was triggered');
if (jQueryDisabled) {
assert.notOk(event.originalEvent, 'event is not a jQuery.Event');
} else {
assert.ok(event instanceof jQuery.Event, 'jQuery event was passed');
}
},
},
});
}, 'Passing actions to components as strings (like `<Input @enter="foo" />`) is deprecated. Please use closure actions instead (`<Input @enter={{action "foo"}} />`). (\'-top-level\' @ L1:C0) ');

expectDeprecation(() => {
this.triggerEvent('keyup', { key: 'Enter' });
}, 'Passing actions to components as strings (like `<Input @enter="foo" />`) is deprecated. Please use closure actions instead (`<Input @enter={{action "foo"}} />`).');
}

['@test sends an action with `<Input @enter={{action "foo"}} />` when <enter> is pressed'](
assert
) {
Expand All @@ -602,31 +577,6 @@ moduleFor(
});
}

['@test [DEPRECATED] sends an action with `<Input @key-press="foo" />` is pressed'](assert) {
assert.expect(4);

expectDeprecation(() => {
this.render(`<Input @value={{this.value}} @key-press='foo' />`, {
value: 'initial',

actions: {
foo(value, event) {
assert.ok(true, 'action was triggered');
if (jQueryDisabled) {
assert.notOk(event.originalEvent, 'event is not a jQuery.Event');
} else {
assert.ok(event instanceof jQuery.Event, 'jQuery event was passed');
}
},
},
});
}, /Passing actions to components as strings \(like `({{input key-press="foo"}}|<Input @key-press="foo" \/>)`\) is deprecated\.|Passing the `@key-press` argument to <Input> is deprecated\./);

expectDeprecation(() => {
this.triggerEvent('keypress', { key: 'A' });
}, /Passing actions to components as strings \(like `({{input key-press="foo"}}|<Input @key-press="foo" \/>)`\) is deprecated\./);
}

['@test sends an action with `<Input @key-press={{action "foo"}} />` is pressed'](assert) {
let triggered = 0;

Expand Down Expand Up @@ -727,31 +677,6 @@ moduleFor(
});
}

['@test [DEPRECATED] sends an action with `<Input @escape-press="foo" />` when <escape> is pressed'](
assert
) {
assert.expect(4);

expectDeprecation(() => {
this.render(`<Input @escape-press='foo' />`, {
actions: {
foo(value, event) {
assert.ok(true, 'action was triggered');
if (jQueryDisabled) {
assert.notOk(event.originalEvent, 'event is not a jQuery.Event');
} else {
assert.ok(event instanceof jQuery.Event, 'jQuery event was passed');
}
},
},
});
}, 'Passing actions to components as strings (like `<Input @escape-press="foo" />`) is deprecated. Please use closure actions instead (`<Input @escape-press={{action "foo"}} />`). (\'-top-level\' @ L1:C0) ');

expectDeprecation(() => {
this.triggerEvent('keyup', { key: 'Escape' });
}, 'Passing actions to components as strings (like `<Input @escape-press="foo" />`) is deprecated. Please use closure actions instead (`<Input @escape-press={{action "foo"}} />`).');
}

['@test sends an action with `<Input @escape-press={{action "foo"}} />` when <escape> is pressed'](
assert
) {
Expand All @@ -773,31 +698,6 @@ moduleFor(
this.triggerEvent('keyup', { key: 'Escape' });
}

['@test [DEPRECATED] sends an action with `<Input @key-down="foo" />` when a key is pressed'](
assert
) {
assert.expect(4);

expectDeprecation(() => {
this.render(`<Input @key-down='foo' />`, {
actions: {
foo(value, event) {
assert.ok(true, 'action was triggered');
if (jQueryDisabled) {
assert.notOk(event.originalEvent, 'event is not a jQuery.Event');
} else {
assert.ok(event instanceof jQuery.Event, 'jQuery event was passed');
}
},
},
});
}, /Passing actions to components as strings \(like `({{input key-down="foo"}}|<Input @key-down="foo" \/>)`\) is deprecated\.|Passing the `@key-down` argument to <Input> is deprecated\./);

expectDeprecation(() => {
this.triggerEvent('keydown', { key: 'A' });
}, 'Passing actions to components as strings (like `<Input @key-down="foo" />`) is deprecated. Please use closure actions instead (`<Input @key-down={{action "foo"}} />`).');
}

['@test [DEPRECATED] sends an action with `<Input @key-down={{action "foo"}} />` when a key is pressed'](
assert
) {
Expand Down Expand Up @@ -828,31 +728,6 @@ moduleFor(
assert.equal(triggered, 1, 'The action was triggered exactly once');
}

['@test [DEPRECATED] sends an action with `<Input @key-up="foo" />` when a key is pressed'](
assert
) {
assert.expect(4);

expectDeprecation(() => {
this.render(`<Input @key-up='foo' />`, {
actions: {
foo(value, event) {
assert.ok(true, 'action was triggered');
if (jQueryDisabled) {
assert.notOk(event.originalEvent, 'event is not a jQuery.Event');
} else {
assert.ok(event instanceof jQuery.Event, 'jQuery event was passed');
}
},
},
});
}, /Passing actions to components as strings \(like `({{input key-up="foo"}}|<Input @key-up="foo" \/>)`\) is deprecated\.|Passing the `@key-up` argument to <Input> is deprecated\./);

expectDeprecation(() => {
this.triggerEvent('keyup', { key: 'A' });
}, 'Passing actions to components as strings (like `<Input @key-up="foo" />`) is deprecated. Please use closure actions instead (`<Input @key-up={{action "foo"}} />`).');
}

['@test [DEPRECATED] sends an action with `<Input @key-up={{action "foo"}} />` when a key is pressed'](
assert
) {
Expand Down
Loading

0 comments on commit 6233490

Please sign in to comment.