Question

我使用以下测试用例收到错误：

 Cannot read property 'weatherIconCode' of undefined

我将weatherIconCode传递给测试用例中的组件，但我不明白为什么我会被定义。

非常欢迎任何有关简要解释如何解决的想法。

组件：

import React, {Component} from 'react'
import IconWeather from '../../shared/icon/IconWeather'

class SummaryChartIcon extends Component {
  render () {
    const { cx, cy, payload: {weatherIconCode} } = this.props
    return (
      <svg x={cx - 10} y={cy + 20}>
        <foreignObject width='100%' height='100%'>
          <IconWeather code={weatherIconCode} />
        </foreignObject>
      </svg>
    )
  }
}
export default SummaryChartIcon

测试用例：

import React from 'react'
import {shallow} from 'enzyme'
import toJson from 'enzyme-to-json'
import SummaryChartIcon from './SummaryChartIcon'

describe('<SummaryChartIcon />', () => {
  it('should render', () => {
    const wrapper = shallow(
      <SummaryChartIcon weatherIconCode={200} />
      )
    expect(toJson(wrapper)).toMatchSnapshot()
  })
})

Answer 1

您应该为您的组件传递正确的属性，在您的情况下是payload，其中包含另一个名为property weatherIconCode的对象

如果按照以下方式更改代码，则应该可以正常工作。

describe('<SummaryChartIcon />', () => {
  it('should render', () => {
    const wrapper = shallow(
      <SummaryChartIcon payload={{weatherIconCode: 200}} />
      )
    console.log(wrapper.debug())
    expect(toJson(wrapper)).toMatchSnapshot()
  })
})

使用jest的问题 - 无法读取undefined的属性'xxx'

1 个答案: