HMR and forms

[tiagoapp]

Is there any way to keep form data in place with Svelte's HMR?

I notice that a simple change on any element will just wipe all the forms content... even with @hmr:keep-all in place.

[dominikg]

Without code it's hard to tell. You may be misusing keep-all or something else is triggering it to be overwritten after the update.

keep-all might not be the best experience for all changes and you have to use it carefully and keep it in mind while developing that updates may leave you in an inconsistent state: https://github.com/sveltejs/svelte-hmr/tree/master/packages/svelte-hmr#preservation-of-local-state

[tiagoapp]

Thanks. Figure out this seems to be related to the Svelte Forms library.

This works

let something: string = ""; // @hrm:keep
<input bind:value={something} />
<p>change something here and the input will stay</p>

But when using something like svelte-forms it loses the state

const name = field('name', '', [required()]);  // @hrm:keep
const myForm = form(name);
<input type="text" bind:value={$name.value} />
<p>change something here and the input will reset</p>

[tiagoapp]

Actually it seems a simple object is enough for it to reset it?

this is fine

let something: string = ""; // @hrm:keep
<input bind:value={something} />
<p>change something here and the input will stay</p>

this will reset

let something = { // tried @hrm:keep on both lines
    else: "hello"
}
<input bind:value={something.else} />
<p>change something here and the input will reset</p>

Is there any way to persist those?

[MentalGear]

Also, you might want to consider writing GUI form tests (using playwright) instead of typing test data into forms all over again.