Reactjs 当我使用react测试库读取react组件中的只读数据时，我应该期望什么

我有一个只包含文本的组件，没有任何模拟调用、按钮或文本字段。只读文本通过道具来自另一个组件。在这里的代码中，对于该组件我应该期望什么

expect（container）。

代码：

从“React”导入React；
导出默认功能基本表（道具）{
常量行=道具；
返回(
{rows.map（（row）=>(
{row.carries}d
))}
);
}

测试代码：

import React from 'react';
import { render } from '@testing-library/react';
import BasicTable from '../BasicTable';

beforeEach(() =>
{
window.scrollTo = jest.fn();
window.HTMLDivElement.prototype.scrollIntoView = jest.fn();
});

describe('Read only text', () => {

 const rows = [{calories: 13, fat: 200}, {calories: 15, fat: 230}]

it('text came from props', () => {
    const { container } = render(<BasicTable rows={rows} />);
    expect(container).
});
});

从“React”导入React；
从'@testing library/react'导入{render}；
从“../BasicTable”导入BasicTable；
在每个之前（（）=>
{
window.scrollTo=jest.fn（）；
window.htmldevelment.prototype.scrollIntoView=jest.fn（）；
});
描述（'只读文本'，（）=>{
常量行=[{卡路里：13，脂肪：200}，{卡路里：15，脂肪：230}]
它（'文本来自道具'，（）=>{
const{container}=render（）；
期望（容器）。
});
});

您可以测试，也就是说，组件正确呈现并具有正确文本，类似于：

describe('BasicTable', () => {
  const mockedRowsProp = [{ calories: 13, fat: 200 }, { calories: 15, fat: 230 }]
 
  it('renders correctly', () => {
    render(<BasicTable rows={mockedRowsProp} />);
  });

  it('has correct calories', () => {
    render(<BasicTable rows={mockedRowsProp} />);
    expect(screen.getByText(/13/)).toBeInTheDocument();
    expect(screen.getByText(/15/)).toBeInTheDocument();
  });
});

description（'BasicTable'，（）=>{
const mockedRowsProp=[{卡路里：13，脂肪：200}，{卡路里：15，脂肪：230}]
它（'正确渲染'，（）=>{
render（）；
});
它（'有正确的卡路里'，（）=>{
render（）；
expect（screen.getByText（/13/）.toBeInTheDocument（）；
expect（screen.getByText（/15/）.toBeInTheDocument（）；
});
});

您的期望是文本被呈现，所以可能

expect（container.textContent）.to…

或者如果您使用的是

jest-dom/extend-expect

，则可以在容器本身上使用。使用toHaveTextContent时出现错误，它是“类型'JestMatchers'上不存在属性toHaveTextContent”，并且您是否在任何地方包含了

@testing-library/jest-dom/extend-expect

？这看起来像是打字脚本错误，但您似乎没有在写打字脚本，什么都没有打出来。

describe('BasicTable', () => {
  const mockedRowsProp = [{ calories: 13, fat: 200 }, { calories: 15, fat: 230 }]
 
  it('renders correctly', () => {
    render(<BasicTable rows={mockedRowsProp} />);
  });

  it('has correct calories', () => {
    render(<BasicTable rows={mockedRowsProp} />);
    expect(screen.getByText(/13/)).toBeInTheDocument();
    expect(screen.getByText(/15/)).toBeInTheDocument();
  });
});