错误：酶内部错误：未知的复合类型undefined

Question

我在尝试应用酶时遇到此错误，但无法找到任何相关问题。

这里是test.js;

import React from 'react'; 
import AccountLoginForm from './LoginPage'; 
import sinon from 'sinon'; 
import { mount, shallow, configure } from 'enzyme'; 
import { expect } from 'chai'; 
import Adapter from 'enzyme-adapter-react-15'; 
import configureStore from 'redux-mock-store'; 

configure({ adapter: new Adapter() }); 

const mockStore = configureStore(); 

sinon.spy(AccountLoginForm.prototype, 'componentDidMount'); 

describe('<AccountLoginForm />',() => { 
    it('calls componentDidMount',() => { 
    const wrapper = shallow(<AccountLoginForm />, { context: { store: mockStore() } }); 
    expect(Foo.prototype.componentDidMount.calledOnce).to.equal(true); 
    }); 
}); 

这里是LoginPage;

import React, { Component } from 'react'; 
import { Form, Icon, Input, Button, Checkbox, Row, Col, Alert, Card } from 'antd'; 
import {connect} from 'react-redux'; 
import {bindActionCreators} from 'redux'; 
import * as api from '../../apiCalls/axiosCalls'; 
import * as authenticationActions from '../../actions/authenticationActions'; 
import './LoginPage.css'; 

const FormItem = Form.Item; 

class AccountLoginForm extends Component { 

    constructor(props) { 
    super(props); 
    this.state = { 
     errorValidation: true 
    } 
    } 

    componentDidMount(){ 
    console.log("DENEME") 
    } 

    handleSubmit = (e) => { 
    e.preventDefault(); 
    this.props.form.validateFields((err, values) => { 
     if (!err) { 
     const userData = { 
      username: values.userName, 
      password: values.password 
     }; 
     api.postLogin(userData) 
     .then((response) => { 
      this.props.actions.userLoginCompleted(response); 
      this.props.router.push('/'); 
      this.setState({ errorValidation: true }); 
     }) 
     .catch((err) => { 
      // TODO update field warnings based on login failure 
      this.setState({ errorValidation: false }); 
     }); 
     } 
    }); 
    } 

    render() { 
    const { getFieldDecorator } = this.props.form; 

    return (


     <Row align="center"> 

     <Col > 

      <Card style={{ width: 800, margin: "auto", marginTop:"200px"}}> 
      <Row align="middle" className="page-title-bar" gutter={36}> 

       <Col span={14} className="login-box"> 
       <img alt="example" src="../../assets/images/loginIot.png" /> 
       <h2>Netas IOT Platform </h2> 
       {/* <p> 
        Nulla sit amet est. Aenean viverra rhoncus pede. Fusce vel dui. Nunc nec neque. 

Sed hendrerit. Suspendisse eu ligula. 
           </p> */} 
       </Col> 
       <Col span={10} > 
       <div className="loginlogo" > 

        <img src="../../assets/images/NetION.png" /> 


       </div> 
       <Form onSubmit={this.handleSubmit} className="login-form"> 
        <FormItem> 
        {getFieldDecorator('userName', { 
         rules: [{ required: true, message: 'Please input your username!' }], 
        })(
         <Input prefix={<Icon type="user" style={{ fontSize: 13 }} />} placeholder="Username" /> 
        )} 
        </FormItem> 
        <FormItem> 
        {getFieldDecorator('password', { 
         rules: [{ required: true, message: 'Please input your Password!' }], 
        })(
         <Input prefix={<Icon type="lock" style={{ fontSize: 13 }} />} type="password" placeholder="Password" /> 
        )} 
        </FormItem> 
        <FormItem> 
        {/* {getFieldDecorator('remember', { 
       valuePropName: 'checked', 
       initialValue: true, 
       })(
       <Checkbox>Remember me</Checkbox> 
           )} 
       <a className="login-form-forgot" href="">Forgot password</a> */} 
        {!this.state.errorValidation && 
         <Alert 
         message='Error' 
         description="Login is failed." 
         type="error" 
         className="login-form-error" 
         showIcon /> 
        } 
        <br /> 
        <Button type="primary" htmlType="submit" className="login-form-button"> 
         Log in 
        </Button> 
        </FormItem> 
       </Form> 
       </Col> 
      </Row> 
      </Card> 

     </Col> 
     </Row> 

    ); 
    } 
} 

const LoginPage = Form.create()(AccountLoginForm); 


function mapStateToProps(state, ownProps){ 
    return { 
     authentication: state.authentication 
    }; 
} 

function mapDispatchtoProps(dispatch) { 
    return { 
    actions: bindActionCreators(authenticationActions, dispatch) 
    }; 
} 

export default connect(mapStateToProps, mapDispatchtoProps)(LoginPage); 

当我跑步;

mocha --require ignore-styles --compilers js:babel-core/register frontend/src/antd/Login/test 

我得到这个错误;

< AccountLoginForm /> 1) calls componentDidMount

0 passing (46ms) 1 failing

1) < AccountLoginForm /> calls componentDidMount: Error: Enzyme Internal Error: unknown composite type undefined at compositeTypeToNodeType (node_modules\enzyme-adapter-react-15\build\ReactFifteenAdapter.js:61:13) at Object.getNode (node_modules\enzyme-adapter-react-15\build\ReactFifteenAdapter.js:254:27) at new ShallowWrapper (node_modules\enzyme\build\ShallowWrapper.js:120:37) at shallow (node_modules\enzyme\build\shallow.js:19:10) at Context. (D:/Users/buraku/Desktop/ReactProjects/feature_buraku_v3/iot_core_client/frontend/src/antd/Login/LoginPageTest.js:17:21)

npm ERR! Test failed. See above for more details.

Answer 1

我解决了这个问题，通过改变“浅”到“安装”

当我从网上了解，浅是虚拟组件和安装是容器。