mardi 20 juin 2017

Testing grommet Layer component


I'm using grommet with react to render my application's UI. I have a Layer component shown when user click a button. Everything works fine but I don't know how to test Layer's children. I'm using enzyme, mocha and chai as test suite. This is code the code of my component:

<Layer align="right" closer>
    <Header size="large" justify="between" align="center">
        <Button icon={<CloseIcon />} plain={true} onClick={ props.hide }/>
    </Header>
    <Section key={index} pad=>
        { props.list }
    </Section>   
</Layer>

and this is my test:

const wrapper = shallow(<MyComponent />);
const layer = wrapper.find(Layer);

//this works
expect(layer).to.have.length.of(1);

const section = layer.find(Section);

//and this fails
expect(section).to.have.length.of(1);

Looking at the rendered component in the application, I found that grommet render his Layer component in this way:

<Layer><span style=></span></Layer>

Anyone can help me? Thank you

Aucun commentaire:

Enregistrer un commentaire