使用componentDidMount中的axios进行单元测试

时间:2018-04-30 09:29:11

标签: reactjs unit-testing jestjs enzyme

我正在尝试为我的react-app编写一些测试。一般来说,我有一个<App />组件,里面有一个HashRouter,NavLink和Route。因此,我的应用程序组件呈现另一个组件<Emails />,它存储所有提取的电子邮件(我在componentDidMount()中使用axios.get(API URL)。)

现在,我正在尝试测试该应用,但是当我这样做时,它会抛出错误。这是我的测试代码:

import React from 'react';
import ReactDOM from 'react-dom';
import { Route, NavLink, HashRouter } from 'react-router-dom';
import axios from 'axios';
import renderer from 'react-test-renderer';
import Enzyme, { shallow, mount, render } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
Enzyme.configure({ adapter: new Adapter() });
import Emails from '../Emails';
import App from '../App';
import ConfigButton from '../ConfigButton';
import NewEmail from '../NewEmail';
import OpenEmail from '../OpenEmail';
import ReplyEmail from '../ReplyEmail';

const flushPromises = () => new Promise(resolve => setImmediate(resolve));

it('App renders without crashing', () => {
    shallow(<App />);
});

it('NewEmail renders without crashing', () => {
    shallow(<ConfigButton />);
});

it('App snapshot test', async () => {
const wrapper = shallow(<App />);
await flushPromises();
wrapper.update();
expect(wrapper).toMatchSnapshot();
});


jest.mock('axios', () => {
    const exampleMail = [
        {
            "id": "19e74805-7595-4408-8d89-9b74895ca113",
            "created": "2014-02-12 15:21:33",
            "subject": "Voluptatibus distinctio quia nihil earum.",
            "message": "Dicta deleniti qui necessitatibus nemo aliquam nulla praesentium dolorum. Non vel ullam quas ut. Voluptatem vitae eos corrupti ducimus. Et illum excepturi odio quia facere ex non. Possimus expedita pariatur laboriosam error dolores quis est. Dolorem et veniam modi saepe. Sunt aut molestias at dolor autem cumque sed tenetur. Quia quasi ullam vel dolores id. Rerum facilis est sit earum quia est delectus. Enim in reprehenderit qui doloribus. Aut porro necessitatibus accusantium. In eius illo architecto molestias velit. Reiciendis harum unde quia perspiciatis quo in dolor. Dolores voluptas consequatur libero est dolor officiis voluptatem. Aut recusandae voluptatem dolores tempora libero repudiandae et. Rerum facilis soluta harum consequuntur corporis placeat. Dolore quasi ullam ipsa accusamus inventore iusto corporis amet. Quo nisi optio totam qui non et nemo. Soluta eum saepe nihil magnam.",
            "displayed": null,
            "sender": "Bartosz Butrym",
            "recipient": "Prof. Daphnee Williamson Sr."
        }
    ];

    return {
    get: jest.fn(() => Promise.resolve(exampleMail)),
    };
});

it('get emails on #componentDidMount', () => {
    const app = mount(<App><Emails /></App>);
    app
        .instance()
        .componentDidMount()
        .then(() => {
            expect(axios.get).toHaveBeenCalled();
            expect(app.state()).toHaveProperty('mails', [
                {
                    "id": "19e74805-7595-4408-8d89-9b74895ca113",
                    "created": "2014-02-12 15:21:33",
                    "subject": "Voluptatibus distinctio quia nihil earum.",
                    "message": "Dicta deleniti qui necessitatibus nemo aliquam nulla praesentium dolorum. Non vel ullam quas ut. Voluptatem vitae eos corrupti ducimus. Et illum excepturi odio quia facere ex non. Possimus expedita pariatur laboriosam error dolores quis est. Dolorem et veniam modi saepe. Sunt aut molestias at dolor autem cumque sed tenetur. Quia quasi ullam vel dolores id. Rerum facilis est sit earum quia est delectus. Enim in reprehenderit qui doloribus. Aut porro necessitatibus accusantium. In eius illo architecto molestias velit. Reiciendis harum unde quia perspiciatis quo in dolor. Dolores voluptas consequatur libero est dolor officiis voluptatem. Aut recusandae voluptatem dolores tempora libero repudiandae et. Rerum facilis soluta harum consequuntur corporis placeat. Dolore quasi ullam ipsa accusamus inventore iusto corporis amet. Quo nisi optio totam qui non et nemo. Soluta eum saepe nihil magnam.",
                    "displayed": null,
                    "sender": "Bartosz Butrym",
                    "recipient": "Prof. Daphnee Williamson Sr."
                }
            ]);
            done();
        });

});

任何帮助?

0 个答案:

没有答案