javascript Jest类型错误:fetch不是函数

mmvthczy  于 2023-02-28  发布在  Java
关注(0)|答案(5)|浏览(209)

我有下面的Jest测试代码来测试对一个 * 端点 * 的 fetch

import MovieApiService from 'services/MovieApiService';
import movies from '../constants/movies';

describe('MovieApiService', () => {

  test('if jest work correctly', () => {
    expect(true).toBe(true);
  });

  test('get an array of popular movies', () => {
    global.fetch = jest.mock('../mocks/movies');
    const movieApiService = new MovieApiService();
    return movieApiService.getPopularMovies()
      .then(data => expect(data).toBe(movies));
  });
});

但我得到了:

我知道movieApiService.getPopularMovies()是一个 *JavaScript fetch请求 *,但是 Node.js 没有fetch API,那么我怎样才能使用Jest使这个测试工作呢?

f0ofjuux

f0ofjuux1#

我无法用您提供的代码进行测试,但是安装并导入npm模块jest-fetch-mock应该可以。

oknrviil

oknrviil2#

尝试让您的模拟实现特定于测试用例,如果多个测试用例绑定使用相同的实现,则将它们 Package 在一个describe块中,并在其中包含一个beforeEach调用。
这有助于描述特定于被测试场景的模拟实现。
使用您提供的代码来测试您的实现是很困难的,但是让我们尝试将您的模拟实现切换为类似于下面的代码:

// This is just dummy data - change its shape in a format that your API renders.
const dummyMoviesData = [
    {title: 'some-tilte-1', body: 'some-1'},
    {title: 'some-tilte-2', body: 'some-2'},
    {title: 'some-tilte-3', body: 'some-3'}
];
global.fetch = jest.fn(() => Promise.resolve(dummyMoviesData));

现在,无论何时调用电影服务API,您都可能期望结果是dummyMoviesData的形状,甚至与之匹配。
所以,

expect(outcome).toMatchObject(dummyMoviesData);

expect(outcome).toEqual(dummyMoviesData);

应该可以。

6bc51xsx

6bc51xsx3#

截至2020年10月,解决错误TypeError: fetch is not function的方法是使用whatwg-fetch包含提取的多边形填充。
该软件包为.fetch提供了polyfill,自2016年以来,www.example.com的员工对该软件包进行了良好的支持和管理Github.com。建议阅读警告,以了解whatwg-fetch是否是合适的解决方案。
Babel和es2015+的用法很简单,只需添加到您的文件中。

import 'whatwg-fetch'

如果将与Webpack一起使用,请在应用程序入口点之前的入口配置选项中添加软件包。

entry: ['whatwg-fetch', ...]

您可以在https://github.github.io/fetch/上阅读全面的文档
如果您不熟悉WhatWG,请在其website上了解有关Web超文本应用技术工作组的更多信息。

wh6knrhe

wh6knrhe4#

安装并添加下面的代码片段到我的jest文件的顶部为我修复了它:
import "isomorphic-fetch"

u3r8eeie

u3r8eeie5#

首先要理解的是,fetch是特定于浏览器的API,在Node.js中不存在。Jest测试在Node.js中运行,尽管它们执行使用window. fetch的组件。
实际上,当您运行Jest时,React组件会在Node.js中呈现,而在Node.js中不存在fetch-这就是对它进行多边形填充的全部原因。
我知道你知道这一点,但我写了他们的其他人谁不知道为什么会发生这种情况。
要解决此问题,请执行以下步骤:1:安装“whatwg-fetch”包(npm i whatwg-fetch). 2:在项目的根目录中创建一个“jest.config.js”文件,并输入以下代码:

module.exports = {
    setupFilesAfterEnv: ['./jest.setup.js'],
}

3:创建一个'jest.setup.js'文件并将下面的代码放入其中:

import 'whatwg-fetch'

现在您在jest测试中的“fetch”请求必须工作。您可以查看下面的链接以获取更多信息:
https://github.com/mswjs/examples/tree/master/examples/with-jest

相关问题