Реагировать тест: Инвариантные Нарушение: Тип элемента недействителен: не определено

Question

Здравствуйте, я учусь React/перевождь

Я создал приложение Todo это работает отлично, но когда я пытаюсь написать тест компонентов с jsdom он показывает мне эта ошибка, провел некоторое время, но не мог разобрался с проблемой:

компонент (это просто текстовое поле + кнопка)

import React from 'react' 
import {addTodo} from '../actions' 
import {connect} from 'react-redux' 

let inputText 

class AddTodo extends React.Component { 
    constructor(props, context){ 
     super(props, context) 
    } 

    render(){ 
     const {text, handleAdd} = this.props 
     return (
      <div> 
       Text: 
       <input type='text' ref={node=>{ inputText=node}} /> <button onClick={()=>handleAdd(inputText.value)} >Add </button> 
      </div> 
     ) 
    } 
} 

const handleAdd = (text)=>{ 
      dispatch(addTodo(text)) 
     } 

const mapDispatchToProps = (dispatch, ownProps) =>{ 
    return { 
     handleAdd: (text)=>{ 
      dispatch(addTodo(text)) 
     } 
    } 
} 

AddTodo = connect(null,mapDispatchToProps)(AddTodo) 

export default AddTodo 

в spec.js

import React from 'react' 
import ReactDOM from 'react-dom' 
import { 
    renderIntoDocument, 
    scryRenderDOMComponentsWithTag, 
    Simulate 
} from 'react-addons-test-utils' 
import {AddTodo} from '../../src/containers/AddTodo' 
import {expect} from 'chai' 

describe('Add todo',()=>{ 
    it('render the button and text field',()=>{ 
     const component = renderIntoDocument(<AddTodo />); 
     const button = scryRenderDOMComponentsWithTag(component, 'button'); 
     const input = scryRenderDOMComponentsWithTag(component, 'input'); 
     expect(button.length).to.be(1); 
     expect(input.length).to.be(1); 
    }) 
}) 

Ошибка:

Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. 

Answer 1

Вы экспортируете компонент в качестве экспорта по умолчанию:

export default AddTodo 

Но импортировать его в качестве имени экспорта

import {AddTodo} from '../../src/containers/AddTodo' 

Так AddTodo не определено.

Изменить импорт в:

import AddTodo from '../../src/containers/AddTodo'