Не удается смоделировать запрос API - PullRequest
Новая
       15

Не удается смоделировать запрос API

2 голосов
/ 06 марта 2020

Мне очень трудно настроить jest-test-mock в моем проекте TypeScript. Мне было интересно, если кто-то может указать мне правильное направление?

У меня есть функция, которая выглядит следующим образом:

retrieveData.ts 

import fetch from 'cross-fetch'; 

export async function retrieveData({
  endpoint,
  configuration,
  auth
}: dataInterface): Promise<object> {
  try {
    console.log('Fetching the requested data... ?')

    const settings = configuration
      ? JSON.parse(render(configuration || '', auth))
      : {}

    if (settings.body) {
      // Ensures the body is stringified in the case of a post request being made.
      settings.body = JSON.stringify(settings.body)
    }

    const response = await fetch(endpoint, settings)
    return await response.json()
  } catch (error) {
    throw new Error(`There was an error fetching from the API: ${error}`)
  }
}

И я тестирую это так в fetch.test.ts 

// Enable the mocks
import { enableFetchMocks } from 'jest-fetch-mock'
enableFetchMocks()
import fetchMock from 'jest-fetch-mock';

import {retrieveData, generateExport} from '../src/fetch'

describe('fetch', () => {
  describe('retrieveData', () => {
    it('should return some data', async () => {
      fetchMock.mockResponseOnce(JSON.stringify({ data: '12345' }))
      const data = await retrieveData({
        endpoint: 'https://example.com'
      })

      expect(data).toEqual({ data: '12345' })
    })
  })
})

Проблема, с которой я столкнулся, заключается в том, что эта библиотека, кажется, не берет на себя звонок на fetch. Помещение полностью определенного URL в мою функцию приведет к возвращению реальных данных. Я ожидаю, что он получит объект data: '12345'. Где я тут ошибаюсь?

Обновление:

Следующая схема работает при импорте import 'cross-fetch/polyfill';, но если я использую import fetch from 'cross-fetch';, это не так. Проблема с использованием первого оператора import заключается в том, что он ошибается, говоря, что fetch не определено. Если я консольный журнал перед импортом импорта, он показывает правильный конструктор макета. Я попытался поиграть с порядком импорта макетов, но проблема все еще та же: 

import fetchMock, {enableFetchMocks} from 'jest-fetch-mock'
import {retrieveData, generateExport} from '../src/fetch'
enableFetchMocks()

Это явно какая-то проблема порядка импорта, но я не уверен, что это правильный способ решить эту проблему. с шуткой Является ли добавление fetch к глобальному объекту в eslint подходящим решением для этого?

1 Ответ

0 голосов
/ 06 марта 2020

Можете ли вы попробовать этот код, пожалуйста. 

describe('retrieveData', () => {
  it('should return some data', () => {
    fetchMock.mockResponseOnce(JSON.stringify({ data: '12345' }))
    retrieveData({
      endpoint: 'https://example.com'
    }).then(res => {
       expect(res).toEqual({ data: '12345' })
    })
  })
})
...