overleaf/services/web/test/frontend/features/group-management/components/members-table/unlink-user-modal.test.tsx

77 lines
2.3 KiB
TypeScript
Raw Normal View History

import { fireEvent, render, screen, waitFor } from '@testing-library/react'
import { ReactElement } from 'react'
import sinon from 'sinon'
import fetchMock from 'fetch-mock'
import UnlinkUserModal from '@/features/group-management/components/members-table/unlink-user-modal'
import { GroupMembersProvider } from '@/features/group-management/context/group-members-context'
import { expect } from 'chai'
export function renderWithContext(component: ReactElement, props = {}) {
const GroupMembersProviderWrapper = ({
children,
}: {
children: ReactElement
}) => <GroupMembersProvider {...props}>{children}</GroupMembersProvider>
return render(component, { wrapper: GroupMembersProviderWrapper })
}
describe('<UnlinkUserModal />', function () {
let defaultProps: any
const groupId = 'group123'
const userId = 'user123'
beforeEach(function () {
window.metaAttributesCache = new Map()
defaultProps = {
onClose: sinon.stub(),
user: { _id: userId },
setGroupUserAlert: sinon.stub(),
}
window.metaAttributesCache.set('ol-groupId', groupId)
})
afterEach(function () {
window.metaAttributesCache = new Map()
fetchMock.reset()
})
it('displays the modal', async function () {
renderWithContext(<UnlinkUserModal {...defaultProps} />)
await screen.findByRole('heading', {
name: 'Unlink user',
})
screen.getByText('Youre about to remove the SSO login option for', {
exact: false,
})
})
it('closes the modal on success', async function () {
fetchMock.post(`/manage/groups/${groupId}/unlink-user/${userId}`, 200)
renderWithContext(<UnlinkUserModal {...defaultProps} />)
await screen.findByRole('heading', {
name: 'Unlink user',
})
const confirmButton = screen.getByRole('button', { name: 'Unlink user' })
fireEvent.click(confirmButton)
await waitFor(() => expect(defaultProps.onClose).to.have.been.called)
})
it('handles errors', async function () {
fetchMock.post(`/manage/groups/${groupId}/unlink-user/${userId}`, 500)
renderWithContext(<UnlinkUserModal {...defaultProps} />)
await screen.findByRole('heading', {
name: 'Unlink user',
})
const confirmButton = screen.getByRole('button', { name: 'Unlink user' })
fireEvent.click(confirmButton)
await waitFor(() => screen.findByText('Sorry, something went wrong'))
})
})