Certain inputs don't cause unobtrusive validation

[Bond-Addict]

Vuestic-ui version: 1.7.3

Steps to reproduce Can be seen when clicking stepper button.

https://codesandbox.io/p/sandbox/nice-darwin-iqjx2m What is the expected behavior? When you click in the input and then click out, validation should be fired. What is the current behavior? VaInput (Step 1) and VaDateInput (Step 2) do not fire validation at the very least.

VaSelect (Step 3) functions as expected still.

[m0ksem]

Is it still relevant in 1.8.0?

[Bond-Addict]

Ya, it used to fire validation on blur, but now it only fires when clicking next

[Bond-Addict]

@m0ksem this is still relevant in 1.8.1 and is causing a lot of issues in our application. https://codesandbox.io/p/sandbox/frosty-river-l9nhng?file=%2Fsrc%2Fcomponents%2FChipSelect.vue%3A42%2C54

[Bond-Addict]

@m0ksem I just checked in 1.8.2 and this is still an issue

[m0ksem]

@m0ksem this is still relevant in 1.8.1 and is causing a lot of issues in our application. codesandbox.io/p/sandbox/frosty-river-l9nhng?file=%2Fsrc%2Fcomponents%2FChipSelect.vue%3A42%2C54

I completely missed it. Sorry.

[Bond-Addict]

That's okay. Thanks for getting it on your radar now.

[m0ksem]

@Bond-Addict, what do you mean by "VaInput (Step 1) and VaDateInput (Step 2) do not fire validation at the very least."?

I took your example and it seems to be working fine?

Except Input becomes enormous...

https://codesandbox.io/p/sandbox/reverent-austin-ts5s7g?file=/src/views/Stepper.vue:23,23

[Bond-Addict]

Hey sorry, I need to update the info here. It's specifically with form fields with rules. When you hit the landing page you will see a chip select and it is required and the form is not using the immediate property. In spite of missing the immediate property, the form field is immediately marked as invalid. It should not make as invalid until the form input has been opened or clicked inside and left.

This was the behavior up until 1.8.0 I think. It's still an issue in 1.8.3

Specifically you want to check https://codesandbox.io/p/sandbox/nice-darwin-iqjx2m

To see what the issue is.

[m0ksem]

Hey sorry, I need to update the info here. It's specifically with form fields with rules. When you hit the landing page you will see a chip select and it is required and the form is not using the immediate property. In spite of missing the immediate property, the form field is immediately marked as invalid. It should not make as invalid until the form input has been opened or clicked inside and left.

This was the behavior up until 1.8.0 I think. It's still an issue in 1.8.3

Specifically you want to check codesandbox.io/p/sandbox/nice-darwin-iqjx2m

To see what the issue is.

Doesn't it because you change value manually in ChipSelect.vue?

onMounted(() => {
  state.currentChips = props.currentChips;
});

Because model-value is changed, select performs validation – doesn't matter if it is caused by user or programmatically.

https://codesandbox.io/p/sandbox/nifty-sunset-8w7hzm?file=/src/components/ChipSelect.vue:19,1

[Bond-Addict]

Hey sorry, I need to update the info here. It's specifically with form fields with rules. When you hit the landing page you will see a chip select and it is required and the form is not using the immediate property. In spite of missing the immediate property, the form field is immediately marked as invalid. It should not make as invalid until the form input has been opened or clicked inside and left. This was the behavior up until 1.8.0 I think. It's still an issue in 1.8.3 Specifically you want to check codesandbox.io/p/sandbox/nice-darwin-iqjx2m To see what the issue is.

Doesn't it because you change value manually in ChipSelect.vue?

onMounted(() => {
  state.currentChips = props.currentChips;
});

Because model-value is changed, select performs validation – doesn't matter if it is caused by user or programmatically.

https://codesandbox.io/p/sandbox/nifty-sunset-8w7hzm?file=/src/components/ChipSelect.vue:19,1

After reviewing this I figured out how to resolve it. It was working differently before, but I assume that wasnt the intended behavior. I changed the lifecycle hook to onBeforeMount and it loads my values and doesnt immediately trigger validation.