Question

有错误

TypeError：无法读取未定义的属性“ find”

当我测试我的反应组件时。我用笑话和酶进行应用程序测试。我尝试了其他方法，但仍然出现未定义的错误。

test.js

import React from 'react';
import { mount } from 'enzyme';
import { StaticRouter } from 'react-router-dom';

import Button from '../index';

describe('<Button />', () => {
  let renderComponent;

  beforeEach(() => {
    renderComponent = (props = {}) => {
      mount(
        // <MemoryRouter>
        <Button href={href} {...props}>
          {children}
        </Button>,
        // </MemoryRouter>,
      );
    };
  });

  it('should render an <a> tag if no handleRoute is provided', () => {
    const renderedComponent = renderComponent();
    expect(renderedComponent.find('a')).toHaveLength(1);
  });
});

index.js（按钮组件）

import React, { Children } from 'react';
import PropTypes from 'prop-types';

import A from './A';
// import StyledButton from './StyledButton';
import Wrapper from './Wrapper';

function Button(props) {
  // render an anchor tag => a tag
  let button = (
    <A href={props.href} onClick={props.onClick}>
      {Children.toArray(props.children)}
    </A>
  );

  return <Wrapper>{button}</Wrapper>;
}

Button.propTypes = {
  handleRoute: PropTypes.func,
  href: PropTypes.string,
  onClick: PropTypes.func,
  children: PropTypes.node.isRequired,
};

export default Button;

Answer 1

您必须从renderComponent函数返回该组件。

renderComponent = (props = {}) => {
  return mount(
    // <MemoryRouter>
    <Button href={href} {...props}>
      {children}
    </Button>,
    // </MemoryRouter>,
  );
};

酶安装错误-TypeError：无法读取未定义的属性“ find”

1 个答案: