如何在React中为axios设置正确的测试?

Question

我在React中使用axios，我在测试时遇到问题

这是我到目前为止在test.js文件中所做的:

jest.mock('axios');
describe('RssFeed', () => {
let component;
let data;
beforeEach( () => {
data = data {
data: {...}
};
}
test('fetches data successfully', (done) => {
axios.get.mockResolvedValue(data);
setTimeout(() => {
expect(axios).toHaveBeenCalled();
done();
}, 500);
});
});

我就是这样得到axios的。在我的组件中设置:

const [feedBody, setFeedBody] = useState([]);
const apiUrl = 'apiUrl';
useEffect( () => {
axios.get(apiUrl)
.then((response) => (response.data))
.then((data) => {
setFeedBody(data);
})
.catch((err) => console.log(err));
}, []);

运行测试后，得到:

Error: Uncaught [Error: expect(jest.fn()).toHaveBeenCalled()]预期呼叫数:>= 1已接电话数:0]

Thanks in advance

Answer 1

我建议使用axios-mock-adapter，它非常方便:

import axios from 'axios';
import MockAdapter from 'axios-mock-adapter';
const mock = new MockAdapter(axios);
const resp = 'success';
const testInput = 'testInput';
mock.onGet().reply(200, resp);
// expect feedBody to be 'success'
mock.reset();