Rethink WebAuthnStrategy.generateOptions

[KubaJastrz]

Remix is planning to release Single Fetch functionality soon. It changes how the loader/action return values work, which makes remix-auth-webauthn incompatible with the current state of things.

Perhaps this is only temporary bug, but I'm encountering a problem with this code:

export const loader = async ({ request }) => {
	const user = await getUser(request);
	return webAuthnStrategy.generateOptions(request, sessionStorage, user);
}

I'm suspecting this is because webAuthnStrategy.generateOptions returns json response, although it should still technically work with the Single Fetch API.

My current workaround is as following:

export const loader = async ({ request, response }) => {
  const user = await getUser(request);
  const webAuthnResponse = await webAuthnStrategy.generateOptions(
    request,
    authSessionStorage,
    user
  );

  if (response) {
    webAuthnResponse.headers.forEach((value, key) => {
      response.headers.append(key, value);
    });
  }

  return webAuthnResponse.json();
};

Which looks kinda crazy, but works :D

[KubaJastrz]

Apparently this might be caused by vercel/remix#109

Edit: nevermind, seems unrelated

[KubaJastrz]

It's also not playing well with the defineLoader helper. Not that it needs to, but just throwing it out there.

import { unstable_defineLoader as defineLoader } from "@remix-run/node";

export const loader = defineLoader(async ({ request }) => {
  const user = await getUser(request);

  return webAuthnStrategy.generateOptions(
    request,
    authSessionStorage,
    user
  );
});

Argument of type '({ request }: LoaderArgs) => Promise<TypedResponse<WebAuthnOptionsResponse & { extra: unknown; }>>' is not assignable to parameter of type 'Loader'.
  Type 'Promise<TypedResponse<WebAuthnOptionsResponse & { extra: unknown; }>>' is not assignable to type 'MaybePromise<DataFunctionReturnValue>'.
    Type 'Promise<TypedResponse<WebAuthnOptionsResponse & { extra: unknown; }>>' is not assignable to type '{ [key: string]: Serializable; [key: number]: Serializable; [key: symbol]: Serializable; } | Map<Serializable, Serializable> | Set<...> | Promise<...> | Promise<...>'.
      Type 'Promise<TypedResponse<WebAuthnOptionsResponse & { extra: unknown; }>>' is not assignable to type 'Promise<Serializable>'.
        Type 'TypedResponse<WebAuthnOptionsResponse & { extra: unknown; }>' is not assignable to type 'Serializable'.
          Type 'TypedResponse<WebAuthnOptionsResponse & { extra: unknown; }>' is not assignable to type '{ [key: string]: Serializable; [key: number]: Serializable; [key: symbol]: Serializable; }'.
            Property 'text' is incompatible with index signature.
              Type '() => Promise<string>' is not assignable to type 'Serializable'.ts(2345)