nazywając setstate na reactjs komponentu z utils testowych nie ponownego renderowania komponentu

Question

Mam następujący kod w teście opartym na żartach:

it('will show the hero loop if there is one', function() { 

    var React = require('react/addons'); 
    var ShowsDetailHeader = require('../../../../routes/shows/components/ShowsDetailHeader.jsx'); 
    var mockData = require('../../../../mock/episodeDetailData'); 
    mockData.data.show.assets._webHeroVideoUrl = 'https://test.video.com'; 

    var Subject = require('../../../../mock/stubRouterContext')(ShowsDetailHeader, { 
     show: mockData.data.show 
    }); 

    var TestUtils = React.addons.TestUtils; 

    var showsHeader = TestUtils.renderIntoDocument(
     <Subject /> 
    ); 

    showsHeader.setState({ 
     showVideo: true 
    }); 

    var videoClass = TestUtils.findRenderedDOMComponentWithClass(showsHeader, 'flex-video').getDOMNode().getAttribute('class'); 

    expect(videoClass.indexOf('in')).toBe(-1); 

    console.log(videoClass); 


    }); 

Moje poprzednie badania Badania stanu początkowego składnika. Teraz chcę wywołać setState, aby sprawdzić komponent po zmianie stanu. Kategoria VideoClass, w której się teraz loguję, pozostaje taka sama. Odpowiadam 0.12. i najnowsze jest 0.4.0.

Jakieś pomysły dotyczące testowania tego, co dzieje się po ustawieniu stanu?

Answer 1

setState jest asynchroniczny, więc prawdopodobnie trzeba

showsHeader.setState({ 
     showVideo: true 
    }); 
jest.runAllTicks(); 
find ... 
expect ... 

Ale myślę, że państwo powinno być prywatne i nie powinno być bezpośrednie zmienione, państwo powinno być zmiana wewnątrz komponentu, bo przez ui zdarzenia lub zmiany danych. opcja używa publicznie props, jeśli chcesz zmienić komponent z zewnątrz.