diff --git a/.changeset/rich-sloths-count.md b/.changeset/rich-sloths-count.md
new file mode 100644
index 00000000000..a845151cc84
--- /dev/null
+++ b/.changeset/rich-sloths-count.md
@@ -0,0 +1,2 @@
+---
+---
diff --git a/packages/clerk-js/src/ui/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx b/packages/clerk-js/src/ui/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx
index 3a17f562c60..eeb19a5bbc9 100644
--- a/packages/clerk-js/src/ui/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx
+++ b/packages/clerk-js/src/ui/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx
@@ -1,3 +1,4 @@
+import { waitFor } from '@testing-library/dom';
import React from 'react';
import { render, screen } from '../../../../testUtils';
@@ -19,8 +20,8 @@ describe('SignUpVerifyEmail', () => {
f.startSignUpWithEmailAddress({ emailAddress: 'test@clerk.com' });
});
fixtures.signUp.prepareEmailAddressVerification.mockRejectedValue(null);
- render(, { wrapper });
- screen.getByText('test@clerk.com');
+ const { findByText } = render(, { wrapper });
+ await waitFor(async () => expect(await findByText('test@clerk.com')).toBeInTheDocument());
});
it('shows the verify with link message', async () => {
@@ -36,8 +37,8 @@ describe('SignUpVerifyEmail', () => {
} as any),
);
- render(, { wrapper });
- screen.getAllByText(/Verification Link/i);
+ const { findByText } = render(, { wrapper });
+ await waitFor(async () => expect(await findByText(/Verification Link/i)).toBeInTheDocument());
});
it('shows the verify with code message', async () => {
@@ -48,9 +49,11 @@ describe('SignUpVerifyEmail', () => {
fixtures.signUp.prepareEmailAddressVerification.mockRejectedValue(null);
- render(, { wrapper });
- screen.getByText(/Verify your email/i);
- screen.getByText(/Enter the verification code sent to your email/i);
+ const { findByText } = render(, { wrapper });
+ await waitFor(async () => expect(await findByText(/Verify your email/i)).toBeInTheDocument());
+ await waitFor(async () =>
+ expect(await findByText(/Enter the verification code sent to your email/i)).toBeInTheDocument(),
+ );
});
it('clicking on the edit icon navigates to the previous route', async () => {
@@ -81,10 +84,8 @@ describe('SignUpVerifyEmail', () => {
cancelEmailLinkFlow: jest.fn(() => new Promise(() => ({}))),
} as any),
);
-
- render(, { wrapper });
- const resendButton = screen.getByText(/Resend/i);
- expect(resendButton.tagName.toUpperCase()).toBe('BUTTON');
+ const { findByText } = render(, { wrapper });
+ await waitFor(async () => expect((await findByText(/Resend/i)).tagName.toUpperCase()).toBe('BUTTON'));
});
it('Resend code button exists', async () => {
@@ -95,9 +96,8 @@ describe('SignUpVerifyEmail', () => {
fixtures.signUp.prepareEmailAddressVerification.mockRejectedValue(null);
- render(, { wrapper });
- const resendButton = screen.getByText(/Resend/i);
- expect(resendButton.tagName.toUpperCase()).toBe('BUTTON');
+ const { findByText } = render(, { wrapper });
+ await waitFor(async () => expect((await findByText(/Resend/i)).tagName.toUpperCase()).toBe('BUTTON'));
});
it.todo('Resend link button is pressable after 60 seconds');
diff --git a/packages/clerk-js/src/ui/components/SignUp/__tests__/SignUpVerifyPhone.test.tsx b/packages/clerk-js/src/ui/components/SignUp/__tests__/SignUpVerifyPhone.test.tsx
index 2d6b440dfa9..67a4db12410 100644
--- a/packages/clerk-js/src/ui/components/SignUp/__tests__/SignUpVerifyPhone.test.tsx
+++ b/packages/clerk-js/src/ui/components/SignUp/__tests__/SignUpVerifyPhone.test.tsx
@@ -1,3 +1,4 @@
+import { waitFor } from '@testing-library/dom';
import React from 'react';
import { render, screen } from '../../../../testUtils';
@@ -19,8 +20,8 @@ describe('SignUpVerifyPhone', () => {
f.startSignUpWithPhoneNumber({ phoneNumber: '+306911111111' });
});
fixtures.signUp.preparePhoneNumberVerification.mockRejectedValue(null);
- render(, { wrapper });
- screen.getByText('+30 691 1111111');
+ const { findByText } = render(, { wrapper });
+ await waitFor(async () => expect(await findByText('+30 691 1111111')).toBeInTheDocument());
});
it('shows the verify with code message', async () => {
@@ -29,9 +30,11 @@ describe('SignUpVerifyPhone', () => {
f.startSignUpWithPhoneNumber();
});
fixtures.signUp.preparePhoneNumberVerification.mockRejectedValue(null);
- render(, { wrapper });
- screen.getByText(/Verify your phone/i);
- screen.getByText(/Enter the verification code sent to your phone/i);
+ const { findByText } = render(, { wrapper });
+ await waitFor(async () => expect(await findByText(/Verify your phone/i)).toBeInTheDocument());
+ await waitFor(async () =>
+ expect(await findByText(/Enter the verification code sent to your phone/i)).toBeInTheDocument(),
+ );
});
it('clicking on the edit icon navigates to the previous route', async () => {
@@ -55,9 +58,8 @@ describe('SignUpVerifyPhone', () => {
f.startSignUpWithEmailAddress({ emailAddress: 'test@clerk.com' });
});
fixtures.signUp.preparePhoneNumberVerification.mockRejectedValue(null);
- render(, { wrapper });
- const resendButton = screen.getByText(/Resend/i);
- expect(resendButton.tagName.toUpperCase()).toBe('BUTTON');
+ const { findByText } = render(, { wrapper });
+ await waitFor(async () => expect((await findByText(/Resend/i)).tagName.toUpperCase()).toBe('BUTTON'));
});
it.todo('Resend code button is pressable after 30 seconds');