Skip to content

Commit

Permalink
test: remove MessageStatus tests for legacy styles
Browse files Browse the repository at this point in the history
  • Loading branch information
MartinCupela authored and arnautov-anton committed Jun 28, 2024
1 parent be132cb commit 8f699f8
Show file tree
Hide file tree
Showing 2 changed files with 161 additions and 320 deletions.
314 changes: 156 additions & 158 deletions src/components/Message/__tests__/MessageStatus.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -56,184 +56,182 @@ const renderComponent = ({ chatCtx, componentCtx, messageCtx, props } = {}) =>
);

describe('MessageStatus', () => {
describe.each(['1', '2'])('theme v%s', (themeVersion) => {
it('renders nothing for not own messages', async () => {
const client = await getTestClientWithUser(user);
const { container } = renderComponent({
chatCtx: { client, themeVersion },
messageCtx: { isMyMessage: () => false, message: foreignMsg },
});
expect(container).toBeEmptyDOMElement();
it('renders nothing for not own messages', async () => {
const client = await getTestClientWithUser(user);
const { container } = renderComponent({
chatCtx: { client },
messageCtx: { isMyMessage: () => false, message: foreignMsg },
});
it('renders nothing for error messages', async () => {
const client = await getTestClientWithUser(user);
const { container } = renderComponent({
chatCtx: { client, themeVersion },
messageCtx: { message: errorMsg },
});
expect(container).toBeEmptyDOMElement();
expect(container).toBeEmptyDOMElement();
});
it('renders nothing for error messages', async () => {
const client = await getTestClientWithUser(user);
const { container } = renderComponent({
chatCtx: { client },
messageCtx: { message: errorMsg },
});
expect(container).toBeEmptyDOMElement();
});

it('renders default sending UI for the last message', async () => {
const client = await getTestClientWithUser(user);
renderComponent({
chatCtx: { client, themeVersion },
messageCtx: { lastReceivedId: sendingMsg.id, message: sendingMsg },
});
expect(screen.getByTestId(MESSAGE_STATUS_SENDING_TEST_ID)).toMatchSnapshot();
it('renders default sending UI for the last message', async () => {
const client = await getTestClientWithUser(user);
renderComponent({
chatCtx: { client },
messageCtx: { lastReceivedId: sendingMsg.id, message: sendingMsg },
});
expect(screen.getByTestId(MESSAGE_STATUS_SENDING_TEST_ID)).toMatchSnapshot();
});

it('renders custom sending UI for the last message', async () => {
const text = 'CustomMessageSendingStatus';
const MessageSendingStatus = () => <div>{text}</div>;
const client = await getTestClientWithUser(user);
renderComponent({
chatCtx: { client, themeVersion },
messageCtx: { lastReceivedId: sendingMsg.id, message: sendingMsg },
props: { MessageSendingStatus },
});
expect(screen.getByText(text)).toBeInTheDocument();
it('renders custom sending UI for the last message', async () => {
const text = 'CustomMessageSendingStatus';
const MessageSendingStatus = () => <div>{text}</div>;
const client = await getTestClientWithUser(user);
renderComponent({
chatCtx: { client },
messageCtx: { lastReceivedId: sendingMsg.id, message: sendingMsg },
props: { MessageSendingStatus },
});
expect(screen.getByText(text)).toBeInTheDocument();
});

it('renders default sending UI for not the last message', async () => {
const client = await getTestClientWithUser(user);
renderComponent({ chatCtx: { client, themeVersion }, messageCtx: { message: sendingMsg } });
expect(screen.getByTestId(MESSAGE_STATUS_SENDING_TEST_ID)).toMatchSnapshot();
});
it('renders default sending UI for not the last message', async () => {
const client = await getTestClientWithUser(user);
renderComponent({ chatCtx: { client }, messageCtx: { message: sendingMsg } });
expect(screen.getByTestId(MESSAGE_STATUS_SENDING_TEST_ID)).toMatchSnapshot();
});

it('renders custom sending UI for not the last message', async () => {
const text = 'CustomMessageSendingStatus';
const MessageSendingStatus = () => <div>{text}</div>;
const client = await getTestClientWithUser(user);
renderComponent({
chatCtx: { client, themeVersion },
messageCtx: { message: sendingMsg },
props: { MessageSendingStatus },
});
expect(screen.getByText(text)).toBeInTheDocument();
it('renders custom sending UI for not the last message', async () => {
const text = 'CustomMessageSendingStatus';
const MessageSendingStatus = () => <div>{text}</div>;
const client = await getTestClientWithUser(user);
renderComponent({
chatCtx: { client },
messageCtx: { message: sendingMsg },
props: { MessageSendingStatus },
});
expect(screen.getByText(text)).toBeInTheDocument();
});

// here
it('renders default delivered UI for the last message', async () => {
const client = await getTestClientWithUser(user);
renderComponent({
chatCtx: { client, themeVersion },
messageCtx: { lastReceivedId: deliveredMsg.id, message: deliveredMsg },
});
expect(screen.getByTestId(MESSAGE_STATUS_DELIVERED_TEST_ID)).toMatchSnapshot();
// here
it('renders default delivered UI for the last message', async () => {
const client = await getTestClientWithUser(user);
renderComponent({
chatCtx: { client },
messageCtx: { lastReceivedId: deliveredMsg.id, message: deliveredMsg },
});
expect(screen.getByTestId(MESSAGE_STATUS_DELIVERED_TEST_ID)).toMatchSnapshot();
});

it('renders custom delivered UI for the last message', async () => {
const text = 'CustomMessageDeliveredStatus';
const MessageDeliveredStatus = () => <div>{text}</div>;
const client = await getTestClientWithUser(user);
renderComponent({
chatCtx: { client, themeVersion },
messageCtx: { lastReceivedId: deliveredMsg.id, message: deliveredMsg },
props: { MessageDeliveredStatus },
});
expect(screen.getByText(text)).toBeInTheDocument();
it('renders custom delivered UI for the last message', async () => {
const text = 'CustomMessageDeliveredStatus';
const MessageDeliveredStatus = () => <div>{text}</div>;
const client = await getTestClientWithUser(user);
renderComponent({
chatCtx: { client },
messageCtx: { lastReceivedId: deliveredMsg.id, message: deliveredMsg },
props: { MessageDeliveredStatus },
});
expect(screen.getByText(text)).toBeInTheDocument();
});

it('renders empty container without default delivered UI for not the last message', async () => {
const client = await getTestClientWithUser(user);
const { container } = renderComponent({
chatCtx: { client, themeVersion },
messageCtx: { message: deliveredMsg },
});
expect(container.children[0]).toHaveClass(rootClassName);
expect(container.children[0]).toBeEmptyDOMElement();
it('renders empty container without default delivered UI for not the last message', async () => {
const client = await getTestClientWithUser(user);
const { container } = renderComponent({
chatCtx: { client },
messageCtx: { message: deliveredMsg },
});
expect(container.children[0]).toHaveClass(rootClassName);
expect(container.children[0]).toBeEmptyDOMElement();
});

it('renders empty container without custom delivered UI for not the last message', async () => {
const text = 'CustomMessageDeliveredStatus';
const MessageDeliveredStatus = () => <div>{text}</div>;
const client = await getTestClientWithUser(user);
const { container } = renderComponent({
chatCtx: { client, themeVersion },
messageCtx: { message: deliveredMsg },
props: { MessageDeliveredStatus },
});
expect(container.children[0]).toHaveClass(rootClassName);
expect(container.children[0]).toBeEmptyDOMElement();
});
it('renders empty container without custom delivered UI for not the last message', async () => {
const text = 'CustomMessageDeliveredStatus';
const MessageDeliveredStatus = () => <div>{text}</div>;
const client = await getTestClientWithUser(user);
const { container } = renderComponent({
chatCtx: { client },
messageCtx: { message: deliveredMsg },
props: { MessageDeliveredStatus },
});
expect(container.children[0]).toHaveClass(rootClassName);
expect(container.children[0]).toBeEmptyDOMElement();
});

it('renders default read UI for the last message', async () => {
const client = await getTestClientWithUser(user);
renderComponent({
chatCtx: { client, themeVersion },
messageCtx: {
lastReceivedId: deliveredMsg.id,
message: deliveredMsg,
readBy: readByOthers,
},
});
expect(screen.getByTestId(MESSAGE_STATUS_READ_TEST_ID)).toMatchSnapshot();
});
it('renders custom read UI for the last message', async () => {
const text = 'CustomMessageReadStatus';
const MessageReadStatus = () => <div>{text}</div>;
const client = await getTestClientWithUser(user);
renderComponent({
chatCtx: { client, themeVersion },
messageCtx: {
lastReceivedId: deliveredMsg.id,
message: deliveredMsg,
readBy: readByOthers,
},
props: { MessageReadStatus },
});
expect(screen.getByText(text)).toBeInTheDocument();
});
it('renders empty container without default read UI for not the last message', async () => {
const client = await getTestClientWithUser(user);
const { container } = renderComponent({
chatCtx: { client, themeVersion },
messageCtx: { message: deliveredMsg },
});
expect(container.children[0]).toHaveClass(rootClassName);
expect(container.children[0]).toBeEmptyDOMElement();
});
it('renders default read UI for the last message', async () => {
const client = await getTestClientWithUser(user);
renderComponent({
chatCtx: { client },
messageCtx: {
lastReceivedId: deliveredMsg.id,
message: deliveredMsg,
readBy: readByOthers,
},
});
expect(screen.getByTestId(MESSAGE_STATUS_READ_TEST_ID)).toMatchSnapshot();
});
it('renders custom read UI for the last message', async () => {
const text = 'CustomMessageReadStatus';
const MessageReadStatus = () => <div>{text}</div>;
const client = await getTestClientWithUser(user);
renderComponent({
chatCtx: { client },
messageCtx: {
lastReceivedId: deliveredMsg.id,
message: deliveredMsg,
readBy: readByOthers,
},
props: { MessageReadStatus },
});
expect(screen.getByText(text)).toBeInTheDocument();
});
it('renders empty container without default read UI for not the last message', async () => {
const client = await getTestClientWithUser(user);
const { container } = renderComponent({
chatCtx: { client },
messageCtx: { message: deliveredMsg },
});
expect(container.children[0]).toHaveClass(rootClassName);
expect(container.children[0]).toBeEmptyDOMElement();
});

it('renders empty container without custom read UI for not the last message', async () => {
const text = 'CustomMessageReadStatus';
const MessageReadStatus = () => <div>{text}</div>;
const client = await getTestClientWithUser(user);
const { container } = renderComponent({
chatCtx: { client, themeVersion },
messageCtx: { message: deliveredMsg },
props: { MessageReadStatus },
});
expect(container.children[0]).toHaveClass(rootClassName);
expect(container.children[0]).toBeEmptyDOMElement();
});
it('renders empty container without custom read UI for not the last message', async () => {
const text = 'CustomMessageReadStatus';
const MessageReadStatus = () => <div>{text}</div>;
const client = await getTestClientWithUser(user);
const { container } = renderComponent({
chatCtx: { client },
messageCtx: { message: deliveredMsg },
props: { MessageReadStatus },
});
expect(container.children[0]).toHaveClass(rootClassName);
expect(container.children[0]).toBeEmptyDOMElement();
});

it('renders custom Avatar in default read status', async () => {
const text = 'CustomAvatar';
const Avatar = () => <div>{text}</div>;
const client = await getTestClientWithUser(user);
renderComponent({
chatCtx: { client, themeVersion },
messageCtx: {
lastReceivedId: deliveredMsg.id,
message: deliveredMsg,
readBy: readByOthers,
},
props: { Avatar },
});
expect(screen.getByText(text)).toBeInTheDocument();
expect(screen.queryByTestId('avatar')).not.toBeInTheDocument();
});
it('renders custom Avatar in default read status', async () => {
const text = 'CustomAvatar';
const Avatar = () => <div>{text}</div>;
const client = await getTestClientWithUser(user);
renderComponent({
chatCtx: { client },
messageCtx: {
lastReceivedId: deliveredMsg.id,
message: deliveredMsg,
readBy: readByOthers,
},
props: { Avatar },
});
expect(screen.getByText(text)).toBeInTheDocument();
expect(screen.queryByTestId('avatar')).not.toBeInTheDocument();
});

it('reflects messageType prop in root class', async () => {
const client = await getTestClientWithUser(user);
const { container } = renderComponent({
chatCtx: { client, themeVersion },
messageCtx: { message: deliveredMsg },
props: { messageType: 'XXX' },
});
expect(container.children[0]).not.toHaveClass('str-chat__message-simple-status');
expect(container.children[0]).toHaveClass('str-chat__message-XXX-status');
it('reflects messageType prop in root class', async () => {
const client = await getTestClientWithUser(user);
const { container } = renderComponent({
chatCtx: { client },
messageCtx: { message: deliveredMsg },
props: { messageType: 'XXX' },
});
expect(container.children[0]).not.toHaveClass('str-chat__message-simple-status');
expect(container.children[0]).toHaveClass('str-chat__message-XXX-status');
});
});
Loading

0 comments on commit 8f699f8

Please sign in to comment.