Тестирование Axe ios в Jest

Question

Я новичок в тестировании. Я пытаюсь протестировать функцию асинхронной выборки данных, но не могу понять, почему тест не проходит. Я издевался над Ax ios шуткой и дал методу Ax ios 'get фиктивную реализацию для выполнения обещания. Ошибка говорит, что он не может прочитать свойство name, что означает, что объект данных не определен, я считаю.

Вот Yelp.test. js

import Yelp from './Yelp';
import axios from 'axios';

jest.mock('axios');

describe('searchRestaurantsInfo', () => {
  test('returns object with restaurant infos', async () => {
    const data = {
      name: 'Casa Romana',
      address: '5 Albion Street',
      coordinates: { lat: 52.6322649, lng: -1.1314474 },
      city: 'Leicester LE1 6GD',
      rating: 4.5,
      photos: [
        'https://s3-media1.fl.yelpcdn.com/bphoto/4VUq4j1FF-n5bgXjtoC0Xw/o.jpg',
        'https://s3-media1.fl.yelpcdn.com/bphoto/4VUq4j1FF-n5bgXjtoC0Xw/o.jpg',
        'https://s3-media1.fl.yelpcdn.com/bphoto/4VUq4j1FF-n5bgXjtoC0Xw/o.jpg',
      ],
      phone: '+441162541174',
      price: '£££',
      categories: 'Italian',
      url:
        'https://www.yelp.com/biz/casa-romana-leicester?adjust_creative=7GHt4FY-2vjNyIPhQV7wcw&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_lookup&utm',
      reviews: [
        {
          id: 'i_Q39aN9hwZzGDUb-IWpYw',
          rating: 5,
          text:
            'Proper Italian restaurant. Not Italian-themed, or serving Italian fusion cuisine, just a place with an Italian owner who makes solid, straightforward...',
          time_created: '2014-10-02 03:49:36',
          url:
            'https://www.yelp.com/biz/casa-romana-leicester?adjust_creative=7GHt4FY-2vjNyIPhQV7wcw&hrid=i_Q39aN9hwZzGDUb-IWpYw&utm_campaign=yelp_api_v3&utm_me',
          user: {
            id: '6tPD46XZSFllvgn2vTh51A',
            image_url:
              'https://s3-media3.fl.yelpcdn.com/photo/A4Ww6Ks2P9WsALqOFy9cOA/o.jpg',
            name: 'Espana S.',
            profile_url:
              'https://www.yelp.com/user_details?userid=6tPD46XZSFllvgn2vTh51A',
          },
        },
      ],
    };

    axios.get.mockImplementationOnce(() => Promise.resolve(data));

    await expect(
      Yelp.searchRestaurantsInfo('q_IoMdeM57U70GwqjXxGJw')
    ).resolves.toEqual(data);
  });
});

And Yelp. js

import axios from 'axios';

let YELP_API_KEY = process.env.REACT_APP_YELP_API_KEY;

const Yelp = {
   // Provides infos about a single restaurant
  async searchRestaurantsInfo(id) {
    try {
      let response = await axios.get(
        `https://cors-anywhere.herokuapp.com/https://api.yelp.com/v3/businesses/${id}`,
        {
          headers: {
            Authorization: `Bearer ${YELP_API_KEY}`,
            'X-Requested-With': 'XMLHttpRequest',
            'Access-Control-Allow-Origin': '*',
          },
        }
      );

      let responseRew = await axios.get(
        `https://cors-anywhere.herokuapp.com/https://api.yelp.com/v3/businesses/${id}/reviews`,
        {
          headers: {
            Authorization: `Bearer ${YELP_API_KEY}`,
            'X-Requested-With': 'XMLHttpRequest',
            'Access-Control-Allow-Origin': '*',
          },
        }
      );

      const parameters = {
        name: response.data.name,
        address: response.data.location.display_address[0],
        coordinates: {
          lat: response.data.coordinates.latitude,
          lng: response.data.coordinates.longitude,
        },
        city: response.data.location.display_address[1],
        rating: response.data.rating,
        photos: response.data.photos,
        phone: response.data.phone,
        price: response.data.price,
        categories: response.data.categories[0].title,
        url: response.data.url,
        reviews: responseRew.data.reviews,
      };
      console.log({ parameters, id });

      return parameters;
    } catch (e) {
      console.log(e);
      return e;
    }
  }}

Я получаю сообщение об ошибке:

searchRestaurantsInfo
    × returns array of restaurnats obj (66ms)

  ● searchRestaurantsInfo › returns array of restaurnats obj

    expect(received).resolves.toEqual(expected) // deep equality

    - Expected
    + Received

    - Object // data object. I removed it from this error message because too long
    + [TypeError: Cannot read property 'name' of undefined]

      47 |     await expect(
      48 |       Yelp.searchRestaurantsInfo('q_IoMdeM57U70GwqjXxGJw')
    > 49 |     ).resolves.toEqual(data);
         |                ^
      50 |   });
      51 | });
      52 | 

      at Object.toEqual (node_modules/react-scripts/node_modules/expect/build/index.js:202:20)
      at Object.<anonymous> (src/helpers/Yelp.test.js:49:16)

  console.log src/helpers/Yelp.js:91
    TypeError: Cannot read property 'name' of undefined
        at Object.searchRestaurantsInfo (C:\Users\Turi\Desktop\project\RestaurantsRedux\src\helpers\Yelp.js:72:29)
        at processTicksAndRejections (internal/process/task_queues.js:97:5)
        at Object.<anonymous> (C:\Users\Turi\Desktop\project\RestaurantsRedux\src\helpers\Yelp.test.js:47:5)

Заранее благодарим за помощь!

Answer 1

Мне удалось найти решение.

Как и предполагалось, мне пришлось добавить еще один макет, поскольку в функции есть два разных запроса.

В дополнение к этому я понял, что не могу 'не используйте data в

axios.get.mockImplementationOnce(() => Promise.resolve(data));

и

      Yelp.searchRestaurantsInfo('q_IoMdeM57U70GwqjXxGJw')
    ).resolves.toEqual(data);```

, поскольку функция не возвращала data, а объект с некоторыми частями из data. Поэтому я создал новый объект params для сравнения с объектом, возвращаемым функцией.

import Yelp from './Yelp';
import axios from 'axios';

jest.mock('axios');

describe('searchRestaurantsInfo', () => {
  test('returns object with restaurant infos', async () => {
    const response = {
      data: {
        name: 'Casa Romana',
        location: {
          display_address: [
            "12 Upper Saint Martin's Lane",
            'London WC2H 9FB',
            'United Kingdom',
          ],
        },
        coordinates: { latitude: 52.6322649, longitude: -1.1314474 },

        rating: 4.5,
        photos: [
          'https://s3-media1.fl.yelpcdn.com/bphoto/4VUq4j1FF-n5bgXjtoC0Xw/o.jpg',
          'https://s3-media1.fl.yelpcdn.com/bphoto/4VUq4j1FF-n5bgXjtoC0Xw/o.jpg',
          'https://s3-media1.fl.yelpcdn.com/bphoto/4VUq4j1FF-n5bgXjtoC0Xw/o.jpg',
        ],
        phone: '+441162541174',
        price: '£££',
        categories: [{ alias: 'indpak', title: 'Indian' }],
        url:
          'https://www.yelp.com/biz/casa-romana-leicester?adjust_creative=7GHt4FY-2vjNyIPhQV7wcw&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_lookup&utm',
      },
    };

    const responseRev = {
      data: {
        reviews: [
          {
            id: 'i_Q39aN9hwZzGDUb-IWpYw',
            rating: 5,
            text:
              'Proper Italian restaurant. Not Italian-themed, or serving Italian fusion cuisine, just a place with an Italian owner who makes solid, straightforward...',
            time_created: '2014-10-02 03:49:36',
            url:
              'https://www.yelp.com/biz/casa-romana-leicester?adjust_creative=7GHt4FY-2vjNyIPhQV7wcw&hrid=i_Q39aN9hwZzGDUb-IWpYw&utm_campaign=yelp_api_v3&utm_me',
            user: {
              id: '6tPD46XZSFllvgn2vTh51A',
              image_url:
                'https://s3-media3.fl.yelpcdn.com/photo/A4Ww6Ks2P9WsALqOFy9cOA/o.jpg',
              name: 'Espana S.',
              profile_url:
                'https://www.yelp.com/user_details?userid=6tPD46XZSFllvgn2vTh51A',
            },
          },
        ],
      },
    };

    const params = {
      name: 'Casa Romana',
      address: "12 Upper Saint Martin's Lane",
      coordinates: { lat: 52.6322649, lng: -1.1314474 },
      city: 'London WC2H 9FB',
      rating: 4.5,
      photos: [
        'https://s3-media1.fl.yelpcdn.com/bphoto/4VUq4j1FF-n5bgXjtoC0Xw/o.jpg',
        'https://s3-media1.fl.yelpcdn.com/bphoto/4VUq4j1FF-n5bgXjtoC0Xw/o.jpg',
        'https://s3-media1.fl.yelpcdn.com/bphoto/4VUq4j1FF-n5bgXjtoC0Xw/o.jpg',
      ],
      phone: '+441162541174',
      price: '£££',
      categories: 'Indian',
      url:
        'https://www.yelp.com/biz/casa-romana-leicester?adjust_creative=7GHt4FY-2vjNyIPhQV7wcw&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_lookup&utm',
      reviews: [
        {
          id: 'i_Q39aN9hwZzGDUb-IWpYw',
          rating: 5,
          text:
            'Proper Italian restaurant. Not Italian-themed, or serving Italian fusion cuisine, just a place with an Italian owner who makes solid, straightforward...',
          time_created: '2014-10-02 03:49:36',
          url:
            'https://www.yelp.com/biz/casa-romana-leicester?adjust_creative=7GHt4FY-2vjNyIPhQV7wcw&hrid=i_Q39aN9hwZzGDUb-IWpYw&utm_campaign=yelp_api_v3&utm_me',
          user: {
            id: '6tPD46XZSFllvgn2vTh51A',
            image_url:
              'https://s3-media3.fl.yelpcdn.com/photo/A4Ww6Ks2P9WsALqOFy9cOA/o.jpg',
            name: 'Espana S.',
            profile_url:
              'https://www.yelp.com/user_details?userid=6tPD46XZSFllvgn2vTh51A',
          },
        },
      ],
    };

    axios.get.mockImplementationOnce(() => Promise.resolve(response));
    axios.get.mockImplementationOnce(() => Promise.resolve(responseRev));

    await expect(
      Yelp.searchRestaurantsInfo('q_IoMdeM57U70GwqjXxGJw')
    ).resolves.toEqual(params);
  });
});

Answer 2

Может возникнуть проблема с тем, как вы ждете результата (возможная проблема с компиляцией), попробуйте написать такой тест.

// note make sure the test() function is async

const result = await Yelp.searchRestaurantsInfo('q_IoMdeM57U70GwqjXxGJw')
      expect(result).toEqual(data);