Skip to content

Commit

Permalink
test: open MessageActionsBox first in MessageActionsBox.test.js
Browse files Browse the repository at this point in the history
  • Loading branch information
@MartinCupela
MartinCupela committed Sep 6, 2024
1 parent 07eb261 commit d9f3709
Show file tree
Hide file tree
Showing 3 changed files with 34 additions and 24 deletions.
1 change: 1 addition & 0 deletions src/components/MessageActions/MessageActions.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -128,6 +128,7 @@ export const MessageActions = <
aria-haspopup='true'
aria-label={t('aria/Open Message Actions Menu')}
className='str-chat__message-actions-box-button'
data-testid='message-actions-toggle-button'
onClick={dialog?.toggleSingle}
ref={actionsBoxButtonRef}
>
Expand Down
3 changes: 3 additions & 0 deletions src/components/MessageActions/__tests__/MessageActions.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -89,6 +89,7 @@ describe('<MessageActions /> component', () => {
aria-haspopup="true"
aria-label="Open Message Actions Menu"
className="str-chat__message-actions-box-button"
data-testid="message-actions-toggle-button"
onClick={[Function]}
>
<svg
Expand Down Expand Up @@ -236,6 +237,7 @@ describe('<MessageActions /> component', () => {
aria-haspopup="true"
aria-label="Open Message Actions Menu"
className="str-chat__message-actions-box-button"
data-testid="message-actions-toggle-button"
onClick={[Function]}
>
<svg
Expand Down Expand Up @@ -285,6 +287,7 @@ describe('<MessageActions /> component', () => {
aria-haspopup="true"
aria-label="Open Message Actions Menu"
className="str-chat__message-actions-box-button"
data-testid="message-actions-toggle-button"
onClick={[Function]}
>
<svg
Expand Down
54 changes: 30 additions & 24 deletions src/components/MessageActions/__tests__/MessageActionsBox.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,13 @@ const defaultMessageContextValue = {
messageListRect: {},
};

const TOGGLE_ACTIONS_BUTTON_TEST_ID = 'message-actions-toggle-button';
const toggleOpenMessageActions = async (i = 0) => {
await act(async () => {
await fireEvent.click(screen.getAllByTestId(TOGGLE_ACTIONS_BUTTON_TEST_ID)[i]);
});
};

async function renderComponent(boxProps, messageContext = {}) {
const { client } = await initClientWithChannels();
return render(
Expand Down Expand Up @@ -171,7 +178,6 @@ describe('MessageActionsBox', () => {
describe('mark message unread', () => {
afterEach(jest.restoreAllMocks);
const ACTION_TEXT = 'Mark as unread';
const TOGGLE_ACTIONS_BUTTON_TEST_ID = 'message-actions';
const me = generateUser();
const otherUser = generateUser();
const message = generateMessage({ user: otherUser });
Expand Down Expand Up @@ -254,9 +260,7 @@ describe('MessageActionsBox', () => {
chatProps: { client },
messageProps: { message },
});
await act(async () => {
await fireEvent.click(screen.getByTestId(TOGGLE_ACTIONS_BUTTON_TEST_ID));
});
await toggleOpenMessageActions();
expect(screen.queryByText(ACTION_TEXT)).not.toBeInTheDocument();
});

Expand All @@ -281,9 +285,7 @@ describe('MessageActionsBox', () => {
chatProps: { client },
messageProps: { message: myMessage },
});
await act(async () => {
await fireEvent.click(screen.getByTestId(TOGGLE_ACTIONS_BUTTON_TEST_ID));
});
await toggleOpenMessageActions();
expect(screen.queryByText(ACTION_TEXT)).toBeInTheDocument();
});

Expand All @@ -301,9 +303,7 @@ describe('MessageActionsBox', () => {
chatProps: { client },
messageProps: { message, threadList: true },
});
await act(async () => {
await fireEvent.click(screen.getByTestId(TOGGLE_ACTIONS_BUTTON_TEST_ID));
});
await toggleOpenMessageActions();
expect(screen.queryByText(ACTION_TEXT)).not.toBeInTheDocument();
});

Expand Down Expand Up @@ -336,9 +336,7 @@ describe('MessageActionsBox', () => {
});
});

await act(async () => {
await fireEvent.click(screen.getByTestId(TOGGLE_ACTIONS_BUTTON_TEST_ID));
});
await toggleOpenMessageActions();
expect(screen.queryByText(ACTION_TEXT)).toBeInTheDocument();
});

Expand All @@ -365,20 +363,18 @@ describe('MessageActionsBox', () => {
chatProps: { client },
messageProps: { message: messageWithoutID },
});
await act(async () => {
await fireEvent.click(screen.getByTestId(TOGGLE_ACTIONS_BUTTON_TEST_ID));
});
await toggleOpenMessageActions();
expect(screen.queryByText(ACTION_TEXT)).not.toBeInTheDocument();
});

it('should be displayed as an option for messages other than message marked unread', async () => {
it('should be displayed as an option for messages not marked and marked unread', async () => {
const otherMsg = generateMessage({
created_at: new Date(new Date(message.created_at).getTime() + 1000),
created_at: new Date(new Date(message.created_at).getTime() + 2000),
});
const read = [
{
first_unread_message_id: message.id,
last_read: new Date(new Date(message.created_at).getTime() - 1000),
first_unread_message_id: otherMsg.id,
last_read: new Date(new Date(otherMsg.created_at).getTime() - 1000),
// last_read_message_id: message.id, // optional
unread_messages: 2,
user: me,
Expand Down Expand Up @@ -410,10 +406,17 @@ describe('MessageActionsBox', () => {
</Chat>,
);
});

const [actionsBox1, actionsBox2] = screen.getAllByTestId('message-actions-box');
expect(actionsBox1).toHaveTextContent(ACTION_TEXT);
expect(actionsBox2).toHaveTextContent(ACTION_TEXT);
await toggleOpenMessageActions(0);
let boxes = screen.getAllByTestId('message-actions-box');
// eslint-disable-next-line jest-dom/prefer-in-document
expect(boxes).toHaveLength(1);
expect(boxes[0]).toHaveTextContent(ACTION_TEXT);

await toggleOpenMessageActions(1);
boxes = screen.getAllByTestId('message-actions-box');
// eslint-disable-next-line jest-dom/prefer-in-document
expect(boxes).toHaveLength(1);
expect(boxes[0]).toHaveTextContent(ACTION_TEXT);
});

it('should be displayed and execute API request', async () => {
Expand All @@ -431,6 +434,7 @@ describe('MessageActionsBox', () => {
chatProps: { client },
messageProps: { message },
});
await toggleOpenMessageActions();
await act(async () => {
await fireEvent.click(screen.getByTestId(TOGGLE_ACTIONS_BUTTON_TEST_ID));
await fireEvent.click(screen.getByText(ACTION_TEXT));
Expand All @@ -456,6 +460,7 @@ describe('MessageActionsBox', () => {
chatProps: { client },
messageProps: { getMarkMessageUnreadSuccessNotification, message },
});
await toggleOpenMessageActions();
await act(async () => {
await fireEvent.click(screen.getByTestId(TOGGLE_ACTIONS_BUTTON_TEST_ID));
await fireEvent.click(screen.getByText(ACTION_TEXT));
Expand All @@ -481,6 +486,7 @@ describe('MessageActionsBox', () => {
chatProps: { client },
messageProps: { getMarkMessageUnreadErrorNotification, message },
});
await toggleOpenMessageActions();
await act(async () => {
await fireEvent.click(screen.getByTestId(TOGGLE_ACTIONS_BUTTON_TEST_ID));
await fireEvent.click(screen.getByText(ACTION_TEXT));
Expand Down

0 comments on commit d9f3709

Please sign in to comment.