Comment accéder à l'objet de l'histoire dans Jest

Question

J'ai une si elle est conditionnelle qui ressemble à ceci:

if (history.state !== null && history.state.query) 

Le problème est que si cela ne fonctionne pas en plaisantant, comme history est un objet vide dans mes tests .

Que faut-il faire dans mes tests pour utiliser l'objet history? Je cours cela en utilisant React sur un serveur Node.js. Je ne sais pas si cela compte, mais j'utilise aussi React Router.

Cas de test:

beforeEach(() => { 
    window.ga = jest.fn(); 
    window.analytics = jest.fn(); 
    window.analytics.track = jest.fn(); 
}); 

it('should set up props from history state',() => { 
    let location = { 
    pathname: '/explore', 
    query: { 
     query: 'yahoo', 
    }, 
    }; 

    global.history = { state: { query: 'google'} }; 

    const wrapper = mount(
    <LandingPage location={location} /> 
); 

    console.log("global.history.state: " + global.history.state); // prints null 
}); 

Une partie du composant (ne peut pas mettre tout le composant):

if (props.location && props.location.pathname === '/explore') { 
    explorePath = true; 
    skipIntro = true; 
    explore = true; 

    /* checks if history.state is not equal to null 
    * if check passes, search query and results will appear 
    */ 
    if (history.state !== null && history.state.query) { 
    currentValue = history.state.query; 
    employeeMin = history.state.eMin; 
    employeeMax = history.state.eMax; 
    revenueMin = history.state.rMin; 
    revenueMax = history.state.rMax; 
    } 
} else { 
    explore = skipIntro; 
} 

Answer 1

Vous devez utiliser createMemoryStore pour se moquer history comme ceci:

import React from 'react' 
import { shallow } from 'enzyme' 
import { createMemoryHistory } from 'history' 

import Page from '../Page' 

describe('<Page />',() => { 
    it('should render correctly',() => { 
    const history = createMemoryHistory('/dashboard') 
    const renderedComponent = shallow(
     <Page history={history} /> 
    ) 
    expect(renderedComponent).toMatchSnapshot() 
    }) 
}) 

Références:

• https://github.com/ReactTraining/react-router/issues/465#issuecomment-193541772
• https://github.com/ReactTraining/react-router/issues/4558#issuecomment-281063572

Answer 2

Cela a fonctionné pour mon scénario, qui semble similaire à la vôtre.

beforeAll(() => { 
    window.history.replaceState({query: 'google'}, 'MOCK'); 
});