Reactjs 我面临测试自定义组件的问题

我已经创建了自定义组件编号输入字段。我对编写测试用例是新手，所以我只是尝试编写一个简单的测试用例，并希望成功地执行它

这是我的组件

import React from 'react';
import PropTypes from 'prop-types';
import NumberFormat from 'react-number-format';

import TextField from 'components/TextField';

function CustomInput(props) {
  return <TextField {...props} />;
}

function NumberInput(props) {
  const { onChange, ...otherProps } = props;
  return (
    <NumberFormat
      thousandSeparator
      decimalSeparator="."
      decimalScale={2}
      {...otherProps}
      customInput={CustomInput}
      onValueChange={values => {
        const { value } = values;
        onChange(value);
      }}
    />
  );
}

NumberInput.propTypes = {
  onChange: PropTypes.func,
};

export default NumberInput;

我正试图为此编写一个测试用例

import React from 'react';
import { render, fireEvent } from '@testing-library/react';
import { NumberInput } from '../index';


describe('<NumberInputField />', () => {
  it('Expect to have unit tests specified', () => {
    const { container } = render(<NumberInput />);

    const NumberFormat = container.firstChild
    fireEvent.change(NumberFormat, { target: { value: 10 } });
    expect(NumberFormat.value).toBe(10);
    //expect(true).toEqual(false);
  });
});

我正在尝试使用

开玩笑

测试库/反应

这是我的错误

您将NumberInput作为命名导出导入，但它实际上是默认导出

将导入{NumberInput}从“../index”更改为“../index”；从“../index”导入NumberInput

或

---

将导出更改为导出默认编号输入；导出{NumberInput}

谢谢你，里昂，这对我有用。但是现在在fireEvent.changeNumberFormat行中，{target:{value:10}；显示错误给定元素没有值设置你能帮我吗？这似乎与MaterialUI有关