Question

我无法正确渲染MODAL。我是单元测试的新手，由于某种原因，它没有显示在快照中。使用REACT JS-笑话和酶

这是我的file.test.js文件

    this.boxStackPane.setOnDragDetected(e -> {          
        SnapshotParameters snapshotParameters = new SnapshotParameters();
        snapshotParameters.setFill(Color.TRANSPARENT);

        Dragboard dragboard = this.boxStackPane.startDragAndDrop(TransferMode.MOVE);
        dragboard.setDragView(new Box().getNode().snapshot(snapshotParameters, null));

        ClipboardContent clipboardContent = new ClipboardContent();
        clipboardContent.put(this.dataFormatDragBox, "");

        dragboard.setContent(clipboardContent);

        e.consume();
    });

    this.mapPane.setOnDragOver(e -> {
        Dragboard dragboard = e.getDragboard();
        if (dragboard.hasContent(this.dataFormatDragBox)) {
            e.acceptTransferModes(TransferMode.MOVE);
        }

        e.consume();
    });

    this.mapPane.setOnDragDropped(e -> {
        Dragboard dragboard = e.getDragboard();
        if (dragboard.hasContent(this.dataFormatDragBox)) {
            this.layerContainer.addBox(new Box(), 0, 0);
        }

        e.consume();
    });

所以我试图研究file.js 我添加了以下内容：

   // defining this.props
 const baseProps = { 
 //all this.props are listed here + 
    isOpen:true,

describe('Test', () => {
let wrapper;
let tree;
it('Should render using all of the props', () => {  } // PASSING AT THE MOMENT


it("renders a modal portal", () => {  //FAILING AT THE MOMENT
const isOpen = wrapper.state("isOpen");
const modalPortal = wrapper.find("div.fullmodal");
expect(isOpen).toBeTruthy;
expect(modalPortal).toHaveLength(1);
expect(toJson(wrapper)).toMatchSnapshot();
});
});

还在Render（）之前添加了以下内容

constructor(props) {
super(props)
this.state = {
isOpen: false, }

这是“渲染模式”的一部分

handleModalOpen = () => this.setState({ isOpen: false });
handleCloseModal = () => this.setState({ ...initialState });

这是错误：

        <Modal isOpen={this.state.addLayoutModalOpen} style={addLayoutModalStyle}>
        <div className='fullmodal'> <Modal isOpen={this.state.addLayoutModalOpen} style={addLayoutModalStyle}>
        <div className='fullmodal'>  

              <Modal isOpen={this.state.showShareModal} style={shareModal}>
        <ShareModal  // etc...

渲染模式-单元测试REACT JS

0 个答案: