javascript - Enzyme cannot find child component in shallow test -




is not correct way render react/reflux test enzyme without store, ie, "dumb"

import react 'react' import { shallow, render } 'enzyme' import { controls } '../controls' // named export import loadingspinner '../loadingspinner' let wrapper let loadingflags = {   controls: true } describe('<controls />', () => {   it('should render loading spinner', () => {     wrapper = shallow(<controls loadingflags={loadingflags} />) // ensures spinner show until data ready     expect(wrapper.length).toequal(1) // test passes     expect(wrapper.find(loadingspinner)).to.have.length(1)     // ^ typeerror: cannot read property 'have' of undefined   }) }) 

when log wrapper.html() can see <img class='spinner' /> rendered, enzyme cannot find component. me, docs indicate should doing. suppose check child class, seems messier checking component itself, eg class changes within spinner component.

how can test existence of child component?

you should use mount().

from https://github.com/airbnb/enzyme/blob/master/docs/guides/jsdom.md

import test 'ava'; import react 'react'; import { mount, shallow, render } 'enzyme'  import loadingspinner, {controls} './loadingspinner'; // jsdom init start const { jsdom } = require('jsdom');  const jsdom = new jsdom('<!doctype html><html><body></body></html>'); const { window } = jsdom;  function copyprops(src, target) {     const props = object.getownpropertynames(src)         .filter(prop => typeof target[prop] === 'undefined')         .map(prop => object.getownpropertydescriptor(src, prop));     object.defineproperties(target, props); }  global.window = window; global.document = window.document; global.navigator = {     useragent: 'node.js', }; copyprops(window, global); // jsdom init end  test('<controls />' , t => {     let wrapper = shallow(<controls />);     let mntwrapper = mount(<controls />);     t.true(wrapper.length == 1);     t.true(wrapper.find(loadingspinner).length === 1);      t.true(mntwrapper.find("img").length === 1);     t.true(mntwrapper.render().find('img').length === 1);     // if need test attributes check below.     t.true(mntwrapper.render().find('img')[0].attribs.src.indexof('foo') >= 0); }); 




wiki

Comments

Popular posts from this blog

Asterisk AGI Python Script to Dialplan does not work -

python - Read npy file directly from S3 StreamingBody -

kotlin - Out-projected type in generic interface prohibits the use of metod with generic parameter -