Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Remove leftover two-way binding of form element's @value argument #1097

Merged
merged 4 commits into from Jun 12, 2020

Conversation

basz
Copy link
Contributor

@basz basz commented Jun 1, 2020

I've noticed some issues when I use form in combination with models wrapped in ember-changeset changesets.

When I have a Changeset that has a model of

{
  propertyPath: aNonPrimitiveValue
 }

And a custom element that calls this.onUpdate(newValue) the changes appear to propagate into the changeset correctly, (changeset.changes has the changes) but unfortunately the new value is not transmitted back into the control on subsequent edits of the value. (It works only once)

You can see this behavior in ember.bushbaby.nl...

After much trial and error I have found out the element creates a dynamic property and aliases it to model.${this.property} and that seems to be the culprit. I think it is the alias that does not work as reliably...

I have created this PR to avoid dynamic assignment and aliasing. In my code base, my forms now work as expected... It is my hope it will make the 4.0 release.

also see #1089 for some discussion about two-way binding.

@jelhan jelhan added the breaking label Jun 1, 2020
Copy link
Contributor

@jelhan jelhan left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good to me. Thanks for providing this pull request.

@simonihmig Is dropping support for two-way binding of @value on <BsForm::Element> fine with you? This is also a prerequirement to rewrite it as a glimmer component.


set value(value) {
this._value = value;
}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Wondering if Ember Bootstrap sets value itself or if the setter is only needed to support @value argument until the component is refactored to @glimmer/component. In the latter case I would move the assertion that not @value and @property could not be set at the same time to this setter. It would make it a little bit easier to follow the code in my opinion.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's the latter, and yes, I agree.

Copy link
Contributor

@simonihmig simonihmig left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks @basz, the changes look fine. If you are able to address the little suggestion, that would be awesome!

Is dropping support for two-way binding of @value on BsForm::Element fine with you?

Absolutely! Tbh I wasn't aware we still had this around, as I never really used @value myself. This looks like a stupid left over from "ancient" times where we still had two-way bindings...


set value(value) {
this._value = value;
}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's the latter, and yes, I agree.

@simonihmig simonihmig mentioned this pull request Jun 2, 2020
@simonihmig simonihmig changed the title avoid alias and/or dynamic property definition Remove leftover two-way binding of form element's @value argument Jun 2, 2020
@simonihmig simonihmig added the bug label Jun 2, 2020
Copy link
Contributor

@jelhan jelhan left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just noticed that documentation needs to be updated as well. At least the API docs for @value as they explicitly state that the value is also set.

The value of the control element is bound to this property. You can bind it to some controller property to get/set the control element's value:

It might be helpful to explicitly state that it's a one-way binding cause the combination of @model and @property are essentially a two-way binding.

@basz
Copy link
Contributor Author

basz commented Jun 3, 2020

@jelhan I'm not sure what you want the PI docs to say here...

I have noticed it's two way bounded when an <Input @value=.../> is used... Which is by default for regular types... (text, email, etc). That is something the build-in input component does. I've pulled my hair a few times before I realised that. That thing is not Data Down Actions Up atm...

@jelhan
Copy link
Contributor

jelhan commented Jun 3, 2020

I have noticed it's two way bounded when an <Input @value=.../> is used... Which is by default for regular types... (text, email, etc).

I'm not sure what you are referring to. As far as I'm aware we don't use <Input> in Ember Bootstrap. Do we?

To be honest I think <Input>, <Textarea> and these built-in components should be deprecated cause their two-way bindings is confusing. But there doesn't seem to be a consensus for that yet. If I recall correctly the argument was that we need some built-in {{set}} helper before we can deprecate that ones to provide a good upgrade path.

@basz
Copy link
Contributor Author

basz commented Jun 3, 2020

No we don’t. Sorry for that...

@basz
Copy link
Contributor Author

basz commented Jun 3, 2020

Agree that should be deprecated or refactored

@basz
Copy link
Contributor Author

basz commented Jun 3, 2020

Can you write that api doc? I’ll put it in the PR

@simonihmig
Copy link
Contributor

I'll merge this now, and file a API docs PR separately. Thanks @basz for your work here!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants