Improved test for Team Component

src/__tests__/components/About/Team/Team.js

@@ -1,9 +1,35 @@
 import React from 'react';
 import Team from '../../../../components/About/Team';
-import { shallow } from 'enzyme';
-
+import { shallow, mount } from 'enzyme';
+import Card from '@material-ui/core/Card';
+// eslint-disable-next-line no-undef
+jest.mock('../../../../apis/index');
+// eslint-disable-next-line no-undef
+jest.mock('../../../../constants/team');
 describe('<Team />', () => {
   it('render Team without crashing', () => {
     shallow(<Team location={{ pathname: '/team' }} />);
   });
+
+  it('renders contributor data fetched from api', (done) => {
+    // eslint-disable-next-line no-undef
+    const wrapper = mount(<Team />);
+    const testNames = [
+      'MEMBER 1',
+      'MEMBER 2',
+      'MANAGER 1Event Manager',
+      'MANAGER 2Community and Project Manager',
+      'contributer1',
+      'contributer2',
+    ];
+    setTimeout(() => {
+      wrapper.update();
+      const cards = wrapper.find(Card.displayName);
+      // eslint-disable-next-line max-nested-callbacks
+      cards.forEach((card, i) => {
+        expect(card.text() === testNames[i]).toBeTruthy();
+      });
+      done();
+    });
+  });
 });

src/apis/__mocks__/index.js

@@ -0,0 +1,18 @@
+export async function getContributors() {
+  const data = [
+    {
+      avatar: 'https://avatars3.githubusercontent.com/u/contributer1_avatar',
+      github: 'https://github.com/contributer1',
+      name: 'contributer1',
+    },
+    {
+      avatar: 'https://avatars0.githubusercontent.com/u/contributer2_avatar',
+      github: 'https://github.com/contributer2',
+      name: 'contributer2',
+    },
+  ];
+
+  return new Promise((resolve, reject) => {
+    resolve(data);
+  });
+}

src/components/About/Team/index.js

@@ -140,6 +140,7 @@ const Team = (props) => {
 
     (async function fetchContributorsList() {
       const response = await getContributors();
+
       let flags = [],
         output = [];
       for (let i = 0; i < response.length; i++) {

src/constants/__mocks__/team.js

@@ -0,0 +1,43 @@
+const TEAM_MEMBERS = {
+  MENTORS: [
+    {
+      name: 'MEMBER 1',
+      github: 'http://github.com/member1',
+      avatar: 'test_member.png',
+      twitter: 'https://twitter.com/member1',
+      linkedin: 'https://www.linkedin.com/in/member1/',
+      blog: '#',
+    },
+    {
+      name: 'MEMBER 2',
+      github: 'https://github.com/member2',
+      avatar: 'test_member.png',
+      twitter: 'https://twitter.com/member2',
+      linkedin: 'https://www.linkedin.com/in/member2/',
+      blog: '#',
+    },
+  ],
+
+  MANAGERS: [
+    {
+      name: 'MANAGER 1',
+      github: '#',
+      avatar: 'test_member.png',
+      designation: 'Event Manager',
+      twitter: 'https://twitter.com/manager1',
+      linkedin: 'https://www.linkedin.com/in/manager1/',
+      blog: '#',
+    },
+    {
+      name: 'MANAGER 2',
+      github: 'https://github.com/Manager2',
+      avatar: 'test_member.png',
+      designation: 'Community and Project Manager',
+      twitter: 'https://twitter.com/manager2',
+      linkedin: 'https://www.linkedin.com/in/manager2/',
+      blog: '#',
+    },
+  ],
+};
+
+export default TEAM_MEMBERS;