Les tests de snapshots réagissent au composant qui dépend de l'injection dans le magasin mobx

Question

J'ai essayé de comprendre comment effectuer un simple test de snapshots pour quelques composants dans lesquels des magasins Mobx sont injectés. Voici un exemple:

À la racine, j'ai un <Provider> enveloppant tout le trèfle à ma dernière ReactDOM.render() dans le point d'entrée. (Non représenté ici)

// component.js 

...{imports}... 
@inject('mystore') 
@observer 
export default class extends React.Component { 
    render() { 
    return (
     <div>Stuff</div> 
    ) 
    } 
} 

// component.test.js 

import React from 'react'; 
import ReactDOM from 'react-dom'; 
import renderer from 'react-test-renderer'; 
import Component from './' 

it('renders a snapshot',() => { 
    const tree = renderer.create(<Component/>).toJSON(); 
    expect(tree).toMatchSnapshot(); 
}); 

je reçois un test a échoué parce qu'il manque un magasin fourni l'arbre. Je l'ai essayé l'exportation d'un composant « undecorated » comme ceci:

// in component.js 
...{same as above}... 

export const undecorated = Component 

puis importer le composant undecorated dans mon test instantané, mais cela ne fonctionne pas.

Des idées?

Answer 1

Vous devriez être en mesure de passer le magasin comme explicitement:

const tree = renderer.create( <Component.wrappedComponent myStore={store}/>).toJSON(); )