-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Update and fix tests. Now testing to ensure the new email gets added …
…by the Star icon rather than checking what gets passed into cache.
- Loading branch information
Showing
4 changed files
with
30 additions
and
197 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,9 +1,8 @@ | ||
| import React from 'react'; | ||
| import { ApolloCache, InMemoryCache } from '@apollo/client'; | ||
| import { ThemeProvider } from '@mui/material/styles'; | ||
| import { render, waitFor } from '@testing-library/react'; | ||
| import { render, screen, waitFor } from '@testing-library/react'; | ||
| import userEvent from '@testing-library/user-event'; | ||
| import { ApolloErgonoMockMap, ErgonoMockShape } from 'graphql-ergonomock'; | ||
| import { ApolloErgonoMockMap } from 'graphql-ergonomock'; | ||
| import { SnackbarProvider } from 'notistack'; | ||
| import TestRouter from '__tests__/util/TestRouter'; | ||
| import { GqlMockedProvider } from '__tests__/util/graphqlMocking'; | ||
|
|
@@ -13,10 +12,6 @@ import { EmailAddressesMutation } from './AddEmailAddress.generated'; | |
| import { FixEmailAddresses } from './FixEmailAddresses'; | ||
| import { | ||
| contactId, | ||
| contactOneEmailAddressNodes, | ||
| contactTwoEmailAddressNodes, | ||
| mockCacheWriteData, | ||
| mockCacheWriteDataContactTwo, | ||
| mockInvalidEmailAddressesResponse, | ||
| newEmail, | ||
| } from './FixEmailAddressesMocks'; | ||
|
|
@@ -50,10 +45,9 @@ const defaultGraphQLMock = { | |
|
|
||
| interface ComponentsProps { | ||
| mocks?: ApolloErgonoMockMap; | ||
| cache?: ApolloCache<object>; | ||
| } | ||
|
|
||
| const Components = ({ mocks = defaultGraphQLMock, cache }: ComponentsProps) => ( | ||
| const Components = ({ mocks = defaultGraphQLMock }: ComponentsProps) => ( | ||
| <SnackbarProvider> | ||
| <ThemeProvider theme={theme}> | ||
| <TestRouter router={router}> | ||
|
|
@@ -62,7 +56,6 @@ const Components = ({ mocks = defaultGraphQLMock, cache }: ComponentsProps) => ( | |
| EmailAddresses: EmailAddressesMutation; | ||
| }> | ||
| mocks={mocks} | ||
| cache={cache} | ||
| onCall={mutationSpy} | ||
| > | ||
| <FixEmailAddresses | ||
|
|
@@ -158,7 +151,9 @@ describe('FixEmailAddresses-Home', () => { | |
| }); | ||
|
|
||
| it('change second email for second person to primary then delete it', async () => { | ||
| const { getByTestId, queryByTestId } = render(<Components />); | ||
| const { getByTestId, queryByTestId, getByText, getByRole } = render( | ||
| <Components />, | ||
| ); | ||
|
|
||
| const star11 = await waitFor(() => | ||
| getByTestId('starOutlineIcon-testid2-1'), | ||
|
|
@@ -168,11 +163,12 @@ describe('FixEmailAddresses-Home', () => { | |
| const delete11 = await waitFor(() => getByTestId('delete-testid2-1')); | ||
| userEvent.click(delete11); | ||
|
|
||
| const deleteButton = await waitFor(() => | ||
| getByTestId('modal-delete-button'), | ||
| await waitFor(() => | ||
| getByText(`Are you sure you wish to delete this email address:`), | ||
| ); | ||
| userEvent.click(deleteButton); | ||
| userEvent.click(getByRole('button', { name: 'Yes' })); | ||
|
|
||
| screen.logTestingPlaygroundURL(); | ||
| await waitFor(() => { | ||
| expect(queryByTestId('starIcon-testid2-1')).not.toBeInTheDocument(); | ||
| expect(getByTestId('starIcon-testid2-0')).toBeInTheDocument(); | ||
|
|
@@ -226,133 +222,32 @@ describe('FixEmailAddresses-Home', () => { | |
| }); | ||
|
|
||
| describe('Add email address - Testing cache', () => { | ||
| interface AddEmailAddressProps { | ||
| postSaveResponse: object; | ||
| emailAddressNodes: object[]; | ||
| elementToWaitFor: string; | ||
| textFieldIndex: number; | ||
| addButtonId: string; | ||
| cache: InMemoryCache; | ||
| } | ||
|
|
||
| const addEmailAddress = async ({ | ||
| postSaveResponse, | ||
| emailAddressNodes, | ||
| elementToWaitFor, | ||
| textFieldIndex, | ||
| addButtonId, | ||
| cache, | ||
| }: AddEmailAddressProps) => { | ||
| let cardinality = 0; | ||
| jest.spyOn(cache, 'readQuery').mockReturnValue(postSaveResponse); | ||
| jest.spyOn(cache, 'writeQuery'); | ||
|
|
||
| const updatePerson = { | ||
| person: { | ||
| emailAddresses: { | ||
| nodes: [ | ||
| ...emailAddressNodes, | ||
| { | ||
| email: newEmail.email, | ||
| }, | ||
| ], | ||
| }, | ||
| }, | ||
| } as ErgonoMockShape; | ||
|
|
||
| const { getByTestId, getAllByLabelText } = render( | ||
| <Components | ||
| mocks={{ | ||
| GetInvalidEmailAddresses: () => { | ||
| let queryResult; | ||
| if (cardinality === 0) { | ||
| queryResult = { | ||
| people: { | ||
| nodes: mockInvalidEmailAddressesResponse, | ||
| }, | ||
| }; | ||
| } else { | ||
| queryResult = postSaveResponse; | ||
| } | ||
| cardinality++; | ||
| return queryResult; | ||
| }, | ||
| EmailAddresses: { updatePerson }, | ||
| }} | ||
| cache={cache} | ||
| />, | ||
| it('should add an email address to the first person', async () => { | ||
| const { getAllByTestId, getByTestId, queryByTestId, getAllByRole } = | ||
| render(<Components />); | ||
|
|
||
| const emailInput = await waitFor( | ||
| () => getAllByRole('textbox', { name: 'New Email Address' })[0], | ||
| ); | ||
| await waitFor(() => { | ||
| expect(getByTestId(elementToWaitFor)).toBeInTheDocument(); | ||
| }); | ||
| const addButton = getAllByTestId('addButton-testid')[0]; | ||
| expect(queryByTestId('starOutlineIcon-testid-2')).not.toBeInTheDocument(); | ||
|
|
||
| const textFieldNew = | ||
| getAllByLabelText('New Email Address')[textFieldIndex]; | ||
| userEvent.type(textFieldNew, newEmail.email); | ||
| const addButton = getByTestId(addButtonId); | ||
| expect(addButton).toBeDisabled(); | ||
| userEvent.type(emailInput, '[email protected]'); | ||
| expect(addButton).not.toBeDisabled(); | ||
| userEvent.click(addButton); | ||
| }; | ||
|
|
||
| it('should add an email address to the first person', async () => { | ||
| const cache = new InMemoryCache(); | ||
| const postSaveResponse = { | ||
| people: { | ||
| nodes: [ | ||
| { | ||
| ...mockInvalidEmailAddressesResponse[0], | ||
| emailAddresses: { | ||
| nodes: [...contactOneEmailAddressNodes, newEmail], | ||
| }, | ||
| }, | ||
| { ...mockInvalidEmailAddressesResponse[1] }, | ||
| ], | ||
| }, | ||
| }; | ||
| await addEmailAddress({ | ||
| postSaveResponse, | ||
| emailAddressNodes: contactOneEmailAddressNodes, | ||
| elementToWaitFor: 'textfield-testid-0', | ||
| textFieldIndex: 0, | ||
| addButtonId: 'addButton-testid', | ||
| cache, | ||
| }); | ||
|
|
||
| await waitFor(() => { | ||
| expect(cache.writeQuery).toHaveBeenLastCalledWith( | ||
| expect.objectContaining({ data: mockCacheWriteData }), | ||
| ); | ||
| expect(mockEnqueue).toHaveBeenCalledWith('Added email address', { | ||
| variant: 'success', | ||
| }); | ||
| }); | ||
| }); | ||
|
|
||
| it('should add an email address to the second person', async () => { | ||
| const cache = new InMemoryCache(); | ||
| const postSaveResponse = { | ||
| people: { | ||
| nodes: [ | ||
| { ...mockInvalidEmailAddressesResponse[0] }, | ||
| { | ||
| ...mockInvalidEmailAddressesResponse[1], | ||
| emailAddresses: { | ||
| nodes: [...contactTwoEmailAddressNodes, newEmail], | ||
| }, | ||
| }, | ||
| ], | ||
| }, | ||
| }; | ||
| await addEmailAddress({ | ||
| postSaveResponse, | ||
| emailAddressNodes: contactTwoEmailAddressNodes, | ||
| elementToWaitFor: 'textfield-testid2-0', | ||
| textFieldIndex: 1, | ||
| addButtonId: 'addButton-testid2', | ||
| cache, | ||
| }); | ||
| await waitFor(() => | ||
| expect(getByTestId('starOutlineIcon-testid-2')).toBeInTheDocument(), | ||
| ); | ||
|
|
||
| await waitFor(() => { | ||
| expect(cache.writeQuery).toHaveBeenLastCalledWith( | ||
| expect.objectContaining({ data: mockCacheWriteDataContactTwo }), | ||
| ); | ||
| }); | ||
| screen.logTestingPlaygroundURL(); | ||
| }); | ||
| }); | ||
| }); | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters