Wie kann ich window.location.Patchname auf meine Testdatei mit Jest bekommen?

Question

Ich habe reagieren app wurde von create-react-app mit jest und enzym zum testen gemacht

Also wie kann ich den Wert von window.location.pathname in meine Testdatei bekommen?

Das ist mein spec

import React from 'react'; 
import MovieDetailsBox from '../../src/components/movie_single/MovieDetailsBox'; 
import { expect } from 'chai'; 
import { shallow } from 'enzyme'; 
import { movie_details } from '../../src/data/movies_details' 
import { empty_user } from '../../src/helper/sessionHelper'; 

jest.mock('react-router'); 

describe('Test <MovieDetailsBox /> Component',() => { 

    let movie_details_props = { 
     movie: {...movie_details} 
    } 

    let user_props = { 

    } 

    const context = { router: { isActive: (a, b) => true } } 

    const wrapper = shallow(
     <MovieDetailsBox movie={movie_details_props} 
         user={user_props} 
         currentPath={'/movie/68'}/>, { context } 
    ) 

    const movie_data_check = movie_details_props.movie; 

    it('MovieDetailsBox call correct function on rating box',() => { 
     wrapper.find('.hidden-xs .rate-movie-action-box button').simulate('click') 

     if(!empty_user(user_props)){ 
      expect(window.location.pathname).to.equal('/login') 
     } else { 
      console.log('have user wow') 
     } 
    }) 
}) 

Aber ich habe dies als Fehler auf meiner Konsole

AssertionError: expected 'blank' to equal '/login' 

Es scheint wie window.location.pathname Rückkehr leer statt aktuellen URL-Pfadnamen.

Also, wie kann ich das beheben oder muss ich etwas anderes SetupTests.js Datei einrichten?

Danke!

Answer 1

Ich bin mir nicht sicher, ob ich die Logik Ihrer Komponente bekomme, aber ich schlug vor, Methoden von react-router anstelle von window.location zu verwenden. Um Benutzer auf bestimmte Seite Verwendung zu schieben:

browserHistory.push('/login'); 

Als Ergebnis kann der Test wesentlich einfacher,() aus Sinon.js oder Spion von Jest https://facebook.github.io/jest/docs/mock-functions.html

Beispiel mit Spion verwenden Spion geschrieben werden:

it('should redirect user to pathname=/delegation if pathname=/play',() => { 
    const spyBrowserHistory = spy(); 
    mobileDelegationRewireAPI.__Rewire__('browserHistory', { 
     push: spyBrowserHistory 
    }); 
    const wrapper = shallow(<MobileDelegation {...location} />); 
    wrapper.instance().componentDidMount(); 
    expect(spyBrowserHistory.calledOnce).to.be.true; 
    expect(spyBrowserHistory.calledWith(`/delegation${location.search}`)).to.be.true; 
}); 

Also die Idee ist zu testen, ob Methoden, die den Standort wechseln müssen, mit korrekten Parametern aufgerufen werden.

Answer 2

Versuchen Sie zu verwenden: expect(location.pathname).to.equal('/login').

In meinen Tests die location ist eine globale Variable, die Sie bekommen können, als ob es window.location war, und wenn Sie die fullpath benötigen, versuchen: location.href.

Answer 3

Fügen Sie testURL in Ihre Konfigurationsdatei ein. Zum Beispiel (package.json):

"jest": { 
.... 
    "testURL": "http://test.com/login" 
.... 
} 

standardmäßig Scherz gesetzt window.location.href als "about: blank". Nachdem Sie testURL festgelegt haben, verwenden Sie es als Testumgebung, url und location.href erhalten diesen Wert.

Sie können darüber lesen: https://facebook.github.io/jest/docs/en/configuration.html#testurl-string