overleaf/services/web/test/frontend/features/chat/components/message.test.js
Alf Eaton 7c97f8ab6e Switch to new JSX runtime (#4225)
* Use new JSX runtime and update Babel Node target
* Update .eslintrc
* Remove React imports

GitOrigin-RevId: 559de0267f8f2934c56a860ea8701bb522aa861a
2021-06-24 02:06:59 +00:00

106 lines
2.7 KiB
JavaScript

import { expect } from 'chai'
import { render, screen } from '@testing-library/react'
import Message from '../../../../../frontend/js/features/chat/components/message'
import { stubMathJax, tearDownMathJaxStubs } from './stubs'
describe('<Message />', function () {
const currentUser = {
id: 'fake_user',
first_name: 'fake_user_first_name',
email: 'fake@example.com',
}
beforeEach(function () {
window.user = currentUser
stubMathJax()
})
afterEach(function () {
delete window.user
tearDownMathJaxStubs()
})
it('renders a basic message', function () {
const message = {
contents: ['a message'],
user: currentUser,
}
render(<Message userId={currentUser.id} message={message} />)
screen.getByText('a message')
})
it('renders a message with multiple contents', function () {
const message = {
contents: ['a message', 'another message'],
user: currentUser,
}
render(<Message userId={currentUser.id} message={message} />)
screen.getByText('a message')
screen.getByText('another message')
})
it('renders HTML links within messages', function () {
const message = {
contents: [
'a message with a <a href="https://overleaf.com">link to Overleaf</a>',
],
user: currentUser,
}
render(<Message userId={currentUser.id} message={message} />)
screen.getByRole('link', { name: 'https://overleaf.com' })
})
describe('when the message is from the user themselves', function () {
const message = {
contents: ['a message'],
user: currentUser,
}
it('does not render the user name nor the email', function () {
render(<Message userId={currentUser.id} message={message} />)
expect(screen.queryByText(currentUser.first_name)).to.not.exist
expect(screen.queryByText(currentUser.email)).to.not.exist
})
})
describe('when the message is from other user', function () {
const otherUser = {
id: 'other_user',
first_name: 'other_user_first_name',
}
const message = {
contents: ['a message'],
user: otherUser,
}
it('should render the other user name', function () {
render(<Message userId={currentUser.id} message={message} />)
screen.getByText(otherUser.first_name)
})
it('should render the other user email when their name is not available', function () {
const msg = {
contents: message.contents,
user: {
id: otherUser.id,
email: 'other@example.com',
},
}
render(<Message userId={currentUser.id} message={msg} />)
expect(screen.queryByText(otherUser.first_name)).to.not.exist
screen.getByText(msg.user.email)
})
})
})