diff --git a/src/modules/message/components/MessageSent.js b/src/modules/message/components/MessageSent.js
index e1caf5e..f0de9c8 100644
--- a/src/modules/message/components/MessageSent.js
+++ b/src/modules/message/components/MessageSent.js
@@ -18,8 +18,8 @@ const MessageSent = ({ chat }) => (
))}
- {chat.attachments.map(image => (
-
+ {chat.attachments.map((image, index) => (
+
))}
diff --git a/tests/modules/chatbox/components/ChatBox.test.js b/tests/modules/chatbox/components/ChatBox.test.js
index 112ddce..aaad607 100644
--- a/tests/modules/chatbox/components/ChatBox.test.js
+++ b/tests/modules/chatbox/components/ChatBox.test.js
@@ -1,4 +1,4 @@
-import { render, screen, fireEvent, waitFor } from '@testing-library/react';
+import { act, render, screen, fireEvent } from '@testing-library/react';
import { ChatBox } from '@/modules/chatbox/components';
import Chat from '@/modules/chatbox/utils/textile';
@@ -56,30 +56,30 @@ describe('ChatBox', () => {
expect(chatbox).toBeInTheDocument();
});
- it('Verify that submit is enabled only when a message is typed', () => {
+ it('Verify that submit is enabled only when a message is typed', async () => {
const submitBtn = screen.getByLabelText('Send message').firstChild;
expect(submitBtn).toBeDisabled();
const chatbox = screen.getByRole('textbox');
- fireEvent.change(chatbox, { target: { value: 'Hello' } });
+ await act(async () => fireEvent.change(chatbox, { target: { value: 'Hello' } }));
expect(submitBtn).not.toBeDisabled();
});
it('Verify that submit button triggers callback', async () => {
const chatbox = screen.getByRole('textbox');
- fireEvent.change(chatbox, { target: { value: 'Hello' } });
+ await act(async () => fireEvent.change(chatbox, { target: { value: 'Hello' } }));
const submitBtn = screen.getByLabelText('Send message').firstChild;
expect(submitBtn).not.toBeDisabled();
- submitBtn.click();
+ await act(async () => submitBtn.click());
- await waitFor(() => expect(Chat.post).toHaveBeenCalledWith('1', {
+ expect(Chat.post).toHaveBeenCalledWith('1', {
from: 'address',
to: 'contact',
message: 'Hello',
attachments: [],
- }));
+ });
});
it('Verify that selected emoji is added to chatbox', async () => {
@@ -87,22 +87,21 @@ describe('ChatBox', () => {
expect(chatbox).toHaveValue('');
const emojiOpenBtn = screen.getByLabelText('Add emojis').firstChild;
- emojiOpenBtn.click();
+ await act(async () => emojiOpenBtn.click());
- await waitFor(() => expect(screen.getByRole('button', { name: '😀' })).toBeInTheDocument());
+ expect(screen.getByRole('button', { name: '😀' })).toBeInTheDocument();
const emoji = screen.getByRole('button', { name: '😀' });
- emoji.click();
+ await act(async () => emoji.click());
- await waitFor(() => expect(chatbox).toHaveValue('😀'));
+ expect(chatbox).toHaveValue('😀');
}, 20000); /* 20s timeout */
it('Verify that a file can be attached to chatbox', async () => {
const attachFileBtn = screen.getByLabelText('Attach file').firstChild;
- attachFileBtn.click();
-
- await waitFor(() => expect(Bucket.upload).toHaveBeenCalled());
+ await act(async () => attachFileBtn.click());
+ expect(Bucket.upload).toHaveBeenCalled();
expect(screen.getByText('image.jpg')).toBeInTheDocument();
});
});
diff --git a/tests/modules/file/components/Attachment.test.js b/tests/modules/file/components/Attachment.test.js
new file mode 100644
index 0000000..3652945
--- /dev/null
+++ b/tests/modules/file/components/Attachment.test.js
@@ -0,0 +1,41 @@
+import { render, screen } from '@testing-library/react';
+
+import Attachment from '@/modules/file/components/Attachment';
+
+const file = { name: 'file.png' };
+const address = '0x0000000000000000000000000000000000000000';
+
+const removeFile = jest.fn();
+const setAttachments = jest.fn(() => Promise.resolve());
+
+jest.mock('@/modules/file/utils/image', () => ({
+ __esModule: true,
+ readImage: jest.fn(() => Promise.resolve(Buffer.from(''))),
+}));
+
+jest.mock('@/modules/file/utils/ceramic', () => ({
+ __esModule: true,
+ encrypt: jest.fn(() => Promise.resolve(Buffer.from(''))),
+}));
+
+jest.mock('@/modules/file/utils/bucket', () => ({
+ __esModule: true,
+ default: {
+ getKey: jest.fn(() => Promise.resolve('key')),
+ upload: jest.fn(() => Promise.resolve()),
+ },
+}));
+
+describe('Attachment', () => {
+ it('Verify that error is thrown if required props are not passed', async () => {
+ expect(() => render(
)).toThrowError();
+ expect(() => render(
)).toThrowError();
+ expect(() => render(
)).toThrowError();
+ });
+
+ it('Verify that component is rendered if required props are passed', () => {
+ render(
);
+
+ expect(screen.getByText(file.name)).toBeInTheDocument();
+ });
+});
diff --git a/tests/modules/message/components/Message.test.js b/tests/modules/message/components/Message.test.js
index fae772b..4ef0215 100644
--- a/tests/modules/message/components/Message.test.js
+++ b/tests/modules/message/components/Message.test.js
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react';
+import { act, render, screen } from '@testing-library/react';
import Message from '@/modules/message/components/Message';
@@ -40,16 +40,16 @@ describe('Message', () => {
expect(() => render(
)).toThrowError();
});
- it('Verify that Message component can be rendered', () => {
- render(
);
+ it('Verify that Message component can be rendered', async () => {
+ await act(async () => render(
));
expect(screen.getByText('message')).toBeInTheDocument();
});
- it('Verify that the Message component can render attachments', () => {
+ it('Verify that the Message component can render attachments', async () => {
const _chat = {...chat, attachments: [{location: 'location', mimeType: 'mimeType'}]};
- render(
);
+ await act(async () => render(
));
expect(screen.getByText('message')).toBeInTheDocument();
});
diff --git a/tests/modules/message/components/MessageImage.test.js b/tests/modules/message/components/MessageImage.test.js
index 991da18..91e4d6d 100644
--- a/tests/modules/message/components/MessageImage.test.js
+++ b/tests/modules/message/components/MessageImage.test.js
@@ -1,4 +1,4 @@
-import { render } from '@testing-library/react';
+import { act, render } from '@testing-library/react';
import MessageImage from '@/modules/message/components/MessageImage';
@@ -38,11 +38,12 @@ describe('MessageImage', () => {
expect(() => render(
)).toThrowError();
});
- it('Verify that the MessagImage is rendered as skeleton if no image', () => {
- const { container } = render(
);
+ it('Verify that the MessagImage is rendered as skeleton if no image', async () => {
+ await act(async () => {
+ const { container } = render(
);
- const skeleton = container.querySelector('span.MuiSkeleton-root');
-
- expect(skeleton).toBeInTheDocument();
+ const skeleton = container.querySelector('span.MuiSkeleton-root');
+ expect(skeleton).toBeInTheDocument();
+ });
});
});
diff --git a/tests/modules/profile/components/EditField.test.js b/tests/modules/profile/components/EditField.test.js
index 9cabbec..b515dcc 100644
--- a/tests/modules/profile/components/EditField.test.js
+++ b/tests/modules/profile/components/EditField.test.js
@@ -1,4 +1,4 @@
-import { render, screen, fireEvent, waitFor } from '@testing-library/react';
+import { act, render, screen, fireEvent } from '@testing-library/react';
import EditField from '@/modules/profile/components/EditField';
@@ -24,7 +24,6 @@ describe('Profile', () => {
it('Verify that name & label props are required', () => {
expect(() => render(
)).toThrowError();
expect(() => render(
)).toThrowError();
- expect(() => render(
)).toThrowError();
});
it('Verify that EditField component can be rendered', async () => {
@@ -33,10 +32,10 @@ describe('Profile', () => {
const editField = screen.getByRole('textbox');
expect(editField).toBeInTheDocument();
- fireEvent.change(editField, { target: { value} });
- fireEvent.blur(editField);
+ await act(async () => fireEvent.change(editField, { target: { value} }));
+ await act(async () => fireEvent.blur(editField));
- await waitFor(() => expect(mockUpdateProfile).toHaveBeenCalledWith(address, name, value));
+ expect(mockUpdateProfile).toHaveBeenCalledWith(address, name, value);
});
it('Verify that the validation errors are caught properly', async () => {
@@ -48,8 +47,8 @@ describe('Profile', () => {
expect(editField).toBeInTheDocument();
expect(screen.queryByText(error)).not.toBeInTheDocument();
- await waitFor(() => fireEvent.change(editField, { target: { value } }));
- await waitFor(() => fireEvent.change(editField, { target: { value: '' } }));
+ await act(async () => fireEvent.change(editField, { target: { value } }));
+ await act(async () => fireEvent.change(editField, { target: { value: '' } }) );
expect(screen.getByText(error)).toBeInTheDocument();
});