时间戳

首页 > 解决方案 > 检查酶中的后备关键测试

javascript - 检查酶中的后备关键测试

问题描述

我正在使用 jest 和酶库对 reactjs 中的组件道具进行单元测试。

在这里，我需要测试的所有内容，JSON数据的未定义键以及是否写入该键的回退...

下面是伪代码：

    export class ActivityItem extends React.Component {
      render() {
        const { activity } = this.props;
        return (
          <div className='item'>
            <p>{activity.item}</p>
          </div>)
        }
     }

JSON日期：

[{"id": 1,
  "item": "Rose"},
{ "id": 2,
  "item": "Susain"}]

测试用例

  describe('check fallback for text key', () => {
    it('has value in text key', () => {
      wrapper = wrapper.find('ActivityItem')
      expect(wrapper.find('p').length).toBeGreaterThan(1);
    })
  })

在这里我找不到<p>标签来检查它的测试值......

标签： javascriptreactjsunit-testingjestjsenzyme

解决方案

您需要先对组件进行浅层渲染，然后使用选择器查找元素。

这是一个可能有帮助的片段。

import { shallow } from 'enzyme';
import ActivityItem from 'wherever-it-is';

describe('check fallback for text key', () => {
  it('has value in text key', () => {
    const wrapper = shallow(<ActivityItem activity={'meow'}/>);
    expect(wrapper.find('.item > p').length).toEqual(1);
  })
})

推荐阅读