Components using text-support mixin do not work native class actions correctly

[chriskrycho]

A simple reproduction:

import Component from '@glimmer/component'; // could be @ember/component also
import { action } from '@ember/object';

export default class MyComponent extends Component {
  @action onFocus() {
    console.log('this never gets hit');
  }
}

<Textarea @focus-in={{this.onFocus}} />

It does work if you instead invoke—

• with {{fn}}:

  <Textarea @focus-in={{fn this.onFocus}} />

• with {{action}}:

  <Textarea @focus-in={{action this.onFocus}} />

• with {{action}} and a string name:

  <Textarea @focus-in={{action "onFocus"}} />

The problem is here:

ember.js/packages/@ember/-internals/views/lib/mixins/text_support.js

Lines 309 to 327 in 8cf2995

	let actionName = get(view, `attrs.${eventName}`) || get(view, eventName);
	let value = get(view, 'value');
	if (SEND_ACTION && typeof actionName === 'string') {
	let message = `Passing actions to components as strings (like \`<Input @${eventName}="${actionName}" />\`) is deprecated. Please use closure actions instead (\`<Input @${eventName}={{action "${actionName}"}} />\`).`;
	deprecate(message, false, {
	id: 'ember-component.send-action',
	until: '4.0.0',
	url: 'https://emberjs.com/deprecations/v3.x#toc_ember-component-send-action',
	});
	view.triggerAction({
	action: actionName,
	actionContext: [value, event],
	});
	} else if (typeof actionName === 'function') {
	actionName(value, event);
	}

The key is that we look up the value from attrs first, and attrs always ends up with arguments wrapped in MutableCell (to support two-way binding), so the check whether typeof the action is "function" always fails (it's "object" instead). There is special handling for {{action}} and {{fn}} so they don't have this, which is why using them works.

We need to make sure we explicitly handle the case where the item is a MutableCell, and having done so we'll be able to correctly "fallback" for normal method-style actions.

cc. @rwjblue. I'll try to have a PR up for this tomorrow morning, with a test for the failure case and a fix.

[rwjblue]

Thanks for reporting! When you work on the PR, can you add tests for both {{input and {{textarea (and their angle cousins)?

[chriskrycho]

Will do!