Merge pull request #16662 from overleaf/ii-share-modal-click-2

[web] Share modal select contact

GitOrigin-RevId: e43575cd97ad8e4bca249967bdf0cfc587213cc4
This commit is contained in:
ilkin-overleaf 2024-01-25 14:58:59 +02:00 committed by Copybot
parent 55fcf8a0ee
commit a44a6a22dc
2 changed files with 39 additions and 4 deletions

View file

@ -176,10 +176,7 @@ export default function SelectCollaborators({
ref: inputRef,
// preventKeyAction: showDropdown,
onBlur: () => {
// blur: if the dropdown isn't open, try to create a new item using inputValue
if (!isOpen) {
addNewItem(inputValue, false)
}
addNewItem(inputValue, false)
},
onChange: e => {
setInputValue(e.target.value)

View file

@ -8,6 +8,7 @@ import {
waitForElementToBeRemoved,
} from '@testing-library/react'
import fetchMock from 'fetch-mock'
import userEvent from '@testing-library/user-event'
import ShareProjectModal from '../../../../../frontend/js/features/share-project-modal/components/share-project-modal'
import {
@ -853,4 +854,41 @@ describe('<ShareProjectModal/>', function () {
)
})
})
it('selects contact by typing the entire email and blurring the input', async function () {
renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
scope: { project },
})
const [inputElement] = await screen.findAllByLabelText(
'Share with your collaborators'
)
// Wait for contacts to load
await waitFor(() => {
expect(fetchMock.called('express:/user/contacts')).to.be.true
})
// Enter a prefix that matches a contact
await userEvent.type(inputElement, 'ptolemy@example.com')
// The matching contact should now be present and selected
await screen.findByRole('option', {
name: `Claudius Ptolemy <ptolemy@example.com>`,
selected: true,
})
// No items should be added yet
expect(screen.queryByRole('button', { name: 'Remove' })).to.be.null
// Click anywhere on the form to blur the input
await userEvent.click(screen.getByRole('dialog'))
// The contact should be added
await waitFor(() => {
expect(screen.getAllByRole('button', { name: 'Remove' })).to.have.length(
1
)
})
})
})