TestUtils.Simulate.change aktualisiert den Wert der Eingabe nicht

Question

Ich mache eine sehr einfache Komponente, um die TestUtils.Simulate reactJS-Methode zu testen. Aber ich weiß nicht, warum diese Methode den Wert meiner Komponente nicht aktualisiert. Ich schätze, ich habe meinen Code falsch geschrieben.

Dies ist meine kleine Komponente:

'use strict'; 

var React = require('react'); 

var MyComponent = React.createClass({ 


    getInitialState: function() { 
     return {value: 'a'}; 
    }, 
    handleChange: function (event) { 
     this.setState({value: event.target.value}); 
    }, 
    render: function() { 
     return (
      <div> 
       <input 
        ref="inp" 
        type="text" 
        value={this.state.value} 
        onChange={this.handleChange} 
       /> 
      </div> 
     ); 
    } 
}); 

module.exports = MyComponent; 

Und dies ist die Testseite:

jest.disableAutomock(); 
jest.unmock('../resources/assets/js/testcomponents/testvalue'); 


var React = require('react'), 
    MyComponent = require('../resources/assets/js/testcomponents/testvalue.js'), 
    TestUtils = require('react-addons-test-utils'), 
    ReactDOM = require('react-dom'); 



describe('MyComponent', function() { 

    var AppElement = TestUtils.renderIntoDocument(<MyComponent/>); 
    var DomElement = ReactDOM.findDOMNode(AppElement); 

    var input = DomElement.getElementsByTagName('input')[0]; 



    console.log('INPUT 1 as string: ' + input.outerHTML); 

    it('type', function() { 
     console.log('type=' + input.getAttribute('type')); 
     expect(input.getAttribute('type')).toEqual('text'); 
    }); 

    it('value', function() { 
     console.log('value=' + input.getAttribute('value')); 
     expect(input.getAttribute('value')).toEqual('a'); 
    }); 

    it('change', function(){ 


     TestUtils.Simulate.change(input, {target: {value: 'giraffe'}}); 
     expect(input.getAttribute('value')).toEqual('giraffe'); 
    }); 
}); 

Die Linie TestUtils.Simulate.change (Eingang, {Ziel: {Wert: 'Giraffe' }}); nichts

Answer 1

machen denke ich, das Hauptproblem ist, dass Sie vergleichen gegen

input.getAttribute('value') 

, die nur den ursprünglichen Wert enthält. Sie haben wie den aktualisierten Wert zu überprüfen:

expect(input.value).toEqual('giraffe'); 

ich einen Arbeits Jasmin Test auf jsfiddle Click