コンポーネント/ propsのテストはReactJSのEnzymeで定義されていません

Question

Propsを使用してLoginContainerコンポーネントがHeader with Enzymeに存在するかどうかをテストしようとしていますが、

import React from 'react' 
import Header from '../components/Header' 
import LoginContainer from './LoginContainer' 

const App =() => (
    <Header login={<LoginContainer />} /> 
) 
export default App 

マイヘッダー：

はここに私のメインのアプリです

import React from "react"; 
const Header = ({login}) => 
    <header role="banner"> 
     {login} 
    </header> 
export default Header 

そして、これは私のテストで：

import React from 'react' 
import { shallow } from 'enzyme' 
import Header from '../components/Header' 

const setup = props => { 
    const component = shallow(
     <Header {...props} /> 
    ) 
    return { 
     component: component 
    } 
} 
describe('Header component',() => { 
    it('should render login',() => { 
     const { component } = setup(); 
     console.log(component.props({ login })) //this is undefined 
    }) 
}) 

問題がある、私はテストを実行したときにそれがいるようですlogin（LoginContainer）propsは未定義です。誰かアドバイスをお願いできますか？

Answer 1

セットアップに何も渡していません。

import React from 'react' 
import { shallow } from 'enzyme' 
import Header from '../components/Header' 

const setup = props => { 
    const component = shallow(
     <Header {...props} /> 
    ) 
    return { 
     component: component 
    } 
} 
describe('Header component',() => { 
    it('should render login',() => { 
     const { component } = setup({ login: <LoginContainer/> }); 
     expect(component.props().login).toBeDefined() 
    }) 
}) 

Answer 2

インスタンスを最初に取得する必要があります。

NOTE: When called on a shallow wrapper, .props() will return values for props on the root node that the component renders, not the component itself. To return the props for the entire React component, use wrapper.instance().props. See .instance() => ReactComponent

  it('should have props',() => {     
       const l = <div>Login ...</div>; 
       const {component} = setup({login:l}); 
       console.log(component.instance().props.login); 
       expect(component.instance().props.login).to.exist; 
      });