为什么TypeError：axios.create不是函数？测试axios GET时

Question

我正在尝试在React中测试我的axios API函数。

在此处发现此问题：how do i test axios in jest指向使用axios-mock-adapter

import axios from 'axios';
import MockAdapter from 'axios-mock-adapter';
import chatbot from './chatbot';

describe('Chatbot', () => {
    it('returns data when sendMessage is called', done => {
        var mock = new MockAdapter(axios);
        const data = { response: true };
        mock.onGet('https://us-central1-hutoma-backend.cloudfunctions.net/chat').reply(200, data);

        chatbot.sendMessage(0, 'any').then(response => {
            expect(response).toEqual(data);
            done();
        });
    });
});

真正的功能：

/**
 * Retrieve all Akamai images
 * @param  {String} akamai Akamai url
 * @return {Thenable}      Resolved: Akamai images
 */
export const callGetAkamai = () =>
  makeRequest('/akamai', 'GET')
    .catch(defaultCatch('callGetAkamai'));

我的测试：

import axios from 'axios';
import MockAdapter from 'axios-mock-adapter';
import { callGetAkamai } from './api';

describe('GetAkamai', () => {
  it('returns data when callGetAkamai is called', (done) => {
    console.log('MockAdapter', MockAdapter);
    const mock = new MockAdapter(axios);
    // const mock = axios.create({
    //   baseURL: 'https://us-central1-hutoma-backend.cloudfunctions.net/chat/'
    // });

    const data = { response: true };
    mock.onGet('https://us-central1-hutoma-backend.cloudfunctions.net/chat').reply(200, data);

    callGetAkamai().then((response) => {
      expect(response).toEqual(data);
      done();
    });
  });
});

Answer 1

你是否已经嘲笑 function sku2id( $sku = false ) { global $wpdb; if( !$sku ) return null; $product_id = $wpdb->get_var( $wpdb->prepare( "SELECT post_id FROM $wpdb->postmeta WHERE meta_key='_sku' AND meta_value='%s' LIMIT 1", $sku ) ); if ( $product_id ) return $product_id; return null; } add_action( 'template_redirect', 'auto_add_product_to_cart' ); function auto_add_product_to_cart() { if ( is_admin() ) return; // Product Id of the free product which will get added to cart; $product_id = sku2id("Surprise"); // FREE PRODUCT MUST HAVE SKU Surprise if ( WC()->cart->is_empty() ) { // No products in cart, we add it WC()->cart->add_to_cart( $product_id ); } else { $found = false; //check if product already in cart foreach ( WC()->cart->get_cart() as $cart_item ) { if ( $cart_item['data']->get_id() == $product_id ) $found = true; } // if the product is not in cart, we add it if ( ! $found ) WC()->cart->add_to_cart( $product_id ); } } 了？我自己遇到过这个问题，在查看了所有错误的地方之后，我意识到我已经用axios嘲笑axios了。

将以下代码段放在setupTestFrameworkScriptFile：

中

jest

虽然您可以同时执行这两项操作，但如果您使用的是const mockNoop = () => new Promise(() => {}); // Notice how `create` was not being mocked here... jest.mock('axios', () => ({ default: mockNoop, get: mockNoop, post: mockNoop, put: mockNoop, delete: mockNoop, patch: mockNoop })); ，则可能需要删除其他模拟（并跳过上面的代码段）。

Answer 2

在此添加问题，因为它是google在该问题上的第一击，而选择的答案并不能真正回答问题。

当您已经在模拟axios时（通常在__mocks__文件夹中，就会发生此问题。

通过玩笑，您可以显式取消模拟，然后将其称为axios-mock-adapter。

jest.unmock('axios');
import axios from 'axios';
import MockAdapter from 'axios-mock-adapter';
...

axios-mock-adapter在处理外部请求时提供了很好的，灵活的api。但是，它并不能全局阻止您的应用发出由其他组件中的测试触发的外部调用。

因此，我发现同时使用axios-mock-adapter和在__mocks__文件夹中进行手动模拟同样有用。