Allow number or boolean form fields to use .as('hidden')

[cofl]

Describe the problem

Only string form fields can use .as('hidden', initial). Number fields cannot use that type.

Describe the proposed solution

Allowing number fields to be .as('hidden'). While we're here, also allowing boolean fields, since there is special-case handling for those.

Alternatives considered

Changing my validation schema and backend API routes to return and accept string IDs instead of numeric IDs.

Importance

nice to have

Additional Information

I have a proof-of-concept implementation here: 0704908...cofl:sveltekit:main

[sillvva]

Your alternative is the correct approach. Sveltekit only handles logical conversions like checkbox to boolean or number to number. It leaves the rest to standard form behavior.

[cofl]

I disagree. Numeric IDs are relatively common as hidden fields (MDN even uses one in their example). If SvelteKit is going to break standard form behavior to provide special-casing for some kinds of input types to make life easier for developers, it doesn't make for it to selectively apply where those types can be used.

As I understand it, that's the entire point n: and b: name prefixes were added, so we could field.set(5); v.number() and field.set(true); v.boolean() instead of field.set(5.toString()); v.pipe(v.string(), v.transform(Number)) and field.set(true && 'on'); v.pipe(v.string(), v.transform(a => a === 'on')).

[sillvva]

People use numeric ids in hidden inputs, yes. But hidden inputs always submit as a string.

MDN also points this out:
https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input/hidden#value

The element's value attribute holds a string that contains the hidden data you want to include when the form is submitted to the server.

https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input/hidden#technical_summary
Value | A string representing the value of the hidden data you want to pass back to the server.

[sillvva]

The reason why Sveltekit can confidently convert number inputs to numbers or (single) checkbox inputs to booleans, is because that is how they are used.

Standard Schema does not provide any information about your schema except to TypeScript. Sveltekit therefore cannot know whether the field you're using as a hidden input is a number, a string, or some other type and therefore cannot confidently make a conversion at runtime.

[cofl]

But hidden inputs always submit as a string.

type="checkbox" also always submits as a string, even when single: https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input/checkbox#value

SvelteKit's assumption that all single checkboxes are booleans is not valid. A common-case exception to the standard has been made, with another exception to return to the default behavior.

because that is how they are used

And here, that's how type="hidden" is being used: as a number.

Sveltekit therefore cannot know whether the field you're using as a hidden input is a number, a string, or some other type and therefore cannot confidently make a conversion at runtime.

It absolutely can, as evidenced by the attached proof-of-concept. The correct prefix can be pulled from the initial value, and will be type-checked if that's available. Kit doesn't do anything to prevent people from otherwise shooting themselves in the foot should the choose to forego typechecking. If using the type of the initial value is not desired, addition field types hidden number and hidden boolean could be added to fill the same role.

[cofl]

I realized just now my initial text didn't quite match what I intended; updated the title and description.

[cofl]

Here is an alternate implementation of this feature using hidden number and hidden boolean types instead of typeof input_value: 0704908...cofl:sveltekit:alt-impl

[sillvva]

Here is an alternate implementation of this feature using hidden number and hidden boolean types instead of typeof input_value: 0704908...cofl:sveltekit:alt-impl

This honestly makes a lot more sense to me. You're telling Sveltekit that this field will be a number/boolean and it will never be anything else.

[sillvva]

Another temporary alternative (beside schema transformation), is having a number or checkbox input hidden with display: none, which should still submit as long as it's not disabled.

Example: https://stackblitz.com/edit/sveltejs-kit-template-default-535kb9py?file=src%2Froutes%2F%2Bpage.svelte,src%2Froutes%2Ftest.remote.js

[cofl]

This honestly makes a lot more sense to me. You're telling Sveltekit that this field will be a number/boolean and it will never be anything else.

Type-wise it should know from the field being a RemoteFormField<number>. Having just the one hidden type is nice for devx, but I can understand it not being ideal.

[dummdidumm]

Another alternative: accept string as input in the schema but coerce to number and validate it's a number (you can do that within the schema definition)