Where is this value defined - "(action (mut foo) true)"?

Question

On the surface this is a question about ember-cp-validations but really it's about the action (mut foo) construct. I have read the release notes for when that was first introduced but it doesn't address the issue I'm raising here.

In an Ember.js template, when using ember-cp-validations, you can execute validations and control the display of the relevant error message like this .

When focus-out fires a property showFirstNameError is updated. That property is subsequently used to control the display or otherwise of the error message.

This works perfectly well and is consistent with the ember-cp-validation demo.

But where is the property showFirstNameError actually defined ? I was expecting it be part of the validations property or in some way part of the component, controller or route but I can't find.

Can anyone help me with this please ?

Answer 1

I don't believe it needs to be defined anywhere. In this context it can just be undefined because its only purpose is to be a flag value so we don't show the error div. When the component is created and rendered that property is undefined and it serves its purpose by being a falsy value. When the focus out event fires, it sets that property to true like you said and thus the flag has been flipped.

If you're trying to be nice and make things explicit you can set the value to null or undefined on the component itself so this sort of situation doesn't confuse the next person:

import Component from '@ember/component';

export default Component.extend({

  showFirstNameError: undefined,

});