Result object is undefined, throwing an Error doesn't fire onError.

[SzymanskiFilip]

Hello, as I don't want to create a new Issue because this error is unexpected I decided to ask for help here.

Suddenly after adding a new feature my actions do not return a result object.
Is there anything I should be aware of when using next-safe-action which may cause this issue?

Excuse my mistakes if any, this is my first time asking for help on GitHub.
Thanks in advance :)

Typescript: 5.4
next-safe-action: ^7.1.3
NextJS: 14.2.4

Action Client:

export const authenticatedAction = createSafeActionClient({
  handleReturnedServerError(e) {
    if (e instanceof CustomError) {
      return e.message;
    }
    return e.message;
  },
  defineMetadataSchema() {
    return z.object({
      actionName: z.string(),
    });
  },
}).use(async ({ next }) => {
  const { user } = await validateRequest();
  if (!user) {
    throw new Error("Unauthenticated");
  }

  const result = await next({ ctx: { userId: user.id } });
  return result;
}); 

Action (annotated with 'use server') :

const schema = zfd.formData({
  email: zfd.text(z.string().email()),
  password: zfd.text(z.string()),
});
export const loginUser = actionClient
  .metadata({ actionName: "loginUser" })
  .schema(schema)
  .action(async ({ parsedInput: { email, password } }) => {
    await new Promise((resolve) => setTimeout(resolve, 1000));
    console.log(email + " " + password);
    console.log("auth");

    const existingUser = await db.query.users.findFirst({
      where: eq(users.email, email.toLowerCase()),
    });

    if (existingUser === undefined) {
      console.log("no user");
      return {
        failure: "Invalid E-Mail or Password.",
      };
    }

    /* other code for auth, not needed, as the console.log('no user') gets invoked */

    return redirect("/");
  });

Login form (annotated with 'use client'):

const { execute, result, status } = useAction(loginUser, {
    onSuccess: () => {
      console.log("succes " + result);
    },
  });

and form

<form
  onSubmit={async (e) => {
    e.preventDefault();
    const form = e.currentTarget as HTMLFormElement;
    const formData = new FormData(form);

    execute(formData);
  }}
>
  <div className="grid w-full items-center gap-2">
    <div className="flex flex-col space-y-1">
      <Label htmlFor="name">E-Mail</Label>
      <Input id="email" name="email" placeholder="Your E-Mail." />
    </div>
    <div className="flex flex-col space-y-1">
      <Label htmlFor="name">Password</Label>
      <Input
        id="password"
        name="password"
        placeholder="Your Password."
        type="password"
      />
    </div>
    {result.validationErrors?.password && (
      <p className="text-sm text-red-400">{result.validationErrors._errors}</p>
    )}
    {result.serverError && <p>{result.serverError.toString()}</p>}
    {result.data?.failure && (
      <p className="text-sm text-red-400">{result.data?.failure}</p>
    )}

    <Button
      className="w-full mt-1"
      type="submit"
      disabled={status === "executing"}
    >
      {status !== "executing" && "Sign In"}
      {status === "executing" && (
        <span className="flex flex-row items-center justify-center gap-1">
          <Spinner color="default" labelColor="foreground" size="sm" />
          Loading
        </span>
      )}
    </Button>

    <p className="text-xs text-muted-foreground text-center">
      Don&apos;t have an Account yet? /{" "}
      <NextUILink href="/register" underline="hover" className="text-xs">
        Register Here!
      </NextUILink>
    </p>

    <p className="text-xs text-muted-foreground text-center">
      Forgot Password? /{" "}
      <NextUILink href="/reset-password" underline="hover" className="text-xs">
        Click here!
      </NextUILink>
    </p>
  </div>

  <div className="relative mt-4 mb-4">
    <div className="absolute inset-0 flex items-center">
      <span className="w-full border-t" />
    </div>
    <div className="relative flex justify-center text-xs uppercase">
      <span className="bg-card px-2 text-muted-foreground">
        Or continue with
      </span>
    </div>
  </div>
</form>;

[SzymanskiFilip]

Found the fix to the issue.

If your action doesn't return the result, even though you can see it when logging in action middleware.
Check if you are using the middleware (the NextJS middleware, not the next-safe-action middleware) correctly.

In my case it was setting the response headers in a wrong way. Fixing this, fixed the error. :)