Фиктивная функция, которая вызывается внутри функции рендеринга компонента реакции

Прежде всего, я хочу сообщить, что я новичок в тестировании с реагировать и хочу проверить, правильно ли я пишу тесты.

У меня есть React Component что-то вроде этого -

import React, { Component } from "react";

class DemoComponent extends Component
{
    returnSomething()
    {
       return "something";
    }

    render(){
        return(
          <div>{ this.returnSomething() }</div>
        );
    }
}

и я пишу для проверки, чтобы проверить вызовы методов что-то вроде этого -

import React from "react";
import { shallow } from "enzyme";
import DemoComponent from "./DemoComponent.js";

const component = shallow(<DemoComponent/>); 

test('"returnSomething" method is called when the component is rendered', () => {
    component.instance().returnSomething= jest.fn();
    component.update();
    component.instance().render();
    expect(component.instance().returnSomething).toHaveBeenCalled();
});

Тест работает нормально, но я хочу знать, является ли тест, который я написал, правильным способом.

1 ответ

Решение

Вы смогли написать тест, который проходит здесь, поэтому я не вижу проблемы.

Просто проверка того, что был вызван какой-то метод в компоненте, на самом деле ничего не говорит вам о результате render() как компонент рендеринга. Как отмечает Андреас, тестирование снимка render() вероятно, лучше (если вы используете Jest) - таким образом вы тестируете фактические результаты рендеринга, а не просто проверяете, был ли вызван какой-либо метод во время рендеринга. В качестве альтернативы вы можете использовать что-то вроде .matchesElement() или проверьте отдельные свойства, чтобы создать более сильный тест.

Другие вопросы по тегам