酶挂载/浅层一次,勾上摩卡

Enzyme Mount/Shallow once on before hook on Mocha

本文关键字:一次 摩卡      更新时间:2023-09-26

我有一个组件,我安装/加载每个测试用例,我发现这是多余的。把它挂在before钩上是个好主意吗?或者我以后可能会遇到问题,特别是当我要在组件上设置状态或道具时?

例如:

import React from 'react';
import {mount,shallow} from 'enzyme';
import {expect} from 'chai';
import ScheduleApp from '../src/components/schedule-app.jsx';
import ScheduleForm from '../src/components/schedule-form.jsx';
import ScheduleTable from '../src/components/schedule-result-table.jsx';
describe('<ScheduleApp/>', function() {
  describe('Initial Mount', function() {
    let wrapper;
    before(function() {
      wrapper = mount(<ScheduleApp />);
    });
    it('contains 1 <ScheduleForm/> component', function() {
      expect(wrapper.find(ScheduleForm)).to.have.length(1);
    });
    it('contains 1 <ScheduleTable/> component', function() {
      expect(wrapper.find(ScheduleTable)).to.have.length(1);
    });
  });
});

如果你不打算用不同的道具测试Schedule App,你不需要在每种情况下都挂载它。

您也不需要导入子组件(ScheduleForm和ScheduleTable)来告诉酶找到它们。根据子组件的显示名称查找子组件。

你可以将上面的代码重构为
import React from 'react';
import { mount } from 'enzyme';
import { expect } from 'chai';
import ScheduleApp from '../src/components/schedule-app.jsx';
describe('<ScheduleApp/>', function() {
  describe('Initial Mount', function() {
    const wrapper = mount(<ScheduleApp />);
    it('contains 1 <ScheduleForm /> component', function() {
      expect(wrapper.find('ScheduleForm')).to.have.length(1);
    });
    it('contains 1 <ScheduleTable /> component', function() {
      expect(wrapper.find('ScheduleTable')).to.have.length(1);
    });
  });
});