.invalid-feedback still appears on valid elements
Created by: charles-toller
I'm running Windows 10 15063.540 with Chrome 60.0.3112.90.
.invalid-feedback does correctly appear when the class .is-invalid or :invalid is applied to the input element, but it also appears when .is-valid or :valid is applied to the input. From forms.scss:26:
.form-control,
.custom-select {
.was-validated &:#{$state},
&.is-#{$state} {
border-color: $color;
&:focus {
box-shadow: 0 0 0 .2rem rgba($color,.25);
}
~ .invalid-feedback,
~ .invalid-tooltip {
display: block;
}
}
}
It appears that the display: block is applied no matter what $state actually is.