Remix Error: You defined an action for route "routes/" but didn't return anything from your action function

Question

I am using Remix for my project and I am currently getting this error:

Error: You defined an action for route "routes/demo" but didn't return anything from your action function. Please return a value or null.

The error message sounds quite straight forward, but I can't put a return when I am already throwing an error. I noticed this happen when name is John.

But this is a mock of my action code:

export async function action({ request }: ActionFunctionArgs) {
  const formData = await request.formData();
  try {
    if (formData.get(“name”) === “John”) {
      throw new Response(“Name is not allowed”, { status: 400 });
    }
    return { success: true }
  } catch (e) {
    console.log(e);
  }
}

Answer 1

You need to include a return in your catch block. Whenever the name is equal to John, the code gets handed over to the catch block (which doesn't have a return), that's why you are getting the error.

This:

export async function action({ request }: ActionFunctionArgs) {
const formData = await request.formData();
  try {
       if (formData.get(“name”) === “John”) {
      throw new Response(“Name is not allowed”, { status: 400 });
    }
  } catch (e) {
    console.log(e);
    return {error:{message:"Error"}} // return null or whatever value you would like to return 

  }
}