jest+enzyme取不到节点？

Question

报错如下

 Expected value to be (using Object.is):
      1
    Received:
      0

      12 |       </IntlProvider>
      13 |     );
    > 14 |     expect(wrapper.find('.fullscreen-modal').length).toBe(1);
      15 |   });
      16 | });
      

spec.js如下

import React from 'react';
import { shallow } from 'enzyme';
import { IntlProvider } from 'react-intl';
import AllocatingModal from './allocatingModal';

describe('AllocatingModal', () => { // eslint-disable-line no-undef
  it('render', () => { // eslint-disable-line no-undef
    const wrapper = shallow(
      <IntlProvider locale="zh">
        <AllocatingModal />
      </IntlProvider>
    );
    expect(wrapper.find('.fullscreen-modal').length).toBe(1);
  });
});

jsx如下

<Modal
        maskClosable={false}
        title={title}
        width="100%"
        wrapClassName="fullscreen-modal"
        closable={false}
        visible={this.props.visible}
        footer={null}
      >

明明有 为什么取不到呢?

Answer 1

首先确保visible为true，其次Modal是直接渲染在document.body下面的，因此find无法找到对应的节点。

antd 4.x已经用React.creatPortal解决了这个问题，可以直接用find