Freezed value in Input

[romanichbelkov]

Hello! I've got some bug with changing value in text Input. If i init changeset with model that already have value in "name" field, then clear "name" field from that value and try to type this value again - field will freeze, and i will not be able to change it. Looks like changeset don't want me to type same old value. But this is not good behaviour, right? Please, help!

Component.js

import Component from '@glimmer/component';
import { tracked } from '@glimmer/tracking';
import { action } from '@ember/object';

import { Changeset } from 'ember-changeset';
import lookupValidator from 'ember-changeset-validations';
import { validatePresence } from 'ember-changeset-validations/validators';

const validations = {
  name: validatePresence({
    presence: true,
    message: 'Заполните поле'
  })
};

export default class AddressBookForm extends Component {

  @tracked formChangeset = null

  constructor() {
    super(...arguments);

    this.formChangeset = new Changeset(this.args.model, lookupValidator(validations), validations);
  }

  @action
  onBlur(fieldName) {
    this.formChangeset.validate(fieldName);
  }

  @action
  async onSubmit(event) {
    event.preventDefault();

    await this.formChangeset.validate();

    const isInvalid = this.formChangeset.get('isInvalid');

    if (isInvalid) {
      return;
    }

    this.args.onSave(this.formChangeset);
  }
}

Template.hbs

<form class="form">
  <fieldset class="fieldset">
    <div data-test-address-book-name-field class="form-control-container">
      <label for="address-book-name" class="form-label form-label_required">
        Название
      </label>

      <Input
        id="address-book-name"
        class="form-control form-control_small {{if (get formChangeset.error.name 'validation') 'is-invalid' ''}}"
        @type="text"
        @value={{formChangeset.name}}
        @focus-out={{action "onBlur" "name"}}
      />

      <span class="invalid-feedback">
        {{get formChangeset.error.name "validation"}}
      </span>
    </div>
  </fieldset>

  <button
    data-test-submit
    class="btn btn-primary"
    disabled={{@isSubmitting}}
    {{on "click" onSubmit}}
  >
    {{#if @isSubmitting}}
      Сохранение...
    {{else}}
      Сохранить
    {{/if}}
  </button>
</form>

[snewcomer]

👋 Thanks for the issue! I'm not able to reproduce this btw. What version are you on of ember-changeset-validations, ember-changeset and validated-changeset?

https://github.com/poteto/ember-changeset-validations/pull/313

[romanichbelkov]

Thank you for answer!

"ember-changeset": "^3.10.5",
"ember-changeset-validations": "^3.10.3",

In my package.json there is no validated-changeset

[romanichbelkov]

I see that you created some tests for my case. They have failed, is this ok?

[romanichbelkov]

By the way, there is model for changeset i used:

import Model, { attr } from '@ember-data/model';

export default class AddressBookModel extends Model {
  @attr('string') name
  @attr('date') created_at
  @attr('number') contacts_count
}

[romanichbelkov]

👋 Thanks for the issue! I'm not able to reproduce this btw. What version are you on of ember-changeset-validations, ember-changeset and validated-changeset?

313

Hello?