Reagire test componente puntello cambia con l'enzima

Question

sto modificando un esempio trovato qui:

https://github.com/airbnb/enzyme/blob/master/docs/api/ReactWrapper/setProps.md

class Foo extends React.Component { 
    render() { 
     return (
      <input className={this.props.name} type="text" value={this.props.name} onChange={()=>{}} /> 
     ); 
    } 
} 

it('should pass and does not',()=> { 
    const wrapper = mount(<Foo name="foo" />); 
    expect(wrapper.find('.foo').html()).toBe(`<input class="foo" type="text" value="foo">`); 
    wrapper.setProps({ name: 'bar' }); 
    expect(wrapper.find('.bar').html()).toBe(`<input class="bar" type="text" value="bar">`); 
}); 

Result: Expected '<input class="bar" type="text" value="foo">' to be '<input class="bar" type="text" value="bar">'. 

Si può vedere dal risultato del test che l'attributo className è stato aggiornato correttamente sul cambiamento prop. Ma il valore dell'ingresso rimane impostato erroneamente su "pippo".

Qualche idea su come posso affermare che il valore è stato modificato correttamente sul componente che riceve nuovi oggetti di scena su un attributo di valore su un input?

Answer 1

È necessario chiamare un metodo .update() su un wrapper. (Subito dopo aver impostato nuovi oggetti di scena) Ciò imporrà l'aggiornamento del componente e il valore dell'ingresso dovrebbe cambiare.

Si può leggere di più su di esso qui: http://airbnb.io/enzyme/docs/api/ShallowWrapper/update.html