overleaf/services/web/test/frontend/features/settings/components/leave/modal.test.tsx

66 lines
1.7 KiB
TypeScript
Raw Normal View History

import sinon from 'sinon'
import { fireEvent, screen, render, waitFor } from '@testing-library/react'
import fetchMock from 'fetch-mock'
import LeaveModal from '../../../../../../frontend/js/features/settings/components/leave/modal'
describe('<LeaveModal />', function () {
beforeEach(function () {
window.metaAttributesCache = new Map()
window.metaAttributesCache.set('ol-userDefaultEmail', 'foo@bar.com')
})
afterEach(function () {
window.metaAttributesCache = new Map()
fetchMock.reset()
})
it('closes modal on cancel', async function () {
const handleClose = sinon.stub()
render(<LeaveModal isOpen handleClose={handleClose} />)
const cancelButton = screen.getByRole('button', {
name: 'Cancel',
})
fireEvent.click(cancelButton)
sinon.assert.calledOnce(handleClose)
})
it('does not close modal while in flight', async function () {
fetchMock.post('/user/delete', new Promise(() => {}))
const handleClose = sinon.stub()
render(<LeaveModal isOpen handleClose={handleClose} />)
fillValidForm()
const deleteButton = screen.getByRole('button', {
name: 'Delete',
})
fireEvent.click(deleteButton)
await waitFor(() => {
screen.getByRole('button', {
name: 'Deleting…',
})
})
const cancelButton = screen.getByRole('button', {
name: 'Cancel',
})
fireEvent.click(cancelButton)
sinon.assert.notCalled(handleClose)
})
})
function fillValidForm() {
fireEvent.change(screen.getByLabelText('Email'), {
target: { value: 'foo@bar.com' },
})
fireEvent.change(screen.getByLabelText('Password'), {
target: { value: 'foobar' },
})
fireEvent.click(screen.getByLabelText(/I understand/))
}