Я использую Jest для тестирования компонента реакции. Я пытаюсь издеваться над функцией из другой зависимости. Функция из зависимости должна возвращать массив, но в консоли отображается undefined.
Ниже приведен файл tsx, когда я нажимаю кнопку, он должен вызвать функцию зависимости, чтобы получить список кадров. ExitAppButton.tsx:
import React, { useContext, useState } from 'react';
import { TestContext } from '../ContextProvider';
import { useDispatch } from 'react-redux';
const ExitAppButton = (props: any): JSX.Element => {
const { sdkInstance } = useContext(TestContext);
const exitAppClicked = () => {
const appList = sdkInstance.getFrames().filter((app: any) => {app.appType === "Test App"}).length}
тестовый файл SignOutOverlay.test.tsx:
import * as React from 'react';
import { fireEvent, render, screen } from '@testing-library/react';
import SignOutOverlay from '.';
import ExitAppButton from './ExitAppButton';
import { TestContext } from '../ContextProvider';
import { Provider } from 'react-redux';
import configureStore from 'redux-mock-store';
const api = require('@praestosf/container-sdk/src/api');
const mockStore = configureStore([]);
jest.mock('@praestosf/container-sdk/src/api');
api.getFrames.mockReturnValue([{appType:"Test App"},{appType:"Test App"},{appType:"Not Test App"}]);
describe('Test Exit app Button', () => {
const renderExitAppButton = () => {
const store = mockStore([{}]);
render(
<Provider store = {store}>
<TestContext.Provider value = {{ sdkInstance: api }}>
<SignOutOverlay>
<ExitAppButton/>
</SignOutOverlay>
</TestContext.Provider>
</Provider>
);
};
it('should to be clicked and logged out', () => {
renderExitAppButton();
fireEvent.click(screen.getByTestId('exit-app-button-id'));
});
Это файл зависимостей, api.js
const getFrames = () => {
let frames = window.sessionStorage.getItem('TestList');
frames = frames ? JSON.parse(frames) : [];
return frames
};
const API = function () { };
API.prototype = {
constructor: API,
getFrames
};
module.exports = new API();
Я издевался над функцией getFrame, чтобы она возвращала массив из 3 объектов, но при запуске тестового примера она возвращает значение undefined. Ниже показывалась ошибка:
TypeError: Cannot read property 'filter' of undefined
Я издеваюсь над этим правильно?
Я думаю, это потому, что api.getFrames
не определен, а не макет.
Попробуйте изменить свое фиктивное выражение на это:
jest.mock('@praestosf/container-sdk/src/api', () => ({
getFrames: jest.fn(),
// add more functions if needed
}));
Попробуйте сузить проблему, записав значение api
Привет. Я попытался зарегистрировать API, он возвращает издевательскую функцию, в этом нет ничего плохого, но когда я вызываю mockReturnValue. Он все равно вернет undefined
Итак, вы вошли в систему api
, и он возвращает макет, но когда вы входите в систему getFrames
, он возвращает неопределенное значение? Это странно, я не вижу проблемы, тогда я думаю, извините :/
Оказывается, у меня есть другой файл с тем же именем теста, который вызывает проблему. Я новичок в Jest, совет для таких разработчиков, как я, мы всегда должны запускать файл тестового примера в одиночку, используя
jest file.test.tsx
Не все файлы одновременно:
jest
Я пробовал это, но он все еще возвращает undefined. Любая другая возможная причина?