sveltejs / sveltejs/kit

implement a global 'hook' for actions

Open
#13,474 1 comment 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

needs-decision
Dominant language
JavaScript
Stars
20.8k
Forks
2.3k
Avg merge
1d 16h
Merged PRs (30d)
156

Description

Describe the problem

I have some error handling logic which gets reused in practically every action, however there is currently no great way to reuse it.

Most of my actions look something like this:

export const actions = {
	async default(event) {
		const req: MyRequestType = await getFormData(event);
		const client = new RpcClient(event.locals.transport);

                let response;
		try {
			response = await client.createSomething(req);
		} catch (err) {
                        // common error handling here
                        if (err instanceof RpcError) {
                           return fail(400);
                        }

                        // fallback for unknown errors
                        return fail(500);
		}

		redirect(303, `/thing/${response.id}`);
	}
};

I've simplified the handling a bit, but you get the idea - for most requests everything inside the catch block is the same.

Currently, the best way I have come up with to handle this case is to wrap every action with an error handler method.

export const actions = {
	default: errorHandler(async (event) => {
		const req: MyRequestType = await getFormData(event);
		const client = new RpcClient(event.locals.transport);

		const response = await client.createSomething(req);

		redirect(303, `/thing/${response.id}`);
	})
};

function errorHandler<H extends (event: E) => Promise<T>, E, T>(
	handler: H
): (event: E) => Promise<T | ActionFailure> {
	return async (event: E) => {
		try {
			return await handler(event);
		} catch (err) {
			if (isRedirect(err)) throw err;

                        // common error handling here
                        if (err instanceof RpcError) {
                           return fail(400);
                        }

                        // fallback for unknown errors
                        return fail(500);
		}
	};
}

This solution works, but requires me to wrap every action with errorHandler and I'm not sure if i will run into a problem with the types at some point.

Describe the proposed solution

I would like to see something like the handle function in hooks.server.ts which could transform the response from any action. I would put my error handling logic in this handle so it applies to every action without having to remember to wrap everything with errorHandler.

Alternatives considered

Actions already use the handle from hooks.server.ts, however that handle requires that I return a Response so I loose the ability to use fail and progressively enhance forms.

Importance

would make my life easier

Additional Information

No response

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reading the handle function in hooks.server.ts and the existing action handling described in the issue, including how fail and progressively enhanced forms are processed. Determine whether a global action hook can preserve action failures while transforming errors consistently; done means the behavior applies to every action without per-action wrappers and does not interfere with redirects.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, typescript
Domain
backend, web-dev
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.