diff --git a/ui/pages/settings/contact-list-tab/add-contact/add-contact.test.js b/ui/pages/settings/contact-list-tab/add-contact/add-contact.test.js new file mode 100644 index 000000000..2cc5234de --- /dev/null +++ b/ui/pages/settings/contact-list-tab/add-contact/add-contact.test.js @@ -0,0 +1,63 @@ +import React from 'react'; +import { fireEvent } from '@testing-library/react'; +import configureMockStore from 'redux-mock-store'; +import thunk from 'redux-thunk'; +import { renderWithProvider } from '../../../../../test/lib/render-helpers'; +import '@testing-library/jest-dom/extend-expect'; +import AddContact from './add-contact.component'; + +describe('AddContact component', () => { + const middleware = [thunk]; + const state = { + metamask: { + provider: { + type: 'mainnet', + nickname: '', + }, + }, + }; + const props = { + history: { push: jest.fn() }, + addToAddressBook: jest.fn(), + scanQrCode: jest.fn(), + qrCodeData: { type: 'address', values: { address: '0x123456789abcdef' } }, + qrCodeDetected: jest.fn(), + domainResolution: '', + domainError: '', + resetDomainResolution: jest.fn(), + }; + + it('should render the component with correct properties', () => { + const store = configureMockStore(middleware)(state); + + const { getByText } = renderWithProvider(<AddContact {...props} />, store); + + expect(getByText('Username')).toBeInTheDocument(); + expect(getByText('Ethereum public address')).toBeInTheDocument(); + }); + + it('should validate the address correctly', () => { + const store = configureMockStore(middleware)(state); + const { getByText, getByTestId } = renderWithProvider( + <AddContact {...props} />, + store, + ); + + const input = getByTestId('ens-input'); + fireEvent.change(input, { target: { value: 'invalid address' } }); + setTimeout(() => { + expect(getByText('Recipient address is invalid')).toBeInTheDocument(); + }, 100); + }); + + it('should get disabled submit button when username field is empty', () => { + const store = configureMockStore(middleware)(state); + const { getByText } = renderWithProvider(<AddContact {...props} />, store); + + const input = document.getElementById('nickname'); + fireEvent.change(input, { target: { value: '' } }); + + const saveButton = getByText('Save'); + expect(saveButton).toBeDisabled(); + }); +});