Question

测试已更新。能够使用相同格式进行其他测试。这就是我到目前为止 headers.test.js

import React, {Component} from 'react';
import   {Headers}  from './Headers';
import {configure} from 'enzyme';
import Adapter from 'enzyme-adapter-react-15';
import  renderer from 'react-test-renderer';

configure({adapter: new Adapter()});

describe('Headers', () => {

let tree;
let baseProps;
let mockauthKeyValues;
let mockheaderKeyValues;       
let mockaddNewKeyValue;

beforeEach(() => {
    baseProps = { // assing all of the props into MOCK
       authKeyValues: mockauthKeyValues,
       headerKeyValues: mockheaderKeyValues,
       addNewKeyValue: mockaddNewKeyValue
    }
})

 it('should render with all of the props', () => {  
    tree = renderer.create(<Headers {...baseProps} />)
    let treeJson = tree.toJSON()
    expect(treeJson).toMatchSnapshot();
    tree.unmount()
  });
});

我将测试每个道具，并确保没有它就渲染。当我嘲笑所有this.props时，我相信自己犯了一个错误。特别是ockerheaderKeyValues。我认为我没有正确设置。

这是当前代码：headers.js

export class Headers extends Component {

 componentDidMount () {
if (this.props.authKeyValues == null) {
  this.setState({
    useDefaultData: false
  })
} else {
  this.setState({
    useDefaultData: true
  })
}
 }

generateKeyValues = () => {
if (this.props.headerKeyValues == null) {
  return (
    <KeyValue
      id={shortid.generate()}
      type='headers'
      addNewKeyValue={this.props.addNewKeyValue}
    />
  )
} else {
  let defaultKeyValues = Object.keys(this.props.headerKeyValues).map   ((headerKey, idx) => {
    return (
      <KeyValue
        key={headerKey}
        id={headerKey}
        type={this.props.headerKeyValues[headerKey].type}
        addNewKeyValue={this.props.addNewKeyValue}
        defaultData={this.props.headerKeyValues[headerKey]}
      />
    )
  })
  defaultKeyValues.push(
    <KeyValue
      id={shortid.generate()}
      type='headers'
      addNewKeyValue={this.props.addNewKeyValue}
    />
  )
  return defaultKeyValues
 }
 }

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

} }

Answer 1

发现了问题- 必须从导入{Headers}中删除{}，因为Headers还要导入2个文件，因此导入不正确

单元测试：错误：TypeError：无法读取未定义的属性“ displayName”

1 个答案: