diff --git a/src/components/Contacts/ContactDetails/ContactDetailsHeader/DeleteContactModal/DeleteContactModal.test.tsx b/src/components/Contacts/ContactDetails/ContactDetailsHeader/DeleteContactModal/DeleteContactModal.test.tsx index b0dcf68db..8b5b0005a 100644 --- a/src/components/Contacts/ContactDetails/ContactDetailsHeader/DeleteContactModal/DeleteContactModal.test.tsx +++ b/src/components/Contacts/ContactDetails/ContactDetailsHeader/DeleteContactModal/DeleteContactModal.test.tsx @@ -2,22 +2,24 @@ import React from 'react'; import { ThemeProvider } from '@mui/material/styles'; import { LocalizationProvider } from '@mui/x-date-pickers'; import { AdapterLuxon } from '@mui/x-date-pickers/AdapterLuxon'; -import { render } from '@testing-library/react'; +import { render, waitFor } from '@testing-library/react'; import { SnackbarProvider } from 'notistack'; import TestRouter from '__tests__/util/TestRouter'; import { GqlMockedProvider } from '__tests__/util/graphqlMocking'; +import { ContactSourceEnum } from 'src/graphql/types.generated'; import theme from 'src/theme'; import { ContactSourceQuery } from './ContactSource.generated'; import { DeleteContactModal } from './DeleteContactModal'; const contactId = 'contact-id'; +const mutationSpy = jest.fn(); const setOpen = jest.fn(); const deleteContact = jest.fn(); interface TestComponentProps { open?: boolean; deleting?: boolean; - contactSource?: string; + contactSource?: ContactSourceEnum; addressSources?: string[]; emailSources?: string[]; phoneSources?: string[]; @@ -26,7 +28,7 @@ interface TestComponentProps { const TestComponent: React.FC = ({ open = true, deleting = false, - contactSource = 'MPDX', + contactSource = ContactSourceEnum.Mpdx, addressSources = [], emailSources = [], phoneSources = [], @@ -39,7 +41,7 @@ const TestComponent: React.FC = ({ ContactSource: ContactSourceQuery; }> mocks={{ - GetContactDetailsHeader: { + ContactSource: { contact: { id: contactId, source: contactSource, @@ -61,6 +63,7 @@ const TestComponent: React.FC = ({ }, }, }} + onCall={mutationSpy} > { ).not.toBeInTheDocument(); }); - it('should be able to delete contact', () => { + it('should be able to delete contact', async () => { const { getByText, getByRole } = render(); + await waitFor(() => { + expect(mutationSpy).toHaveGraphqlOperation('ContactSource'); + }); + expect( getByText(/Are you sure you want to permanently delete this contact?/), ).toBeInTheDocument(); @@ -95,9 +102,13 @@ describe('DeleteContactModal', () => { expect(getByRole('button', { name: 'delete contact' })).toBeInTheDocument(); }); - it('should prevent user from deleting contact while currently deleting contact', () => { + it('should prevent user from deleting contact while currently deleting contact', async () => { const { getByRole } = render(); + await waitFor(() => { + expect(mutationSpy).toHaveGraphqlOperation('ContactSource'); + }); + expect(getByRole('button', { name: 'delete contact' })).toBeDisabled(); }); @@ -109,7 +120,7 @@ describe('DeleteContactModal', () => { const tests: TestProps[] = [ { testName: 'disables deletion if contact created by third party', - props: { contactSource: 'Siebel' }, + props: { contactSource: ContactSourceEnum.GiveSite }, }, { testName: @@ -151,19 +162,21 @@ describe('DeleteContactModal', () => { describe('Enable deletion', () => { it('should show modal and be able to delete user', async () => { - const { findByText, getByRole } = render( + const { getByText, getByRole } = render( , ); + await waitFor(() => { + expect(mutationSpy).toHaveGraphqlOperation('ContactSource'); + }); + expect( - await findByText( - /Are you sure you want to permanently delete this contact?/, - ), + getByText(/Are you sure you want to permanently delete this contact?/), ).toBeInTheDocument(); expect( diff --git a/src/components/Contacts/ContactDetails/ContactDetailsHeader/DeleteContactModal/DeleteContactModal.tsx b/src/components/Contacts/ContactDetails/ContactDetailsHeader/DeleteContactModal/DeleteContactModal.tsx index b599dea32..87c7913d7 100644 --- a/src/components/Contacts/ContactDetails/ContactDetailsHeader/DeleteContactModal/DeleteContactModal.tsx +++ b/src/components/Contacts/ContactDetails/ContactDetailsHeader/DeleteContactModal/DeleteContactModal.tsx @@ -54,7 +54,7 @@ export const DeleteContactModal: React.FC = ({ // Which will only recreate the data after deleting it on MPDX. // To prevent this confusion, we do not allow a contact to be deleted if it has non editable data. - const isContactNonEditable = isEditableSource(contactSources.source ?? ''); + const isContactNonEditable = !isEditableSource(contactSources.source ?? ''); const isAddressNonEditable = contactSources.addresses?.nodes.some( (address) => !isEditableSource(address.source ?? ''),