Merge branch 'improve-test-coverage-for-account' into 'develop'

Improve Account test coverage

See merge request soapbox-pub/soapbox-fe!1417

app/soapbox/components/__tests__/account.test.tsx

@@ -0,0 +1,67 @@
+import { Map as ImmutableMap } from 'immutable';
+import React from 'react';
+
+import { render, screen } from '../../jest/test-helpers';
+import { normalizeAccount } from '../../normalizers';
+import Account from '../account';
+
+describe('<Account />', () => {
+  it('renders account name and username', () => {
+    const account = normalizeAccount({
+      id: '1',
+      acct: 'justin-username',
+      display_name: 'Justin L',
+      avatar: 'test.jpg',
+    });
+
+    const store = {
+      accounts: ImmutableMap({
+        '1': account,
+      }),
+    };
+
+    render(<Account account={account} />, null, store);
+    expect(screen.getByTestId('account')).toHaveTextContent('Justin L');
+    expect(screen.getByTestId('account')).toHaveTextContent(/justin-username/i);
+  });
+
+  describe('verification badge', () => {
+    it('renders verification badge', () => {
+      const account = normalizeAccount({
+        id: '1',
+        acct: 'justin-username',
+        display_name: 'Justin L',
+        avatar: 'test.jpg',
+        verified: true,
+      });
+
+      const store = {
+        accounts: ImmutableMap({
+          '1': account,
+        }),
+      };
+
+      render(<Account account={account} />, null, store);
+      expect(screen.getByTestId('verified-badge')).toBeInTheDocument();
+    });
+
+    it('does not render verification badge', () => {
+      const account = normalizeAccount({
+        id: '1',
+        acct: 'justin-username',
+        display_name: 'Justin L',
+        avatar: 'test.jpg',
+        verified: false,
+      });
+
+      const store = {
+        accounts: ImmutableMap({
+          '1': account,
+        }),
+      };
+
+      render(<Account account={account} />, null, store);
+      expect(screen.queryAllByTestId('verified-badge')).toHaveLength(0);
+    });
+  });
+});

app/soapbox/components/verification_badge.tsx

@@ -24,7 +24,7 @@ const VerificationBadge: React.FC<IVerificationBadge> = ({ className }) => {
   const Element = icon.endsWith('.svg') ? Icon : 'img';
 
   return (
-    <span className='verified-icon'>
+    <span className='verified-icon' data-testid='verified-badge'>
       <Element className={classNames('w-4 text-accent-500', className)} src={icon} alt={intl.formatMessage(messages.verified)} />
     </span>
   );