Programmatic preflight `validate()` after setting form inputs

[hyunbinseo]

Describe the problem

This form is validated on every input with a preflight schema:

<script lang="ts">
  import { object, pipe, string, uuid } from 'valibot';
  import { addId } from './data.remote';
</script>

<form
  {...addId.preflight(object({ uuid: pipe(string(), uuid()) }))}
  oninput={() => addId.validate()}
>
  <input {...addId.fields.uuid.as('text')} />
  <!-- eslint-disable-next-line svelte/require-each-key -->
  {#each addId.fields.uuid.issues() ?? [] as issue}
    <p>{issue.message}</p>
  {/each}
  <button
    type="button"
    onclick={() => {
      addId.fields.uuid.set(self.crypto.randomUUID());
      addId.validate(); // this does not work
    }}
  >
    Generate
  </button>
</form>

1. Manually entering '123' in the input - issue is shown
2. Setting the input programmatically - issue is still shown

Having to await tick() in-between these lines seem counter-intuitive.

addId.fields.uuid.set(self.crypto.randomUUID());
await tick(); // this works
addId.validate();

Describe the proposed solution

I hope this works:

addId.fields.uuid.set(self.crypto.randomUUID());
addId.validate();

Or maybe, the docs should mention manually triggering an input event and propagating it?

Alternatives considered

No response

Importance

would make my life easier

Additional Information

No response