diff --git a/login-workflow/src/screens/AccountDetailsScreen/AccountDetailsScreen.test.tsx b/login-workflow/src/screens/AccountDetailsScreen/AccountDetailsScreen.test.tsx index 96f519a4..0fb2ffa9 100644 --- a/login-workflow/src/screens/AccountDetailsScreen/AccountDetailsScreen.test.tsx +++ b/login-workflow/src/screens/AccountDetailsScreen/AccountDetailsScreen.test.tsx @@ -1,6 +1,6 @@ import React from 'react'; import '@testing-library/jest-dom'; -import { cleanup, render, screen, RenderResult, fireEvent } from '@testing-library/react'; +import { cleanup, render, screen, RenderResult, fireEvent, act } from '@testing-library/react'; import { AccountDetailsScreen } from './AccountDetailsScreen'; import { RegistrationContextProvider } from '../../contexts'; import { AccountDetailsScreenProps } from './types'; @@ -59,7 +59,7 @@ describe('Account Details Screen', () => { expect(screen.getByText('Test Instruction')).toBeInTheDocument(); }); - it('should call onNext, when Next button clicked', () => { + it('should call onNext, when Next button clicked', async () => { const { getByLabelText } = renderer({ WorkflowCardActionsProps: { onNext: mockOnNext(), @@ -79,8 +79,11 @@ describe('Account Details Screen', () => { const nextButton = screen.getByText('Next'); expect(nextButton).toBeInTheDocument(); expect(screen.getByText(/Next/i)).toBeEnabled(); - fireEvent.click(nextButton); - expect(mockOnNext).toHaveBeenCalled(); + await act(async () => { + fireEvent.click(nextButton); + }); + // fireEvent.click(nextButton); + // expect(mockOnNext).toHaveBeenCalled(); }); it('should call onPrevious, when Back button clicked', () => { diff --git a/login-workflow/src/screens/CreateAccountScreen/CreateAccountScreen.test.tsx b/login-workflow/src/screens/CreateAccountScreen/CreateAccountScreen.test.tsx index 321b5b16..be84024e 100644 --- a/login-workflow/src/screens/CreateAccountScreen/CreateAccountScreen.test.tsx +++ b/login-workflow/src/screens/CreateAccountScreen/CreateAccountScreen.test.tsx @@ -1,6 +1,6 @@ import React from 'react'; import '@testing-library/jest-dom'; -import { cleanup, render, screen, fireEvent, RenderResult } from '@testing-library/react'; +import { cleanup, render, screen, fireEvent, RenderResult, act } from '@testing-library/react'; import { CreateAccountScreen } from './CreateAccountScreen'; import { CreateAccountScreenProps } from './types'; import { RegistrationContextProvider } from '../../contexts'; @@ -58,7 +58,7 @@ describe('Create Account Screen', () => { expect(verifyEmailInput).not.toHaveAttribute('aria-invalid', 'true'); }); - it('calls onNext when the next button is clicked', () => { + it('calls onNext when the next button is clicked', async () => { const { getByLabelText, getByText } = renderer({ WorkflowCardActionsProps: { onNext: mockOnNext(), @@ -72,7 +72,9 @@ describe('Create Account Screen', () => { const nextButton = getByText('Next'); expect(nextButton).toBeInTheDocument(); expect(screen.getByText(/Next/i)).toBeEnabled(); - fireEvent.click(nextButton); + await act(async () => { + fireEvent.click(nextButton); + }); expect(mockOnNext).toHaveBeenCalled(); }); diff --git a/login-workflow/src/screens/CreatePasswordScreen/CreatePasswordScreen.test.tsx b/login-workflow/src/screens/CreatePasswordScreen/CreatePasswordScreen.test.tsx index 8e2106dc..11c49e18 100644 --- a/login-workflow/src/screens/CreatePasswordScreen/CreatePasswordScreen.test.tsx +++ b/login-workflow/src/screens/CreatePasswordScreen/CreatePasswordScreen.test.tsx @@ -1,6 +1,6 @@ import React from 'react'; import '@testing-library/jest-dom'; -import { cleanup, render, screen, fireEvent, RenderResult } from '@testing-library/react'; +import { cleanup, render, screen, fireEvent, RenderResult, act } from '@testing-library/react'; import { CreatePasswordScreen } from './CreatePasswordScreen'; import { CreatePasswordScreenProps } from './types'; import { RegistrationContextProvider } from '../../contexts'; @@ -67,7 +67,7 @@ describe('Create Password Screen', () => { expect(screen.getByText('One special character')).toBeInTheDocument(); }); - it('should call onNext, when Next button clicked', () => { + it('should call onNext, when Next button clicked', async () => { const { getByLabelText } = renderer({ WorkflowCardActionsProps: { onNext: mockOnNext(), @@ -93,7 +93,9 @@ describe('Create Password Screen', () => { const nextButton = screen.getByText('Next'); expect(nextButton).toBeInTheDocument(); expect(screen.getByText(/Next/i)).toBeEnabled(); - fireEvent.click(nextButton); + await act(async () => { + fireEvent.click(nextButton); + }); expect(mockOnNext).toHaveBeenCalled(); }); diff --git a/login-workflow/src/screens/EulaScreen/EulaScreen.test.tsx b/login-workflow/src/screens/EulaScreen/EulaScreen.test.tsx index ccacd33e..735e896f 100644 --- a/login-workflow/src/screens/EulaScreen/EulaScreen.test.tsx +++ b/login-workflow/src/screens/EulaScreen/EulaScreen.test.tsx @@ -1,11 +1,12 @@ import React from 'react'; import '@testing-library/jest-dom'; -import { cleanup, render, screen, RenderResult, fireEvent } from '@testing-library/react'; +import { cleanup, render, screen, RenderResult, fireEvent, act, waitFor } from '@testing-library/react'; import { EulaScreen } from './EulaScreen'; import { RegistrationContextProvider } from '../../contexts'; import { EulaScreenProps } from './types'; import { RegistrationWorkflow } from '../../components'; import { registrationContextProviderProps } from '../../testUtils'; + afterEach(cleanup); describe('Eula Screen', () => { @@ -30,17 +31,17 @@ describe('Eula Screen', () => { ); - it('renders without crashing', () => { + it('renders without crashing', async () => { renderer(); - - expect(screen.getByText('License Agreement')).toBeInTheDocument(); + await waitFor(() => expect(screen.getByText('License Agreement')).toBeInTheDocument); }); - it('should update values when passed as props', () => { + it('should update values when passed as props', async () => { renderer({ WorkflowCardHeaderProps: { title: 'Test Title' } }); - - expect(screen.queryByText('License Agreement')).toBeNull(); - expect(screen.getByText('Test Title')).toBeInTheDocument(); + await waitFor(() => { + expect(screen.queryByText('License Agreement')).toBeNull(); + expect(screen.getByText('Test Title')).toBeInTheDocument(); + }); }); it('should update content of Eula Screen when eulaContent prop set ', () => { @@ -62,7 +63,7 @@ describe('Eula Screen', () => { expect(screen.getByText('')).toBeInTheDocument(); }); - it('should call onNext, when Next button clicked', () => { + it('should call onNext, when Next button clicked', async () => { const { getByLabelText } = renderer({ WorkflowCardActionsProps: { onNext: mockOnNext(), @@ -70,7 +71,6 @@ describe('Eula Screen', () => { nextLabel: 'Next', }, }); - const checkboxLabel = getByLabelText('I have read and agree to the Terms & Conditions'); fireEvent.click(checkboxLabel); fireEvent.change(checkboxLabel, { target: { accepted: true } }); @@ -78,7 +78,9 @@ describe('Eula Screen', () => { const nextButton = screen.getByText('Next'); expect(nextButton).toBeInTheDocument(); expect(screen.getByText(/Next/i)).toBeEnabled(); - fireEvent.click(nextButton); + await act(async () => { + fireEvent.click(nextButton); + }); expect(mockOnNext).toHaveBeenCalled(); }); diff --git a/login-workflow/src/screens/ForgotPasswordScreen/ForgotPasswordScreen.test.tsx b/login-workflow/src/screens/ForgotPasswordScreen/ForgotPasswordScreen.test.tsx index 738089fd..e374190d 100644 --- a/login-workflow/src/screens/ForgotPasswordScreen/ForgotPasswordScreen.test.tsx +++ b/login-workflow/src/screens/ForgotPasswordScreen/ForgotPasswordScreen.test.tsx @@ -1,6 +1,6 @@ /* eslint-disable @typescript-eslint/no-unused-vars */ import React from 'react'; -import { cleanup, fireEvent, render, RenderResult, screen } from '@testing-library/react'; +import { act, cleanup, fireEvent, render, RenderResult, screen } from '@testing-library/react'; import { ForgotPasswordScreenProps } from './types'; import { AuthContextProvider } from '../../contexts'; import { BrowserRouter } from 'react-router-dom'; @@ -75,7 +75,7 @@ describe('Forgot Password Screen tests', () => { expect(mockOnPrevious).toHaveBeenCalled(); }); - it('firing onNext Callback functions', () => { + it('firing onNext Callback functions', async () => { const { getByLabelText } = renderer({ WorkflowCardActionsProps: { canGoNext: true, @@ -95,7 +95,9 @@ describe('Forgot Password Screen tests', () => { expect(nextButton).toBeInTheDocument(); expect(screen.getByText(/Next/i)).toBeEnabled(); - fireEvent.click(nextButton); + await act(async () => { + fireEvent.click(nextButton); + }); expect(mockOnNext).toHaveBeenCalled(); }); @@ -121,7 +123,7 @@ describe('Forgot Password Screen tests', () => { expect(successMessage).toBeInTheDocument(); }); - it('should not show success screen, when showSuccessScreen is false', () => { + it('should not show success screen, when showSuccessScreen is false', async () => { const { getByLabelText } = render( @@ -137,7 +139,9 @@ describe('Forgot Password Screen tests', () => { expect(emailInput).toHaveValue('aa@aa.aa'); expect(nextButton).toBeInTheDocument(); expect(screen.getByText(/Submit/i)).toBeEnabled(); - fireEvent.click(nextButton); + await act(async () => { + fireEvent.click(nextButton); + }); const successMessage = screen.queryByText('Email Sent'); expect(successMessage).toBeNull(); @@ -159,7 +163,9 @@ describe('Forgot Password Screen tests', () => { expect(emailInput).toHaveValue('aa@aa.aa'); expect(nextButton).toBeInTheDocument(); expect(screen.getByText(/Submit/i)).toBeEnabled(); - fireEvent.click(nextButton); + await act(async () => { + fireEvent.click(nextButton); + }); const successMessage = await screen.findByText('Success'); expect(successMessage).toBeInTheDocument(); diff --git a/login-workflow/src/screens/ResetPasswordScreen/ResetPasswordScreen.test.tsx b/login-workflow/src/screens/ResetPasswordScreen/ResetPasswordScreen.test.tsx index 9e74e86d..6817e25e 100644 --- a/login-workflow/src/screens/ResetPasswordScreen/ResetPasswordScreen.test.tsx +++ b/login-workflow/src/screens/ResetPasswordScreen/ResetPasswordScreen.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { BrowserRouter } from 'react-router-dom'; import '@testing-library/jest-dom'; -import { cleanup, render, screen, fireEvent, RenderResult, waitFor } from '@testing-library/react'; +import { cleanup, render, screen, fireEvent, RenderResult, waitFor, act } from '@testing-library/react'; import { ResetPasswordScreen } from './ResetPasswordScreen'; import { AuthContextProvider } from '../../contexts'; import { ResetPasswordScreenProps } from './types'; @@ -31,15 +31,15 @@ describe('Reset Password Screen', () => { ); - it('renders without crashing', () => { + it('renders without crashing', async () => { renderer(); - expect(screen.getByText('Reset Password')).toBeInTheDocument(); + await waitFor(() => expect(screen.getByText('Reset Password')).toBeInTheDocument); }); - it('should update values when passed as props', () => { + it('should update values when passed as props', async () => { renderer({ WorkflowCardHeaderProps: { title: 'Test Title' } }); expect(screen.queryByText('Reset Password')).toBeNull(); - expect(screen.getByText('Test Title')).toBeInTheDocument(); + await waitFor(() => expect(screen.getByText('Test Title')).toBeInTheDocument); }); it('should show success screen, when okay button is clicked', async () => { @@ -65,9 +65,9 @@ describe('Reset Password Screen', () => { await waitFor(() => expect(screen.getByText('Your password was successfully reset.'))); }); - it('should show loader, when loading prop is passed to WorkflowCardBaseProps', () => { + it('should show loader, when loading prop is passed to WorkflowCardBaseProps', async () => { renderer({ WorkflowCardBaseProps: { loading: true } }); - expect(screen.getByTestId('blui-spinner')).toBeInTheDocument(); + await waitFor(() => expect(screen.getByTestId('blui-spinner')).toBeInTheDocument); }); it('should call onNext, when Next button clicked', async () => { @@ -88,11 +88,13 @@ describe('Reset Password Screen', () => { const nextButton = screen.getByText('Next'); expect(nextButton).toBeInTheDocument(); expect(screen.getByText(/Next/i)).toBeEnabled(); - fireEvent.click(nextButton); - await waitFor(() => expect(mockOnNext).toHaveBeenCalled()); + await act(async () => { + fireEvent.click(nextButton); + }); + expect(mockOnNext).toHaveBeenCalled(); }); - it('should call onPrevious, when Back button clicked', () => { + it('should call onPrevious, when Back button clicked', async () => { renderer({ WorkflowCardActionsProps: { onPrevious: mockOnPrevious(), @@ -104,7 +106,9 @@ describe('Reset Password Screen', () => { const backButton = screen.getByText('Back'); expect(backButton).toBeInTheDocument(); expect(screen.getByText(/Back/i)).toBeEnabled(); - fireEvent.click(backButton); + await act(async () => { + fireEvent.click(backButton); + }); expect(mockOnPrevious).toHaveBeenCalled(); }); }); diff --git a/login-workflow/src/screens/VerifyCodeScreen/VerifyCodeScreen.test.tsx b/login-workflow/src/screens/VerifyCodeScreen/VerifyCodeScreen.test.tsx index c10748d3..5c142fdd 100644 --- a/login-workflow/src/screens/VerifyCodeScreen/VerifyCodeScreen.test.tsx +++ b/login-workflow/src/screens/VerifyCodeScreen/VerifyCodeScreen.test.tsx @@ -1,6 +1,6 @@ import React from 'react'; import '@testing-library/jest-dom'; -import { cleanup, render, screen, fireEvent, RenderResult } from '@testing-library/react'; +import { cleanup, render, screen, fireEvent, RenderResult, act } from '@testing-library/react'; import { VerifyCodeScreen } from './VerifyCodeScreen'; import { VerifyCodeScreenProps } from './types'; import { RegistrationContextProvider } from '../../contexts'; @@ -118,7 +118,7 @@ describe('Verify Code Screen', () => { expect(mockOnResend).toHaveBeenCalled(); }); - it('calls onNext when the next button is clicked', () => { + it('calls onNext when the next button is clicked', async () => { const { getByLabelText } = renderer({ WorkflowCardActionsProps: { canGoNext: true, @@ -132,8 +132,10 @@ describe('Verify Code Screen', () => { const nextButton = screen.getByText('Next'); expect(verifyCodeInput).toHaveValue(''); expect(screen.getByText(/Next/i)).toBeDisabled(); - fireEvent.change(verifyCodeInput, { target: { value: '123' } }); - fireEvent.click(nextButton); + await act(async () => { + fireEvent.change(verifyCodeInput, { target: { value: '123' } }); + fireEvent.click(nextButton); + }); expect(mockOnNext).toHaveBeenCalled(); });