github-starred/better-auth
2
0
Fork 0
mirror of https://github.com/better-auth/better-auth.git synced 2026-05-22 22:32:01 -05:00
Code Issues 2.5k Packages Projects Releases 112 Wiki Activity

[GH-ISSUE #750] Error verifying the backup code #8410

New Issue
Closed
opened 2026-04-13 03:28:44 -05:00 by GiteaMirror · 3 comments
GiteaMirror commented 2026-04-13 03:28:44 -05:00
Owner
Copy Link

Originally created by @MarcosHelbert on GitHub (Dec 3, 2024).
Original GitHub issue: https://github.com/better-auth/better-auth/issues/750

Describe the bug
There is an error that occurs while verifying a backup code. The error message appears as "TypeError Cannot read properties of undefined (reading 'token')". The application is using Prisma with PostgreSQL database.

To Reproduce

"use client";

import { Dispatch, SetStateAction, useEffect, useTransition } from "react";
import { BackupCodeSchema } from "@/schemas/auth/backup-code-schema";
import { zodResolver } from "@hookform/resolvers/zod";
import { useForm } from "react-hook-form";
import { z } from "zod";

import { authClient } from "@/lib/auth/client";
import { useIsClient } from "@/hooks/use-is-client";
import { toast } from "@/hooks/use-toast";
import {
    Form,
    FormControl,
    FormField,
    FormItem,
    FormLabel,
    FormMessage,
} from "@/components/ui/shadcn/form";
import { Input } from "@/components/ui/shadcn/input";

import { AuthButton } from "../form-components/auth-button";

type BackupCodeFormProps = {
    setPending: Dispatch<SetStateAction<boolean>>;
};

export function BackupCodeForm({ setPending }: BackupCodeFormProps) {
    const isClient = useIsClient();
    const [isPending, startTransition] = useTransition();

    useEffect(() => {
        setPending(isPending);
    }, [isPending]);

    const form = useForm<z.infer<typeof BackupCodeSchema>>({
        resolver: zodResolver(BackupCodeSchema),
        defaultValues: {
            backupCode: "",
        },
    });

    const onSubmit = form.handleSubmit((data: z.infer<typeof BackupCodeSchema>) => {
        startTransition(async () => {
            try {
                await authClient.twoFactor.verifyBackupCode({
                    code: data.backupCode,
                    fetchOptions: {
                        onError(ctx) {
                            if (ctx.error.code === "INVALID_BACKUP_CODE") {
                                form.setError("backupCode", {
                                    message: "Invalid backup code",
                                });
                                return;
                            }

                            if (ctx.error.code === "INVALID_TWO_FACTOR_COOKIE") {
                                toast({
                                    title: "Invalid Two-Factor Token",
                                    description: "Your session has expired. Please log in again.",
                                });
                                return;
                            }

                            throw new Error(ctx.error?.message);
                        },
                        onSuccess(ctx) {
                            console.log(ctx);
                        },
                    },
                });
            } catch (error) {
                toast({
                    title: "Backup Code Error",
                    description:
                        "There was an issue with the backup code. Please check and try again.",
                });
            }
        });
    });

    return (
        <Form {...form}>
            <form className="grid w-full gap-2" onSubmit={onSubmit}>
                <FormField
                    control={form.control}
                    name="backupCode"
                    render={({ field }) => (
                        <FormItem className="flex flex-col items-center gap-3 space-y-0 pt-1.5">
                            <FormLabel htmlFor="backupCode" className="text-center">
                                backup code
                            </FormLabel>
                            <FormControl>
                                <Input
                                    id="backupCode"
                                    type="text"
                                    disabled={isPending}
                                    placeholder="XXXXX-XXXXX"
                                    className="text-center"
                                    {...field}
                                    pattern="[a-z0-9]{5}-[a-z0-9]{5}"
                                />
                            </FormControl>
                            <FormMessage />
                        </FormItem>
                    )}
                />
                <AuthButton isPending={isPending}>Verify Code</AuthButton>
            </form>
        </Form>
    );
}

Expected behavior
When a user submits a valid backup code, it should execute what's inside success and redirect.

Screenshots
image

Originally created by @MarcosHelbert on GitHub (Dec 3, 2024). Original GitHub issue: https://github.com/better-auth/better-auth/issues/750 **Describe the bug** There is an error that occurs while verifying a backup code. The error message appears as "TypeError Cannot read properties of undefined (reading 'token')". The application is using Prisma with PostgreSQL database. **To Reproduce** ```tsx "use client"; import { Dispatch, SetStateAction, useEffect, useTransition } from "react"; import { BackupCodeSchema } from "@/schemas/auth/backup-code-schema"; import { zodResolver } from "@hookform/resolvers/zod"; import { useForm } from "react-hook-form"; import { z } from "zod"; import { authClient } from "@/lib/auth/client"; import { useIsClient } from "@/hooks/use-is-client"; import { toast } from "@/hooks/use-toast"; import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage, } from "@/components/ui/shadcn/form"; import { Input } from "@/components/ui/shadcn/input"; import { AuthButton } from "../form-components/auth-button"; type BackupCodeFormProps = { setPending: Dispatch<SetStateAction<boolean>>; }; export function BackupCodeForm({ setPending }: BackupCodeFormProps) { const isClient = useIsClient(); const [isPending, startTransition] = useTransition(); useEffect(() => { setPending(isPending); }, [isPending]); const form = useForm<z.infer<typeof BackupCodeSchema>>({ resolver: zodResolver(BackupCodeSchema), defaultValues: { backupCode: "", }, }); const onSubmit = form.handleSubmit((data: z.infer<typeof BackupCodeSchema>) => { startTransition(async () => { try { await authClient.twoFactor.verifyBackupCode({ code: data.backupCode, fetchOptions: { onError(ctx) { if (ctx.error.code === "INVALID_BACKUP_CODE") { form.setError("backupCode", { message: "Invalid backup code", }); return; } if (ctx.error.code === "INVALID_TWO_FACTOR_COOKIE") { toast({ title: "Invalid Two-Factor Token", description: "Your session has expired. Please log in again.", }); return; } throw new Error(ctx.error?.message); }, onSuccess(ctx) { console.log(ctx); }, }, }); } catch (error) { toast({ title: "Backup Code Error", description: "There was an issue with the backup code. Please check and try again.", }); } }); }); return ( <Form {...form}> <form className="grid w-full gap-2" onSubmit={onSubmit}> <FormField control={form.control} name="backupCode" render={({ field }) => ( <FormItem className="flex flex-col items-center gap-3 space-y-0 pt-1.5"> <FormLabel htmlFor="backupCode" className="text-center"> backup code </FormLabel> <FormControl> <Input id="backupCode" type="text" disabled={isPending} placeholder="XXXXX-XXXXX" className="text-center" {...field} pattern="[a-z0-9]{5}-[a-z0-9]{5}" /> </FormControl> <FormMessage /> </FormItem> )} /> <AuthButton isPending={isPending}>Verify Code</AuthButton> </form> </Form> ); } ``` **Expected behavior** When a user submits a valid backup code, it should execute what's inside success and redirect. **Screenshots** ![image](https://github.com/user-attachments/assets/0035a13f-a669-40f4-bcc8-d74800b7bb68)
GiteaMirror added the locked label 2026-04-13 03:28:44 -05:00
GiteaMirror commented 2026-04-13 03:28:45 -05:00
Author
Owner
Copy Link

@Bekacru commented on GitHub (Dec 3, 2024):

which version of better auth are you on?

<!-- gh-comment-id:2515148536 --> @Bekacru commented on GitHub (Dec 3, 2024): which version of better auth are you on?
GiteaMirror commented 2026-04-13 03:28:46 -05:00
Author
Owner
Copy Link

@MarcosHelbert commented on GitHub (Dec 3, 2024):

v1.0.9

<!-- gh-comment-id:2515154154 --> @MarcosHelbert commented on GitHub (Dec 3, 2024): v1.0.9
GiteaMirror commented 2026-04-13 03:28:46 -05:00
Author
Owner
Copy Link

@Bekacru commented on GitHub (Dec 3, 2024):

should be fixed on 1.0.10-beta.2

<!-- gh-comment-id:2515217212 --> @Bekacru commented on GitHub (Dec 3, 2024): should be fixed on `1.0.10-beta.2`
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
adapter
astro
awaiting external contributor
blocked
breaking
breaking change
bug
c-devops
core
credentials
database
dependencies
devops
devtools
docs
documentation
duplicate
elysia
enhancement
enterprise
expo
express
fastify
good first issue
help wanted
hono
identity
infra
integration
invalid
javascript
locked
maintenance
need-more-information
needs: info
needs: repro
nextjs
nuxt
oauth
organization
P0
payments
perf
platform
plugin
pull-request
Mirrored from GitHub Pull Request
 question
ready
regression
remix
security
social-provider
solid
stale
svelte
tanstack-start
tracking
version-bump
vue
wontfix
No Label locked
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
GiteaMirror ninjasurge
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/better-auth#8410
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?