JEST以测试反应成分

Question

我正在按照有关如何测试组件的说明开玩笑，并且想知道是否遗漏了任何东西。我正在尝试测试weatherApp.js，其唯一目的是用TemperatureData.js]中的颜色显示我colorize.js中的信息

export default class Weather extends React.Component {
    constructor(props) {
        super(props);
        this.state = {temp: undefined}}
    componentDidMount() {temperatureData().then(temp => {this.setState({temp: temp})})
    }
    render() {
        const temperature = this.state.temp;
        return <>{this.state.temp === undefined ?<somegraph />:<p style={{ color: colorize(temperature) }} id="temperature">{temperature}</p>}</>
    }
}
这是我必须测试此应用程序的地方，我不确定是否需要测试其他任何东西或缺少什么，请感谢任何输入。

describe("<WeatherApp> component test", () => {
  test("displays data from temperature data", async () => {
    const mockedTemp = "something irrelevant";
    temperatureData.mockImplementation(() => {
      return Promise.resolve(mockedTemp)
    })
    const weatherComponent = render(<WeatherApp />);
    expect(temperatureData).toHaveBeenCalled()
    await wait(() => {
      const paragraph = weatherComponent.getByText(mockedTemp)
      //console.log(paragraph)
      expect(paragraph).toBeInTheDocument()
      expect(paragraph).toBeDefined()
    });
  })
})
我不确定是否应该根据我的温度输入测试是否返回正确的颜色，因为我对我的着色文件进行了单独的单元测试...

我正在按照有关如何测试组件的说明开玩笑，并且想知道是否遗漏了任何东西。我正在尝试测试我的weatherApp.js，其唯一目的是显示我的...

Answer 1

您可以通过将jest选项添加到测试命令行来配置test coverage以报告--coverage=true信息：