Vaadin-combo-box: Застрял в недопустимом состоянии

Кажется, это ошибка в vaadin-text-field . vaadin-combo-box просто синхронизирует свойства required и invalid с внутренним vaadin-text-field .

Я думаю, что динамическое изменение состояния required (или других ограничений проверки) просто не учитывалось при разработке компонента.

При проверке учитываются required , pattern , maxlength и minlength . Если какой-либо из них установлен, то он устанавливает логическое значение invalid на основе возвращаемого значения checkValidity() для собственного <input> . Если ни один из них не установлен, вы все равно можете вручную установить invalid в true или false на основе вашей собственной логики, а vaadin-text-field сохраняет недопустимое состояние, как и было был установлен.

Проблема, похоже, заключается в том, что когда у вас установлено только одно из этих ограничений проверки (например, required ), и поле было проверено и стало недействительным, а затем вы удаляете ограничение, оно не запускается checkValidity() на собственном вводе и сохраняет состояние invalid (как если бы оно было добавлено вручную). Обычно текстовое поле никогда автоматически не удаляет состояние invalid когда нет активных ограничений проверки.

Я думаю, что правильной логикой здесь было бы наблюдение, когда любое из ограничений required , pattern , maxlength или minlength удаляется _and_ invalid == true уже, затем установите this.invalid = this.inputElement.checkValidity();

Это можно воспроизвести с помощью vaadin-text-field просто имея:

<vaadin-text-field required="{{tfRequired}}"></vaadin-text-field><br>
<label>Required <input type="checkbox" checked="{{tfRequired::change}}"></label>

1. установить флажок (делает текстовое поле обязательным)
2. сфокусировать и расфокусировать текстовое поле (делает его недействительным, поскольку оно все еще пустое)
3. снять флажок (делает текстовое поле необязательным)
4. напишите что-нибудь в текстовом поле и расфокусируйте его, обратите внимание, что текстовое поле по-прежнему отображается как недопустимое

Я открыл проблему по этому поводу здесь https://github.com/vaadin/vaadin-text-field/issues/400, но я оставлю эту проблему с полем со списком здесь для лучшей видимости, если кто-то еще заметит проблему с полем со списком. Это должно быть закрыто после того, как проблема с текстовым полем будет исправлена.

Это исправление выпущено в версиях vaadin-text-field v2.3.9 и v2.4.10 .

Я могу подтвердить, что теперь он работает, как ожидалось. Спасибо за хорошую работу, @Haprog! 😄

Кстати. afaik WebJars для vaadin-text-field v2.3.9 и v2.4.10 не работают, поэтому, если вам нужно использовать их из Java (Vaadin 10–13 или Vaadin 14 в режиме совместимости), вам нужно немного подождать. Мы должны вскоре выпустить v2.3.10 и v2.4.11 с работающими WebJars.