使用 Mocha 测试 Vue GraphQl 客户端组件时出错

如何解决使用 Mocha 测试 Vue GraphQl 客户端组件时出错

我正在尝试测试一个使用 GraphQL 获取数据的 vue 组件。我正在使用 Mocha 和 Chai。

import { expect } from 'chai'
import { mount } from '@vue/test-utils'
import OutlierFetcher from '@/components/OutlierFetcher.vue'

describe('OutlierFetcher.vue',() => {
  it('renders h1 tag',() => {
    const wrapper = mount(OutlierFetcher);
    expect(
      wrapper
        .find("h1")
        .text() == "Helloworld"
    );
  })
})

当我尝试运行 npm run test:unit 时。我收到此错误：

    Invariant Violation: 
    "fetch" has not been found globally and no fetcher has been configured. 
    To fix this,install a fetch package (like 
    https://www.npmjs.com/package/cross-fetch),instantiate the fetcher,and 
    pass it into your HttpLink constructor. For example:

import fetch from 'cross-fetch';
import { ApolloClient,HttpLink } from '@apollo/client';
const client = new ApolloClient({
  link: new HttpLink({ uri: '/graphql',fetch })
});

vue组件的graphql查询设置如下图：

const defaultClient = new ApolloClient({
  uri: 'http://localhost:8081/query',cache: new InMemoryCache()
})

const query = gql `query outliers($dataId: String!) {
                      outliers(dataId: $dataId) {
                        Data
                      }
                   }`
                   
fetchOutliers() {
      this.loading = true;
      defaultClient.cache.reset();
      defaultClient.query({ query: query,variables: { dataId: this.dataname}
                         }).then(res =>       this.updateOutliers(res.data.outliers)); 
    },