Why are types for export let errors always undefined?

[mattcroat]

I'm not sure if I'm using it as intended because it's only referenced in the documentation.

If validation errors are returned, they will be available inside +page.svelte as export let errors.

I only get undefined for the types.

<!-- +page.svelte -->

<script lang="ts">
  import type { Errors } from './$types'
  export let errors: Errors // undefined
</script>

// +page.server.ts

import type { Action } from './$types'

export const POST: Action = async ({ request, setHeaders }) => {
  if (!condition) {
    return {
      errors: { message: '💩' }
    }
  }
}

Despite the proper inference.

// $types.d.ts

// type Errors = { message: string } 👍️
export type Errors = Kit.AwaitedErrors<typeof import('./proxy+page.server.js').POST>

[williamviktorsson]

I hope this might be solved in #6469 with the transition to actions and also throwing rather than returning errors.

However my experience is the same for the errors object being undefined and I have been able to properly build the types for the errors object using the following steps:

1. Make sure the error object is always returned from my POST. If it is in a conditional, such as if the posted user credentials were wrong; it does not update.

2. run npx svelte-kit sync

3. restart vscode

These steps seem to be required on both TS and JSDoc typed projects.

[williamviktorsson]

I am experiencing the same errors after upgrading to [email protected] which implements #6469
The new ActionData object which replaced Errors is now always unknown.

See attached code for an example.

<!-- +page.svelte -->

<script lang="ts">
	import type { ActionData } from './$types';
	export let form: ActionData; //unknown
</script>

<form method="POST">
        <!-- ... -->
	{#if form?.message}            <!-- Property 'message' does not exist on type '{}' -->
		<p>{form.message}</p>  <!-- Property 'message' does not exist on type '{}' -->
	{/if}
</form>

// page.server.ts

import { redirect, invalid } from '@sveltejs/kit';
import type { Actions, PageServerLoad } from './$types';

export const actions: Actions = {
	default: async ({ request }) => {
		if (!condition) {
			return invalid(400, {
				message: 'Something went wrong',
				info: 'test'
			});
		}
	}
 }

[mattcroat]

Yeah, it doesn't work! 😔

[mattcroat]

SvelteKit introduced form actions replacing errors with form that had the same problem but is now resolved after #6748.