chainlist / svelte-forms

Svelte forms validation made easy

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

[BUG] First example in the documentation does not work

alexspurling opened this issue · comments

In the first example in the documentation of a simple form, the input field is considered to be valid on first load even though no value exists in the field.

I have slightly adapted the first example to demonstrate the problem:

https://svelte.dev/repl/7aca3afc2c374c7e9c143e773fbdc0ef?version=3.53.1

I would expect the form to show "Form valid: false". Instead it says "Form valid: true"

Screenshot from 2022-11-18 10-17-35

I am using version 2.3.1 of svelte-forms.

It seems that validation is only triggered when all fields are dirty.

Unfortunately, that's too late and you could submit an invalid form with empty but required fields.

Big bug actually. I really don't know how about anyone didn't care about it.

Not a fix, but a good workaround is:

import { onMount } from "svelte";

onMount(() => { myForm.validate() })

This makes the Form work properly.

Add { checkOnInit: true } as the last argument to any of the fields used in the form:

export const name = field('name', '', [required()], {
  checkOnInit: true
})

export const accountForm = form(name)