Firebase: Cannot read properties of undefined (reading '_getRecaptchaConfig')

I'm currently working on a Remix app with Firebase. I'm trying to implement my auth process using GoogleProvider and signInWithEmanilAndPassword. In my Remix's action when I did this implementation below to be able to signin but I get this error just below.

I need your help

Cannot read properties of undefined (reading '_getRecaptchaConfig')

Remix action function

export async function action({ request }: ActionArgs) {
	const formData = await request.formData()
	// const userAgent = request.headers.get('user-agent') ?? ''
	// const ua = UAParser(userAgent)
	// const session = await getSession(request.headers.get('Cookie'))

	const formValues = Object.fromEntries(formData)

	invariant(
		formValues?.email && typeof formValues?.email === 'string',
		"email is empty or isn't a string type",
	)
	invariant(
		formValues?.password && typeof formValues?.password === 'string',
		"password is empty or isn't a string type",
	)

	try {
		// await signOut(clientAuth)
		const response = await createUserWithEmailAndPassword(
			clientAuth,
			formValues.email,
			formValues?.password,
		)
	} catch (error) {
		console.log('[] err', error)
		logger.error(getErrorMessage(error))
	}

	return null
}

Form component

<Form
				method="post"
				className="space-y-3"
				action="/auth/signin"
				{...form.props}
				noValidate
				replace
			>
				<fieldset>
					<label htmlFor="email">{t('email')}</label>
					<Input name="email" placeholder={`${t('email')}`} />
					<p aria-invalid="true">{email.error}</p>
				</fieldset>
				<fieldset>
					<label htmlFor="password">{t('password')}</label>
					<Input
						name="password"
						type="password"
						placeholder={`${t('password')}`}
					/>
					<p aria-invalid="true">{password.error}</p>
				</fieldset>
				<LoadingButton
					type="submit"
					size="lg"
					name="intent"
					value="__with_email"
					isLoading={navigation.state === 'loading'}
					className="mt-[18px] min-h-[56px] w-full text-base"
				>
					{t('createMyAccount')}
				</LoadingButton>
				<p className="mt-[18px] text-center text-base">
					{t('alreadyMember')},{' '}
					<Link to="/login" className="font-bold hover:underline">
						{t('login')}
					</Link>
				</p>
			</Form>

Firebase config

import { getAuth } from 'firebase/auth'
import { initializeApp } from 'firebase/app'

console.log(process.env.FIREBASE_API_KEY)

export const firebaseConfig = {
	apiKey: 'xxxxxxxxxxxxxxxxxxxx',
	authDomain: 'xxxxxxxx',
	projectId: 'xxxxxxxxxxx',
	storageBucket: 'xxxxx',
	messagingSenderId: 'xxxxxx',
	appId: 'xxxxxxxxxxx',
	measurementId: 'xxxxxxxx',
}

const app = initializeApp(firebaseConfig)
const auth = getAuth(app)

export { auth }

TypeError: Cannot read properties of undefined (reading '_getRecaptchaConfig')
    at createUserWithEmailAndPassword (/Users/elyseebleu/Desktop/DEV/myInspo/node_modules/@firebase/auth/src/core/strategies/email_and_password.ts:291:20)
    at action3 (/Users/elyseebleu/Desktop/DEV/myInspo/app/routes/auth+/signin.tsx:181:26)
    at runMicrotasks (<anonymous>)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at Object.callRouteActionRR (/Users/elyseebleu/Desktop/DEV/myInspo/node_modules/@remix-run/node/node_modules/@remix-run/server-runtime/dist/data.js:35:16)
    at callLoaderOrAction (/Users/elyseebleu/Desktop/DEV/myInspo/node_modules/@remix-run/router/router.ts:3568:16)
    at submit (/Users/elyseebleu/Desktop/DEV/myInspo/node_modules/@remix-run/router/router.ts:2835:16)
    at queryImpl (/Users/elyseebleu/Desktop/DEV/myInspo/node_modules/@remix-run/router/router.ts:2770:22)
    at Object.queryRoute (/Users/elyseebleu/Desktop/DEV/myInspo/node_modules/@remix-run/router/router.ts:2720:18)
    at handleDataRequestRR (/Users/elyseebleu/Desktop/DEV/myInspo/node_modules/@remix-run/node/node_modules/@remix-run/server-runtime/dist/server.js:75:20)
    at requestHandler (/Users/elyseebleu/Desktop/DEV/myInspo/node_modules/@remix-run/node/node_modules/@remix-run/server-runtime/dist/server.js:49:18)

I had the exact same issue, turns out that I just had my Firebase Auth object as undefined.

So check that your clientAuth is correctly defined.